Welcome to Promptopia! šāØ
Introduction š
Welcome to Promptopia, a delightful and whimsical web application crafted with Next.js, MongoDB, and Tailwind CSS. Dive into a world of creativity where you can share intriguing prompt messages with fellow users, all while enjoying the seamless integration of modern technologies.
Features š
Google Sign-In: š Sign in effortlessly using your Google account.
- Authentication and User Profiles: Secure logins and personalized experiences.
- Users can sign in using their Google accounts.
- New users are automatically registered and their profiles are created upon their first sign-in.
- User sessions are managed using NextAuth for seamless authentication.
- Authenticated users can create new prompts.
- Users can provide prompt content and associated tags.
- Prompts are associated with the user's profile and displayed in the feed.
Interactive Interface: š» Immerse yourself in an interactive and engaging user experience.
- Users can explore creative prompts submitted by the community.
- Each prompt displays the username of the creator, the prompt content, and associated tags.
- Users can click on tags to filter prompts by specific topics.
- Users can edit prompts they have created.
- Edits include updating the prompt content and tags.
- Users can also delete prompts they have created.
- Deletion removes the prompt from the feed and their profile, as well as from the database MongoDB.
User Profiles: š„ Users have personalized profile pages.
- Profiles display the user's username, email, and a profile image.
- Profiles showcase prompts created by the user.
- Users can edit and delete their prompts directly from their profile.
Tailwind CSS Styling: šØ Tailwind CSS provides sleek and modern styling for the UI.
- The navigation bar provides easy access to different sections of the application.
- It includes links to the home page, create prompt page, and user profile page.
- Navigation adapts for both desktop and mobile devices.
Technologies Used š©āš»
- React for building interactive user interfaces.
- Next.js for server-side rendering and routing.
- NextAuth for handling user authentication.
- MongoDB for storing user profiles and prompts.
- CSS styles and components for responsive and visually appealing design.
Getting Started š ļø
To embark on your Promptopia journey locally, follow these simple steps:
- Clone the repository:
git clone https://github.com/priyyasi/project_promptopia.git
- Navigate to the project directory:
cd promptopia
- Install dependencies:
npm install
- Create a
.env.local
file in the root directory and add the following environment variables:
GOOGLE_ID=your-google-id
GOOGLE_CLIENT_SECRET=your-google-client-secret
MONGODB_URI=your-mongodb-uri
NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_URL_INTERNAL=http://localhost:3000
NEXTAUTH_SECRET=
- Start the development server:
npm run dev
- Open your browser and navigate to
http://localhost:3000
Prompts Page š
š Homepage

š Signed In

š Tag filter

š Create Post

š Profile Page

š Edit Post

Credits š
A heartfelt thank you to Adrian Hajdin for inspiring and guiding us in the creation of this fantastic and fun project!
Support and Contribution š¤
Have questions, feedback, or ideas? Don't hesitate to open an issue or reach out to the project maintainers. Contributions are always welcome!
Let's join forces to make Promptopia an even more delightful place for creativity and fun! ššØ
Promptopia - Where creativity meets fun! šš