ajaynegi33 / ajaynegi33/LibraryMan

[FEATURE] Implement Login and Signup Functionality (Frontend)

Abierto
#86 3 comentarios 0 reacciones 1 asignado Reclamado por @NidhiJain08 Ver en GitHub
enhancement good first issue hacktoberfest Hacktoberfest-accepted status: ready for dev
Lenguaje dominante
JavaScript
Estrellas
33
Forks
25
Métricas de merge de PR
Sin PR fusionados en 30 d

Descripción

### Is this feature already requested?

- [x] I have checked "open" and "closed" issues, and this is not a duplicate.

### Feature Description

Develop and integrate a secure **Login**, **Signup**, and **OTP** verification feature, ensuring smooth user experience and secure authentication. This feature will involve only frontend UI design.

### Backend:
- The backend is in Java spring boot. [Repository](https://github.com/ajaynegi45/LibraryMan-API/tree/security) - [Issues](https://github.com/ajaynegi45/LibraryMan-API/issues/29)

### Design Resources:
- Figma Design

### Requirements

#### Frontend:
- **UI Design** for the **Login**, **Signup**, and **OTP Verification** forms.
- **Required fields**:
- **Signup**:
- Username
- Name
- Email
- Password
- Confirm Password
- Checkbox: "Get Upcoming Uttarakhand Festival & Fair Alerts!"
- OTP input field (shown after submitting signup form)
- **Login**:
- Email or Username
- Password
- **OTP Flow**:
- After successful submission of the **Signup** form, the user should receive an OTP via email.
- The user should enter the OTP on the verification screen to complete the signup process.
- **Input validation** (real-time feedback as the user types):
- Password must meet the following criteria:
- Minimum 8 characters.
- At least one uppercase letter (A-Z).
- At least one lowercase letter (a-z).
- At least one number (0-9).
- At least one special character (!, @, #, $, etc.).
- Password confirmation should match the entered password.
- Username should be unique.
- OTP should be a 6-digit numeric code.
- **Error/success messaging**:
- Display appropriate messages for password validation, OTP verification, and form submission status.
- **Responsiveness**: Ensure the design adapts seamlessly across various devices and screen sizes.
- **Post-Login/Signup**:
- On successful signup and OTP verification, redirect the user to the homepage.
- Replace the "Login" button with a profile icon once the user is authenticated.

Guía de contribución

Abrir la guía de contribución

Evaluación

Este issue todavía no se ha evaluado.

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.