I have worked on this project on a short period of time so that I can learn about how NextJS work overall. It was a fun experience and I'm super happy with the result. You might noticed a delayed response on initial load which may take from under 100ms to over 1s as stated in this link due to Vercel's Serverless Function having to spin up for the first time (Cold Boot) because of inactive traffic of the website.
Prompt.io is a place where people can upload and explore other people AI prompts!
Features
- Upload your own prompts
- Explore other people prompts
- Create, edit, and delete your own prompts
- Authentication with Google using NextAuth.js
- Search for prompts by user, description, or tags
- Copy and paste prompts to clipboard
- Website is mobile friendly
Frameworks
- Next.JS – React framework for building performant apps with the best developer experience
- NextAuth.js – Handle user authentication with ease with providers like Google, Twitter, GitHub, etc.
Platforms
- Vercel – Easily preview & deploy changes with git
- MongoDb - Database for storing user data and prompts
UI
- Tailwind CSS – Utility-first CSS framework for rapid UI development
- DaisyUi – Component library for Tailwind CSS
- React SVG Icon – Beautifully simple, pixel-perfect icons
- react-if – Simple React component that makes if else statement on React component more readable
- react-content-loader - SVG component to create placeholder loading, like Facebook cards loading or also known as skeleton UI
Hooks and Utilities
- use-debounce – Debounce a function call / state update
Code Structure
- React Atomic Design - Popularly known within the design world, Atomic Design helps to build consistent, solid and reusable design systems
Code Quality
- TypeScript – Static type checker for end-to-end typesafety
- Prettier – Opinionated code formatter for consistent code style
- ESLint – Pluggable linter for Next.js and TypeScript