This app is built around latest Next.js stack. It is composed of the best practices described in official docs combined with my decisions derived from my own experience and knowledge that I have gathered.

Demo

Live production demo:

• https://skytra.vercel.app

Screenshots

Desktop:

Mobile:

Features

Tech Stack:

React 18.2.0, Next.js 13.0.1, Node.js 16.17.0, Mongodb 4.13.0, TypeScript 5.0.2, Redux, Axios, Redux toolkit, RTK query, React Hook Form, Zod, sass 1.56.0, TailwindCSS 3.3.0, Jest 29.4.2, Testing Library React.

Frontend:

• authentication with next-auth,Google and Credentials providers
• uses all Next.js features - routing, SSR, SEO, Image component, error pages, .env* files...
• fully responsive design with TailwindCSS, SCSS and BEM
• fully configured TypeScript, ESLint and Prettier
• loading and error states handled with Suspense and ErrorBoundary
• forms with React Hook Form, Zod validation schemas
• data fetching and server state with RTK query and custom hooks

Backend:

• uses Next.js API
• Mongodb atlas
• next-connect API handlers with middleware for validation and protected routes
• request objects validated with Zod schemas

Testing:

• Jest and testing-library/react for unit and integration tests

Production:

• Dockerized ready to be deployed on VPS