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.
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:
-
Create a GitHub Account and Install Git:
- If you don't have a GitHub account, sign up and install Git on your computer.
-
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.
-
Set Up the Repository:
Follow the command line instructions provided by GitHub to initialize the repository on your local machine.
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
-
Configure the vite.config.js File Configure the vite.config.js file to set the correct base path.
export default defineConfig({ plugins: [react()], base: /<REPOSITORY_NAME>/, // Replace <REPOSITORY_NAME> with your GitHub repository name });
-
Install gh-pages Install gh-pages package as a dev dependency
npm install gh-pages --save-dev
-
Update package.json
- Set homepage in package.json by using URL on GihHub
"homepage": "https://{username}.github.io/{repo-name}/"
- Add predeploy and deploy scripts to package.json
"scripts": { // other scripts "predeploy" : "npm run build", "deploy" : "gh-pages -d dist", }
-
Run Deploy
npm run deploy