Authentication-Module

© Angelo-Gabriel Barbu - angelo.barbu123@gmail.com - 2025

Table of Contents

• Authentication-Module
  • © Angelo-Gabriel Barbu - angelo.barbu123@gmail.com - 2025
  • Table of Contents
  • Project Overview
  • Features
  • Tech Stack
  • Folder Structure
    • Backend
    • Frontend
  • Architecture
    • MVC Pattern
    • Role-Based Access Control (RBAC)
    • JWT Authentication
  • Security
    • Helmet Security Headers
    • Rate Limiting
  • Authentication Methods
    • Email/Password Login
    • Google OAuth Integration
  • Forms & Validation
  • Admin Dashboard
  • User Dashboard
  • Frontend Styling
  • Setup Instructions
    • Backend Setup
    • Frontend Setup
  • Environment Variables
  • Scripts
  • Testing
  • Deployment
    • How to deploy
  • Planned Improvements
  • License

---

Project Overview

A secure, full-featured authentication module supporting both traditional email/password login and Google OAuth. Includes user and admin dashboards, role-based access, password setting for Google users, and user management.

Features

• JWT-based session management
• Google OAuth login
• Role-Based Access Control (RBAC)
• Admin user management (CRUD)
• Responsive form validations
• Set password for Google-registered users
• Rate limiting & Helmet for security
• Toast-based user feedback

Tech Stack

• Frontend: React, React Router, React Toastify, Google Identity Services
• Backend: Node.js, Express, Sequelize (PostgreSQL), JWT
• Security: Helmet, express-rate-limit, bcrypt

Folder Structure

Backend

backend/
│
├── config/               # Environment config loading
├── controllers/          # Business logic (auth, admin, Google OAuth)
├── middlewares/          # JWT and Role authentication
├── models/               # Sequelize models
├── routes/               # Express route definitions
├── scripts/              # Seed script for admin
├── utils/                # JWT & password helpers
├── .env                  # Backend environment variables
├── app.js                # Express app setup
└── server.js             # Server entry point

Frontend

frontend/
│
├── public/
├── src/
│   ├── components/       # Shared components (Forms, Dashboards)
│   ├── pages/            # Page views (Login, Register)
│   ├── api.js            # Axios instance with JWT
│   ├── AppRoutes.jsx     # Protected routing logic
│   ├── styles.css        # App-wide styling
│   └── App.js            # Root component
└── .env                  # Frontend environment variables

Architecture

MVC Pattern

The backend follows a clean separation of concerns:

• Models: Sequelize models define data structure.
• Views: (Handled by React frontend)
• Controllers: Encapsulate business logic.
• Routes: Map HTTP endpoints to controllers.

Role-Based Access Control (RBAC)

• User roles are defined in the database (user, admin)
• Middleware checks access per route using JWT payload role.
• Regular users are routed to /dashboard
• Admin users are routed to /admin
• Admins can:
  • View all users
  • Create new users or admins
  • Update or delete existing accounts

JWT Authentication

• Tokens issued upon login (or Google OAuth)
• Sent in Authorization headers
• Used to protect routes and manage sessions

Security

Helmet Security Headers

app.use(helmet());

Adds secure HTTP headers to protect from well-known web vulnerabilities.

Rate Limiting

app.use(rateLimit({ windowMs: 15 * 60 * 1000, max: 100 }));

Mitigates brute-force attacks and abuse by limiting repeated requests.

Authentication Methods

Email/Password Login

• Register with required fields + password
• Login sets JWT token in localStorage

Google OAuth Integration

• Login/registration via Google Identity Services
• Prompts user to optionally set password for manual login

Forms & Validation

• All forms have client-side validation
• Password confirmation fields in registration and update
• Error messages displayed via toast.error()

Admin Dashboard

• Create, update, delete users/admins
• View user list in a styled responsive table
• Edit form pre-filled with selected user

User Dashboard

• View and update personal info
• Optional password change with validation
• Ability to delete account after confirming password

Frontend Styling

• Clean and modern design
• Uniform form components
• Responsive behavior with layout safety

Setup Instructions

Backend Setup

cd backend
npm install
cp .env.example .env  # Fill in DB, JWT_SECRET, etc.
npm run dev

Frontend Setup

cd frontend
npm install
cp .env.example .env  # Include REACT_APP_API_BASE_URL, GOOGLE_CLIENT_ID
npm start

Environment Variables

Backend .env

DATABASE_URL=
PORT=
JWT_SECRET=
TOKEN_EXPIRATION_SECONDS=
GOOGLE_CLIENT_ID=

Frontend .env

REACT_APP_API_BASE_URL=http://localhost:5001/api
REACT_APP_GOOGLE_CLIENT_ID=<your_google_id>

Scripts

• seedAdmin.js: Seeds an initial admin user

node scripts/seedAdmin.js

Testing

This repository ships with a zero-config, fully isolated test harness for both the Node/Express backend and the React frontend. Follow the steps below (copy-paste friendly) and you will obtain deterministic test runs on any machine or CI runner. Testing done using jest.

cd frontend/
npm ci
npm test

cd backend/
npm ci
npm test

Deployment

This project uses Terraform to declaratively build and orchestrate a full-stack authentication system via Docker containers. It includes:

• PostgreSQL database [auth-db]
• Node.js REST API [auth-api]
• React.js frontend UI [auth-ui]

How to deploy

cd infra/terraform
touch terraform.tfvars
# Example terraform.tfvars
# postgres_password        = "your_postgres_password"
# jwt_secret               = "your_jwt_secret"
# token_expiration_seconds = 3600
# google_client_id         = "your_google_oauth_client_id"

# Remove node_modules & package-lock.json from backend/ and frontend/
terraform init
terraform apply

# Stopping the containers
terraform destroy

Terraform will:

• Build docker images for the backend and frontend
• Pull the official PostgreSQL image
• Create a shared Docker network [auth-network]
• Start containers for the database, API and UI

Planned Improvements

• Better handling for the refresh token
• Email confirmation after registration
• Forgot password flow
• 2FA (Two-Factor Authentication)
• Dark mode UI theme
• Better beployment strategy
• Low-level & high-level architecture diagrams
• Better unit tests & e2e testing
• UI refinement overall

License

This project is licensed under the MIT License.