JWT Authentication Implementation Project

Overview

This project implements a JSON Web Token (JWT) authentication system using React, JavaScript, and Tailwind CSS. The system allows users to register, login, and access protected routes.

Dependencies

• react: ^18.2.0
• react-dom: ^18.2.0
• react-router-dom: ^6.3.0
• jsonwebtoken: ^9.0.0
• express: ^4.18.1
• express-jwt: ^7.7.3
• bcrypt: ^5.0.1
• mongodb: ^4.5.0
• mongoose: ^6.3.5
• tailwindcss: ^3.1.8

Project Structure

project/
client/
public/
index.html
src/
components/
App.js
Login.js
Register.js
ProtectedRoute.js
containers/
AppContainer.js
LoginContainer.js
RegisterContainer.js
actions/
authActions.js
reducers/
authReducer.js
store.js
index.js
server/
models/
User.js
routes/
auth.js
app.js
package.json
README.md

Installation

1. Clone the repository: git clone https://github.com/your-username/project.git
2. Install dependencies: npm install or yarn install
3. Start the server: npm start or yarn start
4. Start the client: npm start or yarn start in the client directory

Usage

1. Register a new user: POST /api/register with username, email, and password in the request body.
2. Login an existing user: POST /api/login with username and password in the request body.
3. Access protected routes: GET /api/protected with a valid JWT token in the Authorization header.

API Endpoints

• POST /api/register: Register a new user
• POST /api/login: Login an existing user
• GET /api/protected: Access protected routes

JWT Token

The JWT token is generated using the jsonwebtoken library and is signed with a secret key. The token is valid for 1 hour and can be refreshed using the refresh endpoint.

Security

• Passwords are hashed using bcrypt before storing in the database.
• JWT tokens are verified on each request to ensure authenticity.

Contributing

Contributions are welcome! Please submit a pull request with a clear description of the changes.

License

This project is licensed under the MIT License.