Messenger clone with nextjs and mongodb, tailwind css and Deploy with vercel
A messenger clone app typically includes the following features:
Group chats and one-on-one messaging
Message attachments and file sharing
User profile customization and settings
As for the technical aspects, here are some of the features that you might find in a messenger clone app:
How to write POST, GET, and DELETE routes in route handlers (app/api)
How to fetch data in server React components by directly accessing the database (WITHOUT API! like Magic!)
Handling relations between Server and Child components in a real-time environment
Creating and managing chat rooms and channels
→ Setup .env file:
• DATABASE_URL=
• NEXTAUTH_SECRET=
• NEXT_PUBLIC_PUSHER_APP_KEY=
• PUSHER_APP_ID=
• PUSHER_SECRET=
• NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME=
• GITHUB_ID= • GITHUB_SECRET=
• GOOGLE_CLIENT_ID=
• GOOGLE_CLIENT_SECRET=
→ Setup Prisma
npx prisma db push
Start the app
npm run dev
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more details.