Personal Blog Project

This project is a blog post project built on React + Vite + Tailwind CSS, and Nodejs Express + MongoDB.

Deployed versions are available for viewing on www.richardiffusion.me/blog

Functions and Features

• Blog Edit, Post and Revise
• Dashboard
• Interactive Calendar
• Contacts (Send Email Function)

Tech Stack

• Frontend: React 18, Vite, Tailwind CSS, shadcn/ui Components
• Backend: nodejs, express
• Database: MongoDB
• Deployment: Docker (Not included in this file but strongly recommended!)

Installation and Operation

1. Install Requirements

cd frontend
npm install

cd backend
npm install

2. Development Commands

cd frontend
npm run dev

cd backend
npm run dev

3. Production Commands

cd frontend
npm run build

cd backend
npm start

4. Database - MongoDB Config (for Windows,for other system like MacOS and Linux please refer to MongoDB website) Download here: https://www.mongodb.com/try/download/community Install and then create data file

# Create data folder
mkdir -p E:\data\db

# Start MongoDB (admin mode)
"C:\Program Files\MongoDB\Server\6.0\bin\mongod.exe" --dbpath=E:\data\db

5. .env environment config Make sure backend/.env MONGODB_URI and Email info(for Contact page) is configured.

Preview

Main Page

Dashboard

Contact

Posting New Article