Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/dzmitryur/to-do-list
To-Do List Application in React JS
https://github.com/dzmitryur/to-do-list
css3 html5 jsx react-course react-tutorial reactjs todolist todolist-app todolist-application todolist-react
Last synced: 19 days ago
JSON representation
To-Do List Application in React JS
- Host: GitHub
- URL: https://github.com/dzmitryur/to-do-list
- Owner: DzmitryUr
- Created: 2024-06-02T10:29:22.000Z (8 months ago)
- Default Branch: main
- Last Pushed: 2024-06-10T10:13:08.000Z (8 months ago)
- Last Synced: 2024-11-17T13:26:00.988Z (3 months ago)
- Topics: css3, html5, jsx, react-course, react-tutorial, reactjs, todolist, todolist-app, todolist-application, todolist-react
- Language: JavaScript
- Homepage: https://dzmitryur.github.io/to-do-list/
- Size: 188 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# To-Do List Application created with Vite
Welcome to the To-Do List App! This project is part of the React Tutorials series and is built using React. It is a simple, yet effective, application to manage your daily tasks.
## About the Project
The To-Do List App is a basic React application designed to help users manage their tasks efficiently. This project serves as a practical example for learning and implementing React concepts such as components, state management, and event handling.
Watch the full Build and Deploy To-Do List Step-by-Step Tutorial on YouTube:
## Deploying Vite App to GitHub Pages
1. **Create a GitHub Account and Install Git:**
- If you don't have a GitHub account, sign up and install Git on your computer.
2. **Create a New Repository:**
- Log in to your GitHub account and click on the "New" button to create a new repository.
- Set the repository name and click on the "Create repository" button.
3. **Set Up the Repository:**
Follow the command line instructions provided by GitHub to initialize the repository on your local machine.
```bash
git init
git add .
git commit -m "first commit"
git branch -M main
git remote add origin https://github.com/DzmitryUr/to-do-list-copy.git
git push -u origin main
```
4. **Configure the vite.config.js File**
Configure the vite.config.js file to set the correct base path.
```javascript
export default defineConfig({
plugins: [react()],
base: //, // Replace with your GitHub repository name
});
```
5. **Install gh-pages**
Install gh-pages package as a dev dependency
```bash
npm install gh-pages --save-dev
```
6. **Update package.json**
- Set homepage in package.json by using URL on GihHub
```json
"homepage": "https://{username}.github.io/{repo-name}/"
```
- Add predeploy and deploy scripts to package.json
```javascript
"scripts": {
// other scripts
"predeploy" : "npm run build",
"deploy" : "gh-pages -d dist",
}
```
7. **Run Deploy**
```bash
npm run deploy
```