Quillier

🌐 Quillier - A Modern Blogging Platform

🚀 Project Overview

✨ Key Features

• 🔐 User Authentication:
• Secure Google Sign-In integration using Firebase
• Role-based access control

• 📝 Rich Text Editing:
• Interactive content creation with Quill editor
• Intuitive and user-friendly writing experience

• 💬 Interactive Comments:
• Real-time commenting system
• Engage and interact with blog posts
• Nested comment threads

• 🎨 Dynamic Theming:
• Light and dark mode switching
• Personalized user interface

• 👑 Role Management:
• Admin privileges for comprehensive content management
• Granular access controls

• 📱 Responsive Design:
• Mobile-first approach
• Tailwind CSS for adaptive layouts

🖼️ Application Preview

🛠️ Tech Stack

Frontend

• Framework: React 18 with Vite

• State Management: Redux Toolkit

• Styling: Tailwind CSS

• Authentication: Firebase

• Rich Text Editor: Quill

Backend

• Runtime: Node.js

• Framework: Express

• Database: MongoDB with Mongoose

• Authentication: JWT

• Password Security: Bcrypt

🚀 Local Setup

Prerequisites

• Node.js (18.x)

• npm or yarn

• MongoDB instance

Installation Steps

1. Clone the Repository

git clone <https://github.com/HarshDodiya1/Quillier.git>
cd Quillier

2. Install Dependencies

# Install client dependencies
cd client
npm install

# Install server dependencies
cd ../server
npm install

3. Configure Environment Variables
Client (.env)

VITE_API_BASE_DEV=YOUR_SERVER_URL
VITE_FIREBASE_API_KEY=YOUR_FIREBASE_APIKEY

Server (.env)

REACT_APP_API_URL_DEV=YOUR_FRONTEND_URL
PORT=3000
MONGO_URL=YOUR_MONGODB_CONNECTION_STRING
JWT_SECRET=YOUR_JWT_SECRET_KEY

4. Run Development Servers

# Start client
cd client
npm run dev

# Start server (in another terminal)
cd server
npm run start

🌟 Project Journey

• Learning Authentication: Implementing Firebase Google Sign-In

• Interactive Editing: Mastering the Quill editor for rich text experiences

• Design Flexibility: Creating dynamic theme switching

• Security First: Developing role-based access controls

• User Experience: Building an intuitive admin dashboard

🤝 Contributing

1. Fork the repository

2. Create your feature branch (git checkout -b feature/AmazingFeature)

3. Commit your changes (git commit -m 'Add some AmazingFeature')

4. Push to the branch (git push origin feature/AmazingFeature)

5. Open a Pull Request

📜 License

📞 Contact