React Login Web App

This simple login-log out web app was created as part of my Code First Girls Degree. The app is built using React and is a great starting point for learning about React state management and basic authentication concepts. Screenshot 2023-12-06 230214

Features

  • Login Page: Enter your username and password to log in.
  • Successful Login Page: A welcome message is displayed upon successful login, along with a button to log out.
  • Unsuccessful Login Page: In case of unsuccessful login attempts, an error message is shown, and users can return to the login page.

Getting Started

Prerequisites

Installation

Clone the repository:

git clone https://github.com/Lain3y/login-app-hw3

Navigate to the project directory:

cd login-app-hw3

Install dependencies:

npm install

Usage

  1. Open your terminal or command prompt.

  2. Navigate to the project directory using the following command: cd login-app-hw3 (Replace "login-app-hw3" with the actual name of your project directory.)

  3. Start the application by running: npm start This will automatically open the app in your default browser at http://localhost:3000.

  4. Enter the preset username (Kamara) and password (coding23) to log in.

  5. If the login is successful, you will be directed to a welcome page. Click the "Click here to sign out" button to log out.

  6. If the login is unsuccessful, an error page will appear. Click the "Return to login" button to try again.

Customize Credentials

If you wish to change the preset username and password, you can do so by modifying the handleLogin function in the App.js file.

View a demo of the project

File Link
Video View here
Screenshots View here

Acknowledgments

This project was developed as part of the Code First Girls coursework. Thanks to Code First Girls for providing valuable learning opportunities.