Mettre en ligne son site sur github pages
![Mettre en ligne son site sur github pages | webdevpro.net](https://webdevpro.net/wp-content/uploads/2020/04/thumb/git-github__700x400.jpg)
GitHub Pages est un service d’hébergement de site web statique : HTML CSS et Javascript.
Il permet de mettre en ligne un projet gratuitement !
Créer un repository sur github
Première étape, créer un repository sur github :
![](https://webdevpro.net/wp-content/uploads/2020/04/create-repo.png)
Mettre en ligne
Maintenant que le repository distant est opérationnel, il s’agit maintenant de créer un repository local, créer une branch gh-pages et de la push via les commandes suivantes :
Shell
- git init
- git add *
- git commit -m « start »
- git remote add origin https://your-repo/url.git
- git branch gh-pages
- git checkout gh-pages
- git push origin gh-pages
git branch gh-pages sur github
Le projet est en ligne, vérifier que la branch gh-pages a bien été créé à distance :
![](https://webdevpro.net/wp-content/uploads/2020/04/git-branch.jpg)
La branch est créée et opérationnelle sur github :
![](https://webdevpro.net/wp-content/uploads/2020/04/git-branch-validee.jpg)
Settings
![](https://webdevpro.net/wp-content/uploads/2020/04/github-settings.png)
Bien vérifier, dans la section GitHub Pages, de l’onglet Settings que la branch est bien source sélectionnée
![](https://webdevpro.net/wp-content/uploads/2020/04/github-params.png)
Url de votre projet
Le projet est désormais en ligne, le site accessible via l’adresse suivante :
https://<identifiant-git>.github.io/<nom-repo>/
Voici des exemples de projets personnels hébergés sur github pages :
- projet angular : https://webdevproformation.github.io/demo-app/
- projet HTML CSS : https://webdevproformation.github.io/githubpages/
Github pages avec React / Angular
- npm i –save-dev angular-cli-ghpages # module pour app angular
- npm i –save-dev
gh-pages
# module pour app react