전체 글 9

JavaScript로 네이버 SENS 메시지 발송하기

네이버 SENS로 메시지를 발송하기에 앞서 준비해야할 사항이 3가지 있습니다(로그인이 필요).API키 (Access Key, Secret Key 총 2개) : 공식문서를 참고해주세요프로젝트 ID: 프로젝트 생성 바로가기발신번호 등록: 바로가기 환경변수NCLOUD_ACCESS_API_KEY=""NCLOUD_SECRET_KEY=""NCLOUD_SERVICE_ID=""NCLOUD_SENDER=""NCLOUD_RECEIVER="" 발급받은 KEY, ID를 환경변수에 추가합니다. 시그니처 생성 함수요청 정보를 API 인증키(AccessKey에 맵핑되는 SecretKey)로 암호화한 후 Base64로 인코딩하여 생성하는 서명값입니다. 암호화에는 HMAC 암호화 알고리즘(HmacSHA256)이 사용됩니다.출처: 네이..

구글폼 제출시 Apps Script로 이메일 전송하기

구글폼은 구글 스프레드 시트와 연결이 가능합니다. 이메일 전송 코드 작성 Apps Script에 처음 접속하면 myFunction 함수가 있는데, 자유롭게 함수명을 변경해서 사용할 수 있습니다. function sendEmail() { MailApp.sendMail("dasoslab@gmail.com", "신규 폼 제출", "바로가기 링크: https://example.com") ;} MailApp의 sendMail 함수를 이용하면 메일을 보낼 수 있습니다. 파라미터 순서는 다음과 같습니다.이메일 주소제목내용  코드 작성 후 우측 상단에 배포 버튼을 눌러 배포를 진행해줍니다.  유형 선택에서 웹 앱을 선택하고, 설명은 자유롭게 작성 후 배포해줍니다. 트리거 등록 사이드바에서 트리거 메뉴로 이동합니다. ..

더 좋은 결과를 위한 AI 프롬프트

AI를 사용하다 보면 원하는 결과를 한 번에 얻는 것이 굉장히 어렵다는 생각이 듭니다. 끝없는 프롬프트를 하는 것은 정말 피곤한 일인데요. 저도 오늘 "왜 이렇게 말을 한 번에 못 알아듣지?"라는 생각을 하며 AI와 대화를 했습니다... 하지만 프롬프트의 구조와 전략을 잘 세우면 한 번에 원하는 결과를 얻을 수 있습니다. 이 글을 통해 AI가 이해하기 쉬운 형태로 프롬프트를 작성하는 팁을 얻어가셔서 무한 프롬프트에서 벗어날 수 있기를 바라봅니다. 프롬프트란?프롬프트는 AI(인공지능)이 해야 할 일을 알려주는 명령문입니다. AI가 어떤 작업을 수행해야 할지 알려주는 거죠. 퀄리티 있는 결과물을 출력하기 위해 좋은 AI 모델을 사용하는 것도 좋지만 좋은 프롬프트를 작성하는 것도 중요합니다. 예를 들어, "..

AI 2024.11.27

Supabase CLI 사용해서 데이터베이스 내보내기, 불러오기

Supabase를 사용하다보면 데이터베이스를 다른 계정으로 옮기거나, 새로운 데이터베이스 서버로 마이그레이션 해야 하는 상황이 발생할 수 있습니다. 저의 경우 Supabase 클라우드를 사용하고 있고, 계정 A에 있던 데이터베이스를 계정 B로 이동해야 했습니다. 이 글에서는 Supabase 데이터베이스 데이터를 옮기는 방법에 대해 다루고 있으며, Supabase Auth는 사용하고 있지 않는 상태였다는점 참고해주세요. Supabase CLI 설치먼저, Supabase cli를 설치해줍니다. macOS에서는 brew를 사용해 바로 설치가 가능합니다.brew install supabase/tap/supabase 운영체제에 따라 설치 방법이 다르니 공식문서를 참고해주세요.CLI 설치 공식문서: 바로가기 환경 ..

백엔드/Supabase 2024.11.25

불안이 동기부여가 될 수 있을까: 현재에 집중하기

이번 글에서는 제 개인적인 이야기를 해보려고 합니다. '기술적인 문제를 다루기 위해 개설한 블로그에 개인적인 감정에 대한 글을 쓰는 게 맞나?' 하는 고민은 들었으나, 고민을 통해 성장하고 기록이 쌓여 내가 된다고 생각해서 용기를 갖고 글을 작성하게 되었습니다. 저는 10월부터 지인(동료)과 함께 글쓰기에 관련된 서비스를 만들고 있습니다. 동료와 함께 기획을 했고, 현재는 제가 개발 부분을 온전히 맡아 진행하고 있습니다. 초기 단계이기 때문에 쉽고 빠르게 돌아가는 서비스를 만들자라는 생각으로 Next.js, Tailwind, Supabase, Vercel 기술을 선택했죠. 서로 다른 사람이 만나 함께 하나의 목표를 갖고 달려가는 것은 참 즐겁고 행복한 일입니다(쓰고나니 결혼식 축사 같네요). 우리 서비스..

생각 2024.11.24

Next.js에 구글 애널리틱스(GA) 쉽게 적용하기

구글 애널리틱스는 웹사이트에서 방문자들의 행동을 분석할 수 있는 도구입니다. 이 도구를 사용하면 여러 지표들을 확인할 수 있습니다. 예를 들어, 방문자가 검색을 통해 유입되었는지, SNS 링크를 통해 들어왔는지 확인할 수 있습니다. 또한 특정 페이지에 오래 머무는지, 빨리 떠나는지 알 수 있습니다. 이 도구를 사용하면 고객에 대한 이해를 높이고 어떤 콘텐츠나 상품에 관심이 있는지 파악할 수 있습니다. 이를 바탕으로 더 매력적인 콘텐츠나 상품을 중심으로 웹사이트 구조를 설계할 수 있습니다. 긍정적인 피드백도 좋지만 부정적인 피드백을 통해 문제를 개선할 수 있습니다. 특정 페이지에서 체류 시간이 짧다면 이는 사용자가 "이 페이지는 별로 매력적이지 않다."는 메시지를 주는 것과 같습니다. 이 페이지를 개선해 ..

Gemini API 사용법과 JSON 구조 응답 받는 방법

다양한 AI 모델이 존재하며, 각 모델마다 특징과 장단점이 다 다릅니다. 이 글에서는 Gemini를 소개합니다. Gemini는 2024년 11월 기준 무료로 사용해볼 수 있으며, 사용 한도가 있지만 테스트용이나 토이 프로젝트에 적용하기에 충분한 수준의 사용량을 제공합니다. 가성비있게 AI 서비스를 만들어보고 싶다면 ChatGPT와 Claude보다 Gemini가 훨씬 나은 선택이라고 생각합니다.  이 글에서는 Gemini API를 간단하게 사용해보고 JSON 형태의 구조화된 응답을 받는 방법에 대해 다룹니다. 더 자세한 내용은 공식문서를 참고해주세요.공식문서: 바로가기 API 키 발급 Google AI Studio에서 API 키를 발급받을 수 있습니다. 처음 사용하시는 분들은 간단히 가입한 후 API 키..

AI 2024.11.18

Next.js Vercel Functions timeout(시간초과) 해결 방법

테스트를 위해 Vercel에 배포한 서비스에서 timeout이 발생했습니다. 연산 시간이 긴 함수를 실행했을 때 발생했고 콘솔에 나온 오류는 504 Gateway 였습니다.  Vercel Functions는 플랜에 따라 기본값과 최대값이 다릅니다. (공식문서 바로가기) 플랜최소최대Hobboy (무료)10초60초Pro15초300초Enterprise15초900초 저는 무료 플랜을 사용하고 있어서 기본값이 10초였고, 10초가 지나자 timeout이 발생했습니다. 만약 60초 이상의 복잡하고 긴 연산을 해야하는 경우 Pro 버전으로 업그레이드를 해야합니다. 이 글에서는 기본값을 최대로 수정하는 방법에 대해 설명합니다. 대시보드에서 설정 프로젝트의 설정 페이지의 Functions 메뉴로 가면 Function M..

Auth.js(Next Auth) 사용자 인증 쉽게 구현하기

Auth.js는 구글, 카카오, 네이버 등 다양한 로그인 방법을 제공해 사용자 인증 및 세션 관리를 쉽게 구현할 수 있도록 하는 라이브러리입니다. 구글, 카카오 등과 같은 소셜 로그인 서비스를 Auth.js에서는 인증 프로바이더라고 합니다. Auth.js는 NextAuth의 이름이 변경된 버전이기 때문에, 이 라이브러리를 처음 접하시는 분들은 혼동할 수 있습니다. 초기에 Next Auth라는 이름으로 Next.js 프레임워크를 대상으로 개발되었는데, 현재는 Javascript의 다른 프레임워크나 서버 환경에서도 사용될 수 있도록 확장하면서 Auth.js로 이름을 변경했습니다. Next Auth로 검색하면 v4 사이트가 나오고, Auth.js로 검색하면 v5 사이트가 나오는데 이 글은 v5를 기준으로 작성..