Overview:
The Reddit Clone project is a web application that aims to replicate the functionality of the popular social platform Reddit. It includes features such as creating and joining communities, upvoting and downvoting posts, dark mode and light mode, user profiles, and live chat. The project is built using Next.js and Chakra UI, and it integrates with Firebase for authentication and storage.
Features:
- Create and join communities
- Upvote and downvote posts
- Dark mode and light mode
- User profile section
- Live chat functionality
- Integration with Firebase for authentication and storage
Installation:
To install the Reddit Clone project, follow these steps:
- Sign up for a Firebase account here.
- Install Node.js on your computer. You can download it here.
- Set up environment variables by adding the following values to your project’s
.env
file:
NEXT_PUBLIC_FIREBASE_API_KEY=YOUR_FIREBASE_API_KEY
NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=YOUR_FIREBASE_AUTH_DOMAIN
NEXT_PUBLIC_FIREBASE_PROJECT_ID=YOUR_FIREBASE_PROJECT_ID
NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=YOUR_FIREBASE_STORAGE_BUCKET
NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=YOUR_FIREBASE_MESSAGING_SENDER_ID
NEXT_PUBLIC_FIREBASE_APP_ID=YOUR_FIREBASE_APP_ID
NEXT_PUBLIC_BASE_URL=YOUR_BASE_URL
NEXT_PUBLIC_CRYPTO_SECRET_PASS=YOUR_CRYPTO_SECRET_PASS
- Install project dependencies by running the following command in your project directory:
npm install
- Install Chakra UI by running either of the following commands in your Next.js project directory:
npm install @chakra-ui/react @emotion/react@^11 @emotion/styled@^11 framer-motion@^4
- Set up the ChakraProvider by going to either
pages/_app.js
orpages/_app.tsx
and wrapping the Component with the ChakraProvider component. - Run the project locally by executing the following commands:
npm run dev
- Open
http://localhost:3000
in your browser to see the running application.
Summary:
The Reddit Clone project is a web application that replicates the functionality of Reddit. It allows users to create and join communities, upvote and downvote posts, switch between dark and light modes, and engage in live chat conversations. The project is built using Next.js and Chakra UI, and it integrates with Firebase for authentication and storage. To install the project, follow the provided installation guide.