blogBloom is a full-stack blog application created using the MERN (MongoDB, Express.js, React, Node.js) stack. It allows users to register, login, create, edit, and view blogs with rich text content and embedded images.
- User Authentication: Register and login securely using bcrypt for password encryption and JSON Web Tokens (JWT) for token creation and verification.
- Blog Listing: View a list of blogs, limited to 20, with newer ones displayed at the top.
- Blog Creation and Editing: Create your own blogs with text content and embedded images. Edit your existing blogs.
- Frontend Design: Designed with React for a modern and responsive user interface.
- Styling: Styled using Tailwind CSS for a clean and aesthetic look.
- Rich-Text Editing: Utilizes React Quill as the rich-text editor for an enhanced blogging experience.
- React: JavaScript library for building user interfaces.
- Tailwind CSS: Utility-first CSS framework for styling.
- React Quill: A powerful and customizable rich-text editor for React.
- Express.js: Web application framework for Node.js, used for routing.
- Bcrypt: Library for password hashing and encryption.
- Cookie Parser: Middleware for parsing Cookie headers.
- CORS: Middleware for enabling Cross-Origin Resource Sharing.
- JSON Web Token: For generating and verifying tokens for user authentication.
- Multer: Middleware for handling multipart/form-data (used for image uploads).
- Mongoose: MongoDB Object Data Modeling (ODM) library for Node.js.
- MongoDB: NoSQL database used for storing blog data.
- Open the
clientfolder in your terminal. - Run
npm installto install the required dependencies.
- Open the
serverfolder in your terminal. - Create a folder named "uploads" for storing images.
- Run
npm installto install the required dependencies.
- In the
clientfolder, runnpm run devto start the frontend server. - In the
serverfolder, runnpm run devto start the backend server.
Visit http://localhost:5173 in your browser to access the blogBloom application.
Happy Blogging!