Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/vic778/react-todo-app-tuto
It is a Single Page App (SPA) that allows users to: Add todo. Update todo. Delete todo. Navigate between pages with react router. Data in this app has been preserved using localStorage.
https://github.com/vic778/react-todo-app-tuto
Last synced: about 2 months ago
JSON representation
It is a Single Page App (SPA) that allows users to: Add todo. Update todo. Delete todo. Navigate between pages with react router. Data in this app has been preserved using localStorage.
- Host: GitHub
- URL: https://github.com/vic778/react-todo-app-tuto
- Owner: vic778
- License: mit
- Created: 2022-01-18T07:39:24.000Z (almost 3 years ago)
- Default Branch: develop
- Last Pushed: 2022-05-20T03:25:20.000Z (over 2 years ago)
- Last Synced: 2023-03-09T03:37:24.507Z (almost 2 years ago)
- Language: JavaScript
- Homepage: https://vic778.github.io/react-todo-app-tuto/
- Size: 2.15 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# React todo app
In this project I buit a simple react app wich is "Todo list", using react. This app was built according to the steps provided in the [React Tutorial From Scratch: A Step-by-Step Guide (2021)](https://ibaslogic.com/react-tutorial-for-beginners/)
It is a Single Page App (SPA) that allows users to:
- Add todo.
- Update todo.
- Delete todo.
- Navigate between pages with react router.
- Data in this app has been preserved using `localStorage`.
## Live demo link
Live demo [link](https://vic778.github.io/react-todo-app-tuto/)
## Screenshot
## Getting Started
This is a react project, you can read more about create react app [Create React App](https://github.com/facebook/create-react-app).
### Setup
Go to the top of the page, press te green button that says "Code", and copy the link. Then you have to go to your console and type
```
git clone 'repository-link'
```
That's all, you are ready to go!
### Install
Run the following command to have all npm packages dependencies installed:
```
npm install
```
### Usage
To start the webpack-dev-server, run the following command:
```
npm start
```
### Available Scripts
In the project directory, you can run:
### `npm start`
Runs the app in the development mode.\
Open [http://localhost:3000](http://localhost:3000) to view it in your browser.
The page will reload when you make changes.\
You may also see any lint errors in the console.
### `npm test`
Launches the test runner in the interactive watch mode.\
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
### `npm run build`
Builds the app for production to the `build` folder.\
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes.\
Your app is ready to be deployed!
See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
### Linters
To run the Javascript linters type the following
```
npx eslint .
```
To run the HTML linters type the following
```
npx hint .
```
To run the CSS linters type the following
```
npx stylelint "**/*.{css,scss}"
```
## Authors:
👤 **Victor Barh**
- GitHub: [@Vvic778](https://github.com/vic778)
- Twitter: [@victoirBarh](https://twitter.com/)
- LinkedIn: [LinkedIn](https://linkedin.com/in/victoir-barh)
## 🤝 Contributing
Contributions, issues, and feature requests are welcome!
## 📝 License
This project is MIT licensed.
## Show your support
Give a ⭐️ if you like this project!