Comment voir une page HTML sur Github comme une page HTML rendue normale pour voir un aperçu dans le navigateur, sans téléchargement?

Sur http://github.com, le développeur conserve les fichiers HTML, CSS, JavaScript et images du projet. Comment puis-je voir la sortie HTML dans le navigateur?

Par exemple, ceci: https://github.com/necolas/css3-social-signin-buttons/blob/master/index.html

Lorsque j'ouvre cela, il n'affiche pas le code HTML rendu du code d'auteur. Il montre la page comme un code source.

Est-il possible de le voir directement en HTML rendu? Sinon, je dois toujours télécharger le ZIP entier juste pour voir le résultat.

La façon la plus confortable de prévisualiser les fichiers HTML sur GitHub est d'aller sur https://htmlpreview.github.io/ ou de simplement le rajouter à l'URL d'origine, c'est-à-dire: https://htmlpreview.github.io/?https:// github.com/bartaz/impress.js/blob/master/index.html

Si vous ne souhaitez pas télécharger une archive, vous pouvez utiliser les pages GitHub pour le rendre.

1. Connectez le référentiel à votre compte.
2. Clonez-le localement sur votre machine
3. Créer une gh-pagesbranche (si une existe déjà, supprimez-la et créez-en une nouvelle en fonctionmaster ).
4. Poussez la branche vers GitHub.
5. Consultez les pages sur `http://username.github.io/repo

Dans du code:

git clone git@github.com:username/repo.git
cd repo
git branch gh-pages
# Might need to do this first: git branch -D gh-pages
git push -u origin gh-pages # Push the new branch back to github
Go to http://username.github.io/repo

Vous pouvez utiliser RawGit :
https://rawgit.com/necolas/css3-social-signin-buttons/master/index.html

Il fonctionne mieux (au moment d'écrire ces lignes) que http://htmlpreview.github.com/ , servant des fichiers avec des en-têtes de type de contenu appropriés. En outre, il fournit également une URL CDN pour une utilisation en production.

C'est vraiment facile à faire avec les pages github , c'est juste un peu bizarre la première fois que vous le faites. Sorta comme la première fois que vous avez dû jongler avec 3 chatons tout en apprenant à tricoter. (OK, ce n'est pas si mal que ça)

Vous avez besoin d'une branche gh-pages:

Fondamentalement, github.com recherche une branche gh-pages du référentiel. Il servira toutes les pages HTML qu'il trouve ici en HTML normal directement au navigateur.

Comment obtenir cette branche gh-pages?

Facile. Créez simplement une branche de votre dépôt github appelée gh-pages. Spécifiez --orphanquand vous créez cette branche, car vous ne voulez pas fusionner cette branche dans votre branche github, vous voulez juste une branche qui contient vos ressources HTML.

$ git checkout --orphan gh-pages

Qu'en est-il de tous les autres conneries de mon repo, comment cela s'intègre-t-il?

Non, vous pouvez simplement aller de l'avant et le supprimer. Et c'est sûr de le faire maintenant, car vous avez fait attention et créé une branche orpheline qui ne peut pas être fusionnée dans votre branche principale et supprimer tout votre code.

J'ai créé la branche, maintenant quoi?

Vous devez pousser cette branche sur github.com, afin que leur automatisation puisse démarrer et commencer à héberger ces pages pour vous.

git push -u origin gh-pages

Mais .. Mon HTML n'est toujours pas servi!

Il faut quelques minutes à github pour indexer ces branches et lancer l'infrastructure requise pour servir le contenu. Jusqu'à 10 minutes selon github.

Les étapes décrites par github.com

https://help.github.com/articles/creating-project-pages-manually

J'ai lu tous les commentaires et j'ai pensé que GitHub rendait trop difficile pour un utilisateur normal de créer des pages GitHub jusqu'à ce que je visite la page de thème GitHub où il est clairement mentionné qu'il y a une section "Pages GitHub" sous la page des paramètres du dépôt concerné où vous pouvez choisissez l'option «utiliser la branche principale pour les pages GitHub». et voilà !! ... consultez ce dépôt particulier sur https://username.github.io/reponame

De plus, si vous utilisez Tampermonkey, vous pouvez ajouter un script qui ajoutera preview with http://htmlpreview.github.com/ bouton dans le menu des actions à côté des boutons 'raw', 'blame' et 'history'.

Script comme celui-ci: https://gist.github.com/vanyakosmos/83ba165b288af32cf85e2cac8f02ce6d

Vous pouvez prévisualiser le code HTML suivant en utilisant l' extension Chrome - Run Selected HTML, très simple à utiliser.

Si vous voulez select all the codeen mode lecture de GitHub, c'est aussi assez simple, déplacez d'abord le curseur de la souris sur la parenthèse de début de <html>en haut, puis maintenez la Shifttouche enfoncée, puis déplacez le curseur la parenthèse de fin de </html>en bas.

Exécuter le HTML sélectionné - Chrome Web Store

https://chrome.google.com/webstore/detail/run-selected-html/eefflcdphpehljcadbmkdpopmbamfefl/

Étape 1 : En mode lecture, sélectionnez tout le corps du code html.

Étape 2 : cliquez avec le bouton droit de la souris sur «Exécuter le HTML sélectionné», puis vous pouvez voir le résultat rendu dans un nouvel onglet.

Le résultat courant:

Maintenant, c'est une réponse dépassée (car l'extension "Modifier les options de type de contenu" ne fonctionne pas comme prévu.).

Cette solution uniquement pour le navigateur Chrome. Je ne suis pas sûr d'un autre navigateur.

1. Ajoutez l'extension "Modifier les options de type de contenu" dans le navigateur Chrome.
2. Ouvrez l'URL "chrome-extension: //jnfofbopfpaoeojgieggflbpcblhfhka/options.html" dans le navigateur.
3. Ajoutez la règle pour l'url de fichier brut. Par exemple:
   • Filtre URL: https: ///raw/master//fileName.html
   • Type d'origine: texte / uni
   • Type de remplacement: text / html
4. Ouvrez le navigateur de fichiers auquel vous avez ajouté l'URL dans la règle (à l'étape 3).

Ce n'est pas une réponse directe, mais je pense que c'est une alternative assez douce.

http://www.s3auth.com/

Il vous permet d'héberger vos pages derrière l'authentification de base. Idéal pour des choses comme des documents api dans votre dépôt github privé. ajoutez simplement un s3 dans votre build api.

Vous pouvez simplement activer les pages Github. ^ _ ^

Cliquez sur "Paramètres", allez sur "Pages GitHub" et cliquez sur le menu déroulant sous "Source" et choisissez la branche que vous souhaitez rendre publique (où se trouve le fichier html principal) aaa et vualaa. ^ _ ^