🚀 CapsiTech Module 4: TechBlog - A MERN Stack Blogging Platform

Welcome to TechBlog, a powerful and interactive blogging platform built using the MERN stack (MongoDB, Express.js, React.js, and Node.js). 🌍💻 This platform allows users to write, publish, and engage with blogs, fostering an active tech community. 🚀

📌 Live Link

👉 View Live Project

📌 API EndPoints Documentation

👉 View API Documentation

📌 Demo Video of Whole Project

👉 View Demo video

📌 Key Features

🔐 User Authentication

• ✅ Secure sign-up, login, and logout functionality.
• ✅ JWT-based authentication for secure user sessions.
• ✅ Password hashing using bcrypt.js to enhance security.

📝 Blog Management

• ✅ Registered users can create, edit, and delete blog posts.
• ✅ Published blogs are accessible to all users.
• ✅ Clean and responsive UI for easy content management.

💬 Comment System

• ✅ Users can post comments on blogs.
• ✅ Comments update in real-time, promoting active discussions.

📱 Responsive Design

• ✅ Optimized for all devices – desktops, tablets, and mobiles.
• ✅ Tailwind CSS ensures a modern, sleek UI.

🛠️ Technologies Used

🌟 Frontend

• ✅ React.js (with Hooks & Context API) – for an interactive UI.
• ✅ Tailwind CSS & Fluent UI – for fast, seamless, and responsive styling.
• ✅ Formik & Yup – for form validation and handling.

🚀 Backend

• ✅ Node.js & Express.js – for building the server-side API.
• ✅ MongoDB & Mongoose – for a robust database structure.
• ✅ JWT (JSON Web Tokens) – for user authentication.

🔧 Other Tools

• ✅ Axios – for smooth frontend-backend communication.
• ✅ bcrypt.js – for secure password hashing.
• ✅ dotenv – for managing environment variables.

📥 Installation and Setup

🔰 Prerequisites

Before you begin, ensure you have the following installed on your system:✔️ Node.js and npm (Node Package Manager) 🟢✔️ MongoDB (running locally or via MongoDB Atlas) 🗄️

📂 Installation Steps

1️⃣ Clone the Repository 🛠️

git clone https://github.com/srinjoywork/techblog.git cd techblog

2️⃣ Install Dependencies 📦

npm install

3️⃣ Set Up Environment Variables 🌍

• Create a .env file in the root directory.

• MONGO_URI=your_mongodb_connection_string

• JWT_SECRET=your_secret_key

4️⃣ Run the Backend Server 🏃‍♂️

npm run server

5️⃣ Start the Frontend 🎨

npm start

6️⃣ Open the Application 🚀

• 📌 Visit http://localhost:3000/ in your browser.

📌 Future Enhancements

🚀 Like & Share Blogs – Allow users to like & share blog posts.🚀 User Profiles – Personalized profiles with bio & social links.🚀 Categories & Tags – Organize blogs for better discoverability.🚀 Dark Mode 🌙 – Enhance user experience with theme switching.

🙌 Conclusion

TechBlog is a dynamic and interactive blogging platform built with the MERN stack. 🌟 Whether you're a developer sharing knowledge or a reader looking for insights, this platform provides a seamless experience. Happy blogging! 📝🚀