Project-4

ChirpNet is a cyberpunk-themed social media web app where users can register, log in, and create text/image posts in a shared community feed. Built using a RESTful API backend with MySQL for data persistence and modern JavaScript for asynchronous client-server interaction, ChirpNet brings real-time interactivity with retro-futuristic vibes.

Installation

Prerequisites

• Node.js
• MySQL
• Git

Clone and install dependencies:

git clone https://github.com/your-username/ChirpNet.git
cd ChirpNet/server
npm install


Setup
1. Create a database named chirpnet.
2. run the SQL file

(inside mySQL CLI)
SOURCE path/to/create-db.sql;

in /server/db/connection.js confirm your credentials match:
const db = mysql.createConnection({
  host: 'localhost',
  user: 'root',
  password: 'root',
  database: 'chirpnet'
});

Run the app
cd server
node app.js

Visit: http://localhost:1337

---

#### 🛠️ c. Development Notes

Mention any limitations, things that work well, and future ideas:

```markdown
## Development Notes

### What Works
- Asynchronous login and post creation using fetch API.
- Dynamic rendering of user feed and posts.
- MySQL persistence for users and posts.
- Basic error handling for missing users or post failures.

### What Could Be Improved
- Passwords are not hashed or securely stored.
- Session handling is done via `localStorage` (no cookie/session security).
- No comment support or user profile pages.

### Future Plans
- Implement session-based authentication.
- Add comment threading and like counts.
- Separate user feeds by user accounts.

# User Guide

## 1. Register an Account
- Go to [Create Account](http://localhost:1337/create-account.html)
- Fill in your username, email, and password.
- You will be redirected to the feed automatically.

## 2. Log In
- Visit [Home](http://localhost:1337/)
- Select your registered username from the dropdown.
- Press "Log In" to enter the feed.

## 3. Create a Post
- Enter text in the "What's on your mind?" box.
- (Optional) Add an image URL.
- Click "Post" and your Chirp appears instantly.

## 4. Explore the Feed
- View posts from all users.
- Click 💓 to like, or 💬 to reply.

![Login screenshot](screenshots/login.png)
![Feed screenshot](screenshots/feed.png)