Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 12 additions & 0 deletions .env
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
DB_HOST=localhost
DB_PORT=5432
DB_NAME=auth_db
DB_USER=postgres
DB_PASSWORD=Engage
JWT_SECRET=sua_chave_super_secreta_min_32_chars_aqui_1234567890
SMTP_HOST=smtp.gmail.com
SMTP_PORT=587
SMTP_SECURE=false
SMTP_USER=authappservices@gmail.com
SMTP_PASS=lcissmoplbnnqhjq
FRONTEND_URL=http://localhost:5173
23 changes: 23 additions & 0 deletions .github/workflows/test.yml-template
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
name: Test

on:
pull_request:
branches: [ master ]

jobs:
build:

runs-on: ubuntu-latest

strategy:
matrix:
node-version: [20.x]

steps:
- uses: actions/checkout@v2
- name: Use Node.js ${{ matrix.node-version }}
uses: actions/setup-node@v1
with:
node-version: ${{ matrix.node-version }}
- run: npm install
- run: npm test
4 changes: 0 additions & 4 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,3 @@ node_modules

# MacOS
.DS_Store

# env files
*.env
.env*
17 changes: 17 additions & 0 deletions Documentation.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
The application is a full-stack web platform designed to provide a complete authentication system. It consists of a React front-end and a Node.js back-end with Express, using Sequelize ORM for database interaction. The main purpose of the application is to manage user accounts securely, allowing registration, login, account activation via email, password recovery, profile management, and session handling.

The front-end is developed with React and TypeScript, ensuring type safety and maintainable code. Each page is a dedicated React component responsible for a specific part of the user interface. Routing is handled by React Router, allowing navigation between login, registration, profile, password reset request, and password reset confirmation pages. The application manages user input through controlled components using useState for state management and useEffect for handling side effects such as redirecting authenticated users away from the login or registration pages.

The login page captures the user's email and password, validates required fields, and sends the credentials to the back-end via the authentication service. If the user is authenticated successfully and the account is active, a JSON Web Token (JWT) is received and stored in an HTTP-only cookie. The registration page collects the user's name, email, and password, validates the inputs, and submits them to the back-end. Upon successful registration, an activation token is generated and sent via email, and the user must activate the account before logging in. Password reset flows are divided into two pages: one for requesting a password reset by providing the registered email, and another for confirming the password reset using the token received via email. All pages provide clear feedback to the user, displaying success or error messages depending on the outcome of each operation.

Back-end is built with Node.js and Express, handling all business logic and database operations. The User model defines the schema with fields for identification, authentication, and account management, including name, email, passwordHash, active, activationToken, resetToken, and resetTokenExpiresAt. Email addresses are normalized to lowercase, and passwords are securely hashed using bcrypt. During registration, the back-end checks for duplicate emails, hashes the password, generates a unique activation token, and stores it along with the user record. Nodemailer is integrated for sending activation and password reset emails, configured using environment variables such as SMTP host, port, secure flag, user, and password. The sendActivationEmail function constructs an HTML email containing a link with the activation token, enabling the user to activate their account by visiting the front-end URL with the token.

The login flow validates the user's credentials and ensures the account is active. If valid, a JWT is generated containing the user's ID and email, with an expiration time of 24 hours, and returned in an HTTP-only cookie. Logout invalidates the current JWT by adding it to a blacklist and clearing the cookie. The password reset flow generates a one-hour-expiring token stored in the database and sends it via email. When the user submits a new password along with the token, the back-end verifies the token's validity and expiration before updating the password and removing the token.

The application's logic ensures that sensitive operations, such as changing email or password, require verification of the current password. Middleware functions protect routes by validating JWTs, checking for token blacklisting, and granting access only to authenticated users. All API responses are standardized with clear status codes and messages, facilitating consistent front-end handling.

Security is a primary concern. Passwords are hashed, JWTs are signed and stored securely in HTTP-only cookies, activation and reset tokens have expiration times, and sensitive operations require additional verification. The system uses environment variables for secret keys, SMTP credentials, and front-end URLs to maintain secure and flexible configuration.

The complete flow of the application begins when a user registers. The back-end creates the user record with a hashed password and activation token. Nodemailer sends an activation email containing a link to the front-end. The user clicks the link, which sends a request to the back-end to activate the account. Once active, the user can log in and receive a JWT in a cookie. If the user forgets the password, they request a reset, receive a token via email, and submit a new password to complete the reset process. Logout invalidates the token and clears the session. Throughout this workflow, the front-end communicates with the back-end via a RESTful API, and the back-end handles all validation, authentication, and email communication.

This design provides a scalable, secure, and maintainable authentication system, with a clear separation of responsibilities between front-end and back-end, robust security measures, and integrated email notifications for account activation and password recovery.
24 changes: 24 additions & 0 deletions frontend/authApplication/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*

node_modules
dist
dist-ssr
*.local

# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
73 changes: 73 additions & 0 deletions frontend/authApplication/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,73 @@
# React + TypeScript + Vite

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.

Currently, two official plugins are available:

- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) (or [oxc](https://oxc.rs) when used in [rolldown-vite](https://vite.dev/guide/rolldown)) for Fast Refresh
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh

## React Compiler

The React Compiler is currently not compatible with SWC. See [this issue](https://github.com/vitejs/vite-plugin-react/issues/428) for tracking the progress.

## Expanding the ESLint configuration

If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:

```js
export default defineConfig([
globalIgnores(['dist']),
{
files: ['**/*.{ts,tsx}'],
extends: [
// Other configs...

// Remove tseslint.configs.recommended and replace with this
tseslint.configs.recommendedTypeChecked,
// Alternatively, use this for stricter rules
tseslint.configs.strictTypeChecked,
// Optionally, add this for stylistic rules
tseslint.configs.stylisticTypeChecked,

// Other configs...
],
languageOptions: {
parserOptions: {
project: ['./tsconfig.node.json', './tsconfig.app.json'],
tsconfigRootDir: import.meta.dirname,
},
// other options...
},
},
])
```

You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:

```js
// eslint.config.js
import reactX from 'eslint-plugin-react-x'
import reactDom from 'eslint-plugin-react-dom'

export default defineConfig([
globalIgnores(['dist']),
{
files: ['**/*.{ts,tsx}'],
extends: [
// Other configs...
// Enable lint rules for React
reactX.configs['recommended-typescript'],
// Enable lint rules for React DOM
reactDom.configs.recommended,
],
languageOptions: {
parserOptions: {
project: ['./tsconfig.node.json', './tsconfig.app.json'],
tsconfigRootDir: import.meta.dirname,
},
// other options...
},
},
])
```
23 changes: 23 additions & 0 deletions frontend/authApplication/eslint.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
import js from '@eslint/js'
import globals from 'globals'
import reactHooks from 'eslint-plugin-react-hooks'
import reactRefresh from 'eslint-plugin-react-refresh'
import tseslint from 'typescript-eslint'
import { defineConfig, globalIgnores } from 'eslint/config'

export default defineConfig([
globalIgnores(['dist']),
{
files: ['**/*.{ts,tsx}'],
extends: [
js.configs.recommended,
tseslint.configs.recommended,
reactHooks.configs.flat.recommended,
reactRefresh.configs.vite,
],
languageOptions: {
ecmaVersion: 2020,
globals: globals.browser,
},
},
])
13 changes: 13 additions & 0 deletions frontend/authApplication/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>authapplication</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>
Loading
Loading