🧑‍💻 XLogin - Simple React Login Form

📌 Overview

XLogin is a simple React-based login interface.

It includes fields for Username and Password and displays messages based on the validity of the entered credentials.

🎯 Features

Uses form, label, input, and button elements as per best practices.

Ensures both fields are mandatory before submission.

Displays:

✅ "Welcome, user!" if the username is user and password is password.

❌ "Invalid username or password" for all other inputs.

Clean and responsive UI built with CSS.

⚙️ Installation and Setup

Clone the repository:

git clone  https://github.com/dhamodharanECE/Build-the-XLogin-Implementation.git

cd xlogin

Install dependencies:

npm install

Run the app:

npm start

View in browser:

Open

http://localhost:3000

🧾 Usage Instructions

Enter Username as user.

Enter Password as password.

Click Submit.

✅ You’ll see “Welcome, user!”

Enter any other combination.

❌ You’ll see “Invalid username or password”

🧩 Technologies Used

React.js – Frontend library

HTML5 – Semantic markup

CSS3 – Styling and layout

📷 Application Preview

Login Page:

Check the Crediential:

Initial Render:
Form with Username and Password fields.

Valid Login:
Displays “Welcome, user!”

Invalid Login:
Displays “Invalid username or password”.

👨‍💻 Author

Dhamodharan S

Full Stack Web Developer Intern

📧 Email:

[email protected]

Development Link:

https://github.com/dhamodharanECE/Build-the-XLogin-Implementation.git