next email client

Next.js 이메일 클라이언트

이것은 Next.js 및 Postgres로 구축 된 이메일 클라이언트 템플릿입니다. 앱 라우터의 일부 기능을 과시하기 위해 만들어졌으며 다음과 같은 제품을 구축 할 수 있습니다.

• 스크롤 위치를 유지하는 동안 열 레이아웃의 경로를 탐색하십시오 (레이아웃 지원)
• JavaScript가 활성화되지 않은 양식 제출 (Progressive Enhancement)
• 경로 사이를 매우 빠르게 탐색하십시오 (프리 페치 및 캐싱)
• Reload (URL 상태)에서 UI 위치를 유지하십시오.

데모 : https://next-email-client.vercel.app

기술 스택

• 프레임 워크 : Next.js
• 데이터베이스 : Postgres
• ORM : 이슬비
• UI 라이브러리 : Shadcn/UI

시작하기

git clone https://github.com/leerob/next-email-client
cd next-email-client
pnpm install

현지에서 실행

포함 된 설정 스크립트를 사용하여 .env 파일을 만듭니다.

pnpm db:setup

그런 다음 데이터베이스 마이그레이션을 실행하고 이메일 및 폴더로 데이터베이스를 시드하십시오.

pnpm db:migrate
pnpm db:seed

마지막으로 다음으로 실행됩니다. JS Development Server :

pnpm dev

브라우저에서 http : // localhost : 3000을 엽니 다.

구현

• ✅ 이메일을 검색하십시오
• ✅ 사용자 정보가있는 프로필 사이드 바
• ✅ 모든 스레드를 봅니다
• ✅ 스레드에서 모든 이메일을 봅니다
• view를 구성하십시오
• 종자 및 설정 스크립트
• ✅ 검색 된 텍스트를 강조합니다
• compose Compose View
• ✅ 이메일 삭제 (휴지통 이동)
• 측면 프로필을 동적으로 만드십시오
• Markdown 지원?
• 화살표를 구성/아래로 스레드에서 작동합니다
• 글로벌 키보드 바로 가기
• 더 나은 날짜 서식
• 다크 모드 스타일