project_promptopia Tailwind Templates

Project_promptopia

Promptopia is an innovative web application built using Next.js, MongoDB, and Tailwind CSS. It provides users with a platform to discover, create, and share intriguing prompts for AI based softwares like chatGPT, and fostering creativity and engagement within the community. With seamless Google Sign-In integration.

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.

Next.js mongodb tailwindcss

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.

Share Prompts: šŸ“£ Share your most captivating prompt messages with the community.

  • 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.

MongoDB Integration: šŸ—ƒļø MongoDB stores prompt messages and user information reliably.

  • 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:

  1. Clone the repository: git clone https://github.com/priyyasi/project_promptopia.git
  2. Navigate to the project directory: cd promptopia
  3. Install dependencies: npm install
  4. 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=
  1. Start the development server: npm run dev
  2. 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! šŸŒŸšŸŽˆ

Top categories

Loading Svelte Themes