⚡ NexusAuth — Login Application

A full-stack Login App built with React (frontend) and Node.js + Express (backend).

---

📁 Project Structure

nexusauth/
├── backend/
│   ├── server.js          ← Express REST API
│   ├── .env               ← Environment variables
│   └── package.json       ← Backend dependencies
│
├── frontend/
│   ├── public/
│   │   └── index.html
│   └── src/
│       ├── index.js        ← React entry point
│       ├── index.css       ← Global reset
│       ├── App.js          ← Router + PrivateRoute guard
│       ├── Login.js        ← Login page component
│       ├── Login.css       ← Login styles
│       ├── Welcome.js      ← Welcome page component
│       └── Welcome.css     ← Welcome styles
│   ├── .env               ← API URL config
│   └── package.json       ← Frontend dependencies
│
└── README.md

---

🚀 Running on macOS (VSCode)

Prerequisites — make sure these are installed:

node --version    # should be v16 or higher
npm --version     # should be v8 or higher

If not installed: https://nodejs.org/en/download

Step 1 — Open the project in VSCode

Open the nexusauth folder in VSCode, then open two integrated terminals (Terminal → New Terminal, then split it with the + icon).

---

Step 2 — Start the Backend (Terminal 1)

cd backend
npm install
npm start

You should see:

🚀  NexusAuth backend  →  http://localhost:5000

---

Step 3 — Start the Frontend (Terminal 2)

cd frontend
npm install
npm start

Your browser will automatically open http://localhost:3000

---

Step 4 — Log In

Field	Value
Username	admin
Password	admin

---

🔌 API Reference

POST /login

Request body:

{ "username": "admin", "password": "admin" }

Status	Meaning	Response body
200	Login successful	{ message, token, user: {username, role} }
400	Missing fields	{ message: "Username and password are required." }
401	Invalid credentials	{ message: "Invalid credentials. Please try again." }
429	Too many attempts	{ message: "Too many login attempts..." }

GET /verify

Header: Authorization: Bearer <token>

Status	Meaning
200	Token valid
401	Token invalid

GET /health

Returns { status: "ok", uptime: <seconds> }

---

✅ Feature Checklist

Feature	Done
Functional components + React Hooks	✅
POST /login API with proper HTTP status codes	✅
Navigate to /welcome on success (React Router v5)	✅
Error message on invalid credentials	✅
Remember username via localStorage	✅
PrivateRoute guard (blocks direct /welcome access)	✅
Password show/hide toggle	✅
JWT token issued on login	✅
Rate limiting (10 attempts / 15 min)	✅
Environment variables via .env	✅
Animated UI with dark theme	✅

---

🛠 Tech Stack

Layer	Technology
Frontend	React 18, React Router v5, Axios, CSS Animations
Backend	Node.js, Express 4, JWT, express-rate-limit, dotenv

---

🔐 Security Notes

• Passwords would be hashed with bcrypt in a real production app
• JWT tokens expire after 1 hour
• Rate limiting prevents brute-force attacks (10 requests / 15 min per IP)
• CORS is restricted to http://localhost:3000 by default