How to host and deploy your HTML, CSS and JS / ReactJS projects using GitHub pages 2023

In this video you can learn how to upload and deploy your Front-end projects.
.
At first, we will learn how to have a free deployment and hosting the HTML, CSS and JavaScript projects using GitHub pages technology without using CLI:


how to deploy you HTML, CSS & JS project:

- First, we need to implement our code and finish it.
- Test your project in local.
- Create a repository named as your project name.
- Upload our project into this repository.
- Go to Settings - then - Pages.
- Select the source (Deploy from a branch).
- Select your branch name (by default = main).
- Save your work.

Then you will see a link for your project deployment.
.......................................................................

= To publish your react app in GitHub pages
environment you need to do the following steps:

1. Finishing all your react app code.
2. Run this command in your terminal npm run build.
3. You will see a folder named build in your app folder.
4. Upload your react app in your GitHub profile in main branch.
-It's containing a src, public& other files.
5. Make another branch named "GitHub-Pages."
and put in it all the data that stored in build folder.
6. Go to your repository settings.
7. In settings go to Pages.
8. In source select Deploy from a branch.
9. In Branch select your new branch GitHub-Pages branch.
10. save it and you will have your published repository link after a few minutes.

.......................................................................
For ReactJS framework we used these commands:
- To create a project: (npx create-react-app name)
- Access it: (cd name)
- run and test: (npm start)
.
- To have the build folder for deployment: (npm run build)