HOW TO DEPLOY A REACT WEBSITE IN GITHUB

So the other day a friend of mine Taha Ouad asked me how can he deploy a React website in github, so i thought it would be better if i post it here so everyone can benefit from the information .

Note : this article is written assuming that you already know how to create a github repository, if you dont know how to do so you can check my other article here explaining how to create a github repository.

• Open the terminal in your project folder(this folder needs to be a github repository) and type " npm i gh-pages --save--dev " command to install github dependencies

• After it finishs installing open the packages.json file

• Add a key "homepage" to the json file

• Then add a value to the homepage key strcutured as follows" https://{your github profile name}.github.io/{your repository name} "

Exemple in the image

• In the same packages.json file add this two scripts in the scripts object :

"predeploy" : "npm run build",

"deploy" : "gh-pages -d build",

• Open terminal and run " git add . " then " git commit commands -m 'done'" to commit changes and " git push origin master " to upload changes to the repository

• Now run the command " npm run deploy " in the terminal

• Open your repository in github and go to settings

• Go to pages

• And you will find the visit site button that takes you to Your deployed website

( If you dont see the visit site button or the page says error 404, dont panic just wait a minute or so and refresh the page and it will work )

I hope this article helped you.