📬 E-Newsletter Platform (MERN Stack)

A full-stack web application that simulates a newsletter platform, built using the MERN stack and deployed on cloud platforms (Render and Vercel).

---

🔗 Live Website: eNewsletter

---

🎬 Sample Video: Video Link

---

🎯 Track Chosen + Why

Track: E-Newsletter

This track was chosen to simulate a real-world newsletter creation and publishing system similar to platforms like Substack. It demonstrates full-stack development skills by combining content creation, data persistence, REST APIs, and modern frontend design into a single, end-to-end application.

---

✅ Features Implemented

• Create newsletters with title, content, and scheduled date
• List all newsletters in a structured table view
• Read-only page to browse newsletters and read full content
• Navigation using a responsive navbar
• Light / Dark theme toggle
• Form validation with user feedback
• RESTful backend APIs
• Persistent storage using MongoDB Atlas
• Deployed backend (Render) and frontend (Vercel)

---

🛠 Tech Stack

Frontend

• React.js
• React Router
• Custom CSS (Light/Dark Theme)

Backend

• Node.js
• Express.js
• Mongoose

Database

• MongoDB Atlas (Cloud)

Deployment

• Frontend: Vercel
• Backend: Render

---

▶️ How to Run the Project Locally

Follow the steps below to set up and run the E-Newsletter application on your local machine.

---

1️⃣ Prerequisites

Ensure the following are installed on your system:

• Node.js (v16 or above)
• npm (comes with Node.js)
• MongoDB (local MongoDB or MongoDB Atlas account)
• Git

---

2️⃣ Clone the Repository

git clone https://github.com/neelanshu7/eNewsletter.git
cd eNewsletter

---

3️⃣ Backend Setup

cd backend
npm install

Create a .env file inside the backend folder and add:

MONGO_URI=your_mongodb_connection_string

Start the backend server:

node server.js

The backend will run at:

http://localhost:5000

4️⃣ Frontend Setup

Open a new terminal, navigate to the frontend directory, and install dependencies:

cd frontend
npm install

Start the frontend development server:

npm start

The frontend will run at:

http://localhost:3000

🔌 API Endpoints

The backend exposes RESTful APIs to manage newsletters.

Method	Endpoint	Description
GET	/api/newsletters	Retrieve all newsletters
POST	/api/newsletters	Create a new newsletter
PUT	/api/newsletters/:id	Update an existing newsletter

All endpoints exchange data in JSON format.

---

🗄 Data Model

Newsletter Collection

The application uses a single collection to store newsletter data.

Field Name	Data Type	Description
title	String	Title of the newsletter
content	String	Full content/body of the newsletter
scheduleDate	String	Scheduled publishing date
createdAt	Date	Automatically generated timestamp
updatedAt	Date	Automatically generated timestamp

The data is stored in MongoDB Atlas using Mongoose schemas.

---

🤖 AI Usage Log

AI was used as a development assistant during the project for:

• Debugging backend and frontend errors
• Understanding deployment issues and resolving them
• Improving code structure and readability
• Writing documentation such as README content

All implementation decisions, coding, testing, and deployment were performed manually, with AI used only as a supportive tool.

---

Planned Improvements

• Add user authentication and role-based access control.
• Implement background jobs for scheduled newsletter publishing.
• Introduce search, filtering, and pagination for better scalability.

---

Sample data (seed script or JSON)

[
  {
    "title": "Introduction to Artificial Intelligence",
    "content": "Artificial Intelligence (AI) refers to the simulation of human intelligence in machines that are programmed to think and learn. AI is widely used in applications such as voice assistants, recommendation systems, and autonomous vehicles.",
    "scheduleDate": "2025-01-10"
  },
  {
    "title": "Understanding Machine Learning",
    "content": "Machine Learning is a subset of AI that enables systems to learn from data and improve performance without explicit programming. It is commonly used in spam detection, fraud detection, and predictive analytics.",
    "scheduleDate": "2025-01-15"
  }
]