ASP.NET/02_ProjectOrientedSessions/Session07/Session07.md

🔹 1. User Sign-Up Flow

• React modal (SignUpModal component)

• Fields: PhoneNumber, Password, ConfirmPassword

• Frontend validation (empty fields, password length match, etc.)

• Send request to /api/auth/register (POST)

• Backend controller:

  • Check if user with phone exists

  • Validate password (min length, maybe complexity rules)

  • Hash password

  • Store new user in DB

  • Return success/failure

✅ Backend helper: Use PasswordHasher<TUser> to hash passwords securely
✅ Phone number can act as username or unique field

---

🔹 2. User Login Flow

• React modal (LoginModal component)

• Fields: PhoneNumber, Password

• Submit to /api/auth/login (POST)

• Backend checks:

  • Find user by phone

  • Verify password (using PasswordHasher)

  • Generate JWT

  • Return token (and optionally refresh token)

✅ Token should include claims like user ID and role
✅ Sign token with your secret key

---

🔹 3. Store Token + Access Protected Page

• Save token to localStorage or cookie

• Attach it to future API requests using Axios interceptor

• Use jwt-decode to extract roles and validate access in frontend

• Restrict /profile page using custom React PrivateRoute

Backend: Secure /api/profile with [Authorize] (or [Authorize(Roles = "X")])

---

🛠 Technologies to Use

Area	Tool
Frontend	React, Axios, React Router, jwt-decode
Backend	ASP.NET Core API, EF Core, JWT Bearer Auth
Security	PasswordHasher, Authorization attributes, Token signing key

---

Mention adding User Role in Database

Becareful not to put Jwt inside another thing in the appsettings