Cocoon

Cocoon is an article posting website built with React and Firebase. Users can post articles, like, comment, and interact with other users. It features a rich text editor to provide a seamless article writing experience.

Website link

https://cocoon-22320.web.app

Features

• Rich Text Editor: Create and edit articles with a full-featured editor.
• User Interaction: Like, comment, and interact with articles.
• Real-time Updates: Powered by Firebase for real-time updates.
• Responsive Design: Accessible on all devices.

Screenshots

Home Page

Article Editor

Article Page

Technologies Used

• Frontend: React, React Router
• Backend: Firebase Firestore
• Authentication: Firebase Authentication
• Text Editor: Tiptap
• Hosting: Firebase Hosting
• Styling: CSS Modules

Installation

1. Clone the repository:

   git clone https://github.com/your-username/cocoon.git

2. Navigate to the project directory:

   cd cocoon

3. Install the dependencies:

   npm install

4. Create a .env file in the root directory and add your Firebase configuration:

   REACT_APP_FIREBASE_API_KEY=your-api-key
   REACT_APP_FIREBASE_AUTH_DOMAIN=your-auth-domain
   REACT_APP_FIREBASE_PROJECT_ID=your-project-id
   REACT_APP_FIREBASE_STORAGE_BUCKET=your-storage-bucket
   REACT_APP_FIREBASE_MESSAGING_SENDER_ID=your-messaging-sender-id
   REACT_APP_FIREBASE_APP_ID=your-app-id

5. Start the development server:

   npm start

6. Open your browser and navigate to http://localhost:3000.

Usage

1. Sign Up/Log In: Create an account or log in to start posting articles.
2. Create an Article: Use the rich text editor to write and format your article.
3. Interact: Like and comment on articles to engage with the community.

Contributing

No contribution opened right now. Just for viewing source code and experiencing it.

License

This project is licensed under the MIT License.

Contact

For any inquiries or support, please contact your team: [email protected] [email protected] [email protected]