Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/claudiarojassoto/react-todo-app

"React-ToDo-App" It is a project that present a to-do application developed using React. The application allows users to add, edit, delete, and mark their daily tasks as completed.
https://github.com/claudiarojassoto/react-todo-app

cra javascrip props-and-state-components react react-components react-hooks reactjs spa ui vite webdevelopment wireframe

Last synced: 7 days ago
JSON representation

"React-ToDo-App" It is a project that present a to-do application developed using React. The application allows users to add, edit, delete, and mark their daily tasks as completed.

Awesome Lists containing this project

README

        



React-ToDo-App

# 📗 Table of Contents

- [📗 Table of Contents](#-table-of-contents)
- [📖 React-ToDo-App ](#-react-todo-app-)
- [🛠 Built With ](#-built-with-)
- [Tech Stack ](#tech-stack-)
- [Key Features ](#key-features-)
- [🚀 Live Demo ](#-live-demo-)
- [💻 Getting Started ](#-getting-started-)
- [Project Structure](#project-structure)
- [Setup](#setup)
- [Install](#install)
- [Usage](#usage)
- [Run tests](#run-tests)
- [👥 Authors ](#-authors-)
- [🔭 Future Features ](#-future-features-)
- [🤝 Contributing ](#-contributing-)
- [⭐️ Show your support ](#️-show-your-support-)
- [🙏 Acknowledgments ](#-acknowledgments-)
- [📝 License ](#-license-)

# 📖 React-ToDo-App

> "React-ToDo-App" It is a project that present a to-do application developed using React. The application allows users to add, edit, delete, and mark their daily tasks as completed.

## 🛠 Built With

### Tech Stack

React

CSS


  • The CSS is used to provide the design in the whole page.

Linters


  • The Linters are tools that help us to check and solve the errors in the code

  • This project count with three linters:

    • CSS

    • JavaScript


### Key Features

- **React configuration**
- **HTML Generation**
- **CSS Styling**
- **Development Server**
- **Code Quality**
- **Modular Structure**
- **JavaScript Functionality**
- **Gitflow**
- **SPA**

(back to top)

## 🚀 Live Demo

> You can see a Demo here: (Soon)

(back to top)

## 💻 Getting Started

> To get a local copy up and running, follow these steps.
> This project requires Node.js and npm installed on your machine.

-Node.js
-npm

> -Clone this repository to your local machine using:

> git clone https://github.com/ClaudiaRojasSoto/React-ToDo-App.git

> -Navigate to the project folder:

> cd React-ToDo-App

> -Install the project dependencies:

> npm install

> To start the development server, run the following command:

> npm start

### Project Structure

> The project follows the following folder and file structure:

- /src: Contains the source files of the application.
- /src/main.jsx: Main entry point of the React application.
- /src/App.jsx: Top-level component of the application.
- /src/components: Directory for React components.
- /src/context: Directory for React components.
- /src/routes: Directory for React components.
- /src/styles: CSS files for the React app
- /public: Contains the public files and assets of the application.
- /public/Contains the SVG icon from Vite.
- /build: Contains the generated production files.

### Setup

> Clone this repository to your desired folder: https://github.com/ClaudiaRojasSoto/React-ToDo-App.git

### Install

> Install this project with: install Stylelint and ESLint

### Usage

> To run the project, execute the following command: just need a web Browser

### Run tests

> To run tests, run the following command: npm start
> you just need a simple web browser to run this project for a test

## 👥 Authors

👤 **Claudia Rojas**

- GitHub: [@githubhandle](https://github.com/ClaudiaRojasSoto)
- LinkedIn: [LinkedIn](https://www.linkedin.com/in/claudia-soto-260504208/)

(back to top)

## 🔭 Future Features

- **Send and receive data from API**
- **Testing**

(back to top)

## 🤝 Contributing

> Contributions, issues, and feature requests are welcome!

> Feel free to check the [issues page](https://github.com/ClaudiaRojasSoto/React-ToDo-App/issues).

(back to top)

## ⭐️ Show your support

> If you like this project show support by following this account

(back to top)

## 🙏 Acknowledgments

> - Microverse for providing the opportunity to learn Git and GitHub in a collaborative environment.

> - GitHub Docs for providing a wealth of information on Git and GitHub.

(back to top)

## 📝 License

> This project is [MIT](https://github.com/ClaudiaRojasSoto/React-ToDo-App/blob/develop/MIT.md).

(back to top)