Live Demo: BuzzBox on Vercel
BuzzBox is a social media web application inspired by platforms like Twitter and Reddit. Built with Next.js and React.js, BuzzBox offers a full range of CRUD functionalities as well as additional features such as real-time changes, post sharing, and user authentication. Read below to learn more about its features and the technologies used.
Check out the live demo of the application here: BuzzBox on Vercel.
- User Authentication: Users can authenticate via trusted providers like Google, GitHub, Reddit, and Discord.
- CRUD Functionality: Users can create, read, update, and delete posts and spaces.
- Real-time Interaction: Real-time upvotes, downvotes, comments, and post sharing.
- Intuitive UI: The application is styled with TailwindCSS for better performance and user experience.
- Next.js: For server-side rendering and page routing.
- React.js: For building the UI components.
- Supabase: For real-time PostgreSQL database changes.
- Stepzen: To convert PostgreSQL to GraphQL for queries and mutations.
- Apollo Client: To interact with the database through the frontend.
- react-share: To enable share functionality for each post.
- next-auth: For authenticating users.
- Dicebear: To generate profile pictures and space images.
- Heroicons: To provide SVG icons.
- TailwindCSS: For styling.
- Vercel: For hosting and custom domain setup.
To run this project locally, follow these steps:
- Clone the repository:
git clone https://github.com/your-username/BuzzBox.git- Install dependencies:
cd BuzzBox
npm install- Set up environment variables:
# .env file
NEXT_PUBLIC_SUPABASE_URL=your_supabase_url
NEXT_PUBLIC_SUPABASE_KEY=your_supabase_key- Run the development server:
npm run devOpen http://localhost:3000 with your web browser to see the application.