Side Project/Feature 2

검색어 자동 완성 기능 구현하기

들어가며 이번에는 검색어 자동 완성 기능을 구현해 보겠습니다. 기능 기능은 크게 세 가지로 나눌 수 있습니다. 1. 검색어를 입력하면 해당 글자를 포함한 상품이 있는 경우 리스트로 표시해 줍니다. 2. Tab키, 위 방향키, 또는 아래 방향키를 눌러 리스트 내에서 움직일 수 있습니다. 현재 선택한 아이템을 표시해 주며,검색창에 이름이 입력됩니다. 3. 엔터키를 누르거나, 리스트 아이템을 클릭하면 해당 검색 결과로 이동합니다. 동작 과정 전체적인 동작 과정은 다음과 같은 모습입니다. 구현 예시 코드 아래는 구현 예시 코드입니다. import { useRouter } from 'next/router'; import { ChangeEvent, KeyboardEvent, MouseEvent, useEffect,..

Nodemailer를 사용해 이메일 인증 구현하기

들어가며 오늘은 nodemailer를 사용해 이메일 인증을 구현해 보겠습니다. nodemailer는 Node.js 애플리케이션에서 이메일을 쉽게 보낼 수 있도록 해주는 모듈입니다. Next.js를 사용한 프로젝트에서 진행했습니다. Nodemailer :: Nodemailer Nodemailer Nodemailer is a module for Node.js applications to allow easy as cake email sending. The project got started back in 2010 when there was no sane option to send email messages, today it is the solution most Node.js users turn to by de..