Mysterymsg is a full stack application built with Next.js and TypeScript. Mysterymsg allows users to create their profile which then creates their unique profile link which users can copy to send anonymous messages. The identity of people sending messages is kept entirely hidden. Another feature is AI Integration with Gemini. Mystermysg includes ai-generated messages with the help of google-2.0-flash model. Throughout the whole project I have used shadcn for sleek UI.
✨FEATURES: Here's a overview of features:
- Send and receive anonymous messages
- Unique profile links for sharing
- Sender's identity stays hidden
- Authentication in sign-in is done using NextAuth.js
- Custom built sign-up flow
- Built with TypeScript for safety.
- Embedded Gemini AI model to generate/suggest messages.
🚀 TECH STACK
- Framework: Next.js (https://nextjs.org/)
- Language: TypeScript
- Authentication: NextAuth.js (https://next-auth.js.org/)
- UI components: shadcn (ui.shadcn.com)
📸 ✨SCREENSHOTS
1.) Landing Page
2.) Sign up and Sign in page
3.) User Dashboard
4.) User's unique profile link
an example of ai-generated messages
- Clone the repository
git clone https://github.com/yourusername/mysterymsg.git
- Install Dependencies
npm install
- Set up environment variables
MONGODB_URI=""
RESEND_API_KEY=""
NEXTAUTH_SECRET=""
GEMINI_API_KEY=""
- Run the dev server
npm run dev
Open http://localhost:3000 with your browser to see the result.
You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.
This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.