Skip to content

This project is a simple React application that integrates with a local API that I studied. The application allows users to register, list, and delete users by interacting with the API.

Notifications You must be signed in to change notification settings

CamilleGS/react-studies

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

10 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

πŸš€ User Management App (React + API)

πŸ“Œ Description

This project is a simple React application that integrates with a local API (user-management-api), which is already available in one of my GitHub repositories. The application allows users to register, list, and delete users by interacting with the API.

✨ Features

  • πŸ“ User Registration: Users can enter their name and age, then submit the form to store the data via a POST request.
  • πŸ“‹ User Listing: Fetch and display all users stored in the API through a GET request.
  • πŸ—‘οΈ User Deletion: Remove users from the list with a DELETE request.
  • πŸ”„ Navigation: Seamless navigation between the registration page and the user list page using react-router-dom.

πŸ› οΈ Tech Stack

  • βš›οΈ React (Hooks: useState, useEffect, useRef, useNavigate)
  • πŸ”— Axios (for handling API requests)
  • πŸ›€οΈ React Router (for navigation)
  • 🎨 Styled Components (for styling)

βš™οΈ Installation and Setup

  1. Clone this repository:
    git clone https://github.com/CamilleGS/react-studies.git
  2. Navigate to the project directory:
    cd react-studies
  3. Install dependencies:
    npm install
  4. Ensure the user-management-api is running locally on http://localhost:3001. If you haven't cloned it yet, you can find it in my GitHub repository: order-management-api
  5. Start the React app:
    npm start

πŸ” Usage

  1. Open http://localhost:3000 in your browser.
  2. Add a new user by entering a name and age, then clicking the "Cadastrar" button.
  3. Navigate to the users list to view all registered users.
  4. Delete a user by clicking the trash icon.

πŸ“œ License

This project is open-source and available under the MIT License.

About

This project is a simple React application that integrates with a local API that I studied. The application allows users to register, list, and delete users by interacting with the API.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published