Client-Side Authentication System

Client-Side Authentication System

A web-based sign-up and login system with validation and localStorage persistence

Features

Sign-Up System

Client-side form validation with:

Name (letters only)

Email format validation (@gmail.com/@yahoo.com)

Password strength (3-8 numeric characters)

Real-time feedback with Bootstrap validation styles

Error messaging for invalid inputs

Login System

Email/password authentication

Session persistence via localStorage

Error handling for:

Empty fields

Invalid credentials

Data Persistence

Stores user data in browser localStorage

Maintains session across page refreshes

User Experience

Smooth page transitions

Welcome message on final page

Responsive design with Bootstrap

Technologies Used

HTML5/CSS3

Bootstrap 5 (for styling and validation)

JavaScript (for logic and DOM manipulation)

Regular Expressions (for input validation)

localStorage (for data storage)

Validation Rules

Name

Letters only (min 1 character)

Email

Must end with @gmail.com or @yahoo.com

Password

3-8 numeric characters

Workflow

Sign-Up Page

User enters credentials

Real-time validation occurs

Valid data is stored in localStorage

Login Page

User enters stored credentials

System checks against localStorage data

Successful login redirects to welcome page

Welcome Page

Displays personalized greeting

Maintains session state