बिना डाउनलोड किए, ब्राउज़र में पूर्वावलोकन देखने के लिए एक सामान्य रेंडर किए गए HTML पृष्ठ के रूप में जीथुब पर एक HTML पृष्ठ कैसे देखें?

Question

Http://github.com डेवलपर पर प्रोजेक्ट की HTML, CSS, जावास्क्रिप्ट और छवियों को रखें। मैं ब्राउज़र में HTML आउटपुट कैसे देख सकता हूं?

उदाहरण के लिए: https://github.com/necolas/css3-social-signin-buttons/blob/master/index.html

जब मैं इसे खोलता हूं तो यह लेखक के कोड का प्रदान किया गया HTML नहीं दिखाता है। यह पृष्ठ को स्रोत कोड के रूप में दिखाता है।

क्या इसे सीधे HTML के रूप में देखना संभव है? अन्यथा मुझे हमेशा परिणाम देखने के लिए पूरे ज़िप को डाउनलोड करने की आवश्यकता है।

Comments

इसी तरह का सवाल: क्या मैं सिर्फ उनके स्रोत को देखने के बजाय, GitHub से सीधे HTML फाइलें चला सकता हूं?

— अमरो

जून 2019 तक, raw.githack.com सबसे सुविधाजनक समाधान प्रतीत होता है ( ऊपर दिए गए प्रश्न के उत्तर देखें )

— leopold.talirz

Answer 1

GitHub पर HTML फ़ाइलों का पूर्वावलोकन करने का सबसे आरामदायक तरीका https://htmlpreview.github.io/ पर जाना है या इसे मूल URL पर भेजना है , अर्थात: https://htmlpreview.github.io/?https:// github.com/bartaz/impress.js/blob/master/index.html

Comments

@ डेनिस: आप किस ब्राउज़र और किस URL का उपयोग कर रहे हैं? अभी के लिए, यह केवल वेबकिट और गेको ब्राउज़र का समर्थन करता है।

— niutech

ध्यान दें कि यह केवल सार्वजनिक रिपो के लिए काम करता है। निजी लोग त्रुटि संदेश देंगेError: Cannot load file

— एरिक ट्रॉटमैन

htmlpreview.github.com जावास्क्रिप्ट और सीएसएस को प्रस्तुत करने में आंशिक रूप से विफल रहता है। वैकल्पिक rawgit.com बेहतर सामग्री-प्रकार के हेडर के साथ फ़ाइलों की सेवा करने के लिए बेहतर काम करता है।

— जुलिएन कार्सिक

महान समाधान, धन्यवाद! मैंने README.md फ़ाइल के लिए उपसर्ग के साथ अपने R नोटबुक्स के लिंक जोड़े और यह मेरी nb.html फ़ाइल को बहुत अच्छी तरह से प्रस्तुत करता है। यहाँ पृष्ठ है कि कोई भी यह देखना चाहता है कि यह कैसे काम करता है: github.com/sargdavid/snippets.cvi और htmlpreview.github.io/?https://github.com/sargdavid/…

— Davit Sargsyan

इस समाधान की तरह दिखता है दिसंबर 2018 के अंतिम दिनों में काम करता है बंद हो जाता है अब तक हालांकि हम अभी भी इस राशि stackoverflow.com/a/8446391/860099

— कामिल Kiełczewski

Answer 2

यदि आप एक संग्रह डाउनलोड नहीं करना चाहते हैं तो आप इसे प्रस्तुत करने के लिए GitHub Pages का उपयोग कर सकते हैं ।

1. अपने खाते में भंडार का कांटा।
2. इसे अपनी मशीन पर स्थानीय रूप से क्लोन करें
3. एक gh-pagesशाखा बनाएं (यदि कोई पहले से मौजूद है, तो उसे हटा दें और एक नया आधार बनाएं master)।
4. GitHub पर वापस शाखा को पुश करें।
5. पेज देखें `परhttp://username.github.io/repo

कोड में:

git clone [e-mail]: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

Comments

मैंने अब एक प्रोजेक्ट कांटा किया है कि मैं इसे कैसे जीथब पेज पर कॉपी कर सकता हूं।

— जितेंद्र व्यास

एक प्रक्रिया के साथ मेरे जवाब को अपडेट किया।

— रोस

यह यहाँ अच्छी तरह से प्रलेखित है help.github.com/articles/creating-project-pages-manually

— Leif Gruenwoldt

क्यों पहले एक मास्टर बनाएं और इसे क्लोन करें ("प्रोजेक्ट में पेज-मैन्युअली बनाने के लिए इसे सुरक्षित रखें")? क्या checkout --orphan gh-pages केवल गुरु के साथ खिलवाड़ किए बिना, एक धक्का नहीं दे सकता है ?

— डेनिस

पृष्ठ अब github.io पर चले गए, अब github.com नहीं।

— दमजान पाव्लिका २०'१५ को a:

Answer 3

आप RawGit का उपयोग कर सकते हैं :
https://rawgit.com/necolas/css3-social-signin-buttons/master/index.html

यह http://htmlpreview.github.com/ की तुलना में बेहतर (इस लेखन के समय) काम करता है , उचित कंटेंट-टाइप हेडर वाली फाइलें परोसता है। इसके अतिरिक्त, यह उत्पादन में उपयोग के लिए CDN URL भी प्रदान करता है।

Comments

मैं पुष्टि करता हूं कि यह htmlpreview से बेहतर काम करता है। कम से कम, यह मेरे WebGL एनिमेशन दिखा रहा है।

— सिरिल डचोन-डोरिस

यह वास्तव में तेजी से काम करता है, और बोकेह ( जैसे ) के साथ, यह कुछ अंतःक्रियाओं (जैसे टूलटिप्स) को दिखाता है जो डब्ल्यूडब्ल्यूडी के साथ काम नहीं करते हैं।

— jadianes

Htmlpreview की तरह, निजी रिपॉजिटरी के साथ काम नहीं करता है। Git इनके लिए URL को सार्वजनिक URL की तरह बनाता है; टोकन = <हैश> जोड़कर, लेकिन इन टूल को इसे समझना चाहिए और इसे बाकी के साथ GH में पास करना चाहिए।

— जक्कम

यह रॉविजिट के लिए अक्सर पूछे जाने वाले प्रश्न से है: क्या मैं एक प्रॉडक्शन वेबसाइट पर या सार्वजनिक उदाहरण कोड में रॉविटजी.कॉम डेवलपमेंट यूआरएल का उपयोग कर सकता हूं? नहीं, केवल कम-ट्रैफ़िक परीक्षण के लिए या विकास के दौरान कुछ लोगों के साथ अस्थायी डेमो साझा करने के लिए rawgit.com URL का उपयोग करें। किसी भी चीज़ के लिए कृपया cdn.rawgit.com का उपयोग करें जिसके परिणामस्वरूप भारी ट्रैफ़िक हो सकता है या लोग अपने स्वयं के कोड में कॉपी और पेस्ट कर सकते हैं। ... वहाँ अधिक स्पष्टीकरण उपलब्ध है

— बैरीपाय

पुष्टि कर सकते हैं: रावजीत अक्टूबर 2019 तक बंद

— रहेगा।

Answer 4

यह वास्तव में आसान करने के लिए github पृष्ठों के साथ है , यह सिर्फ थोड़ा अजीब है पहली बार जब आप इसे करते हैं। पहली बार की तरह आप को बुनना सीखने के दौरान 3 बिल्ली के बच्चे को जगाना था। (ठीक है, यह सब बुरा नहीं है)

आपको एक gh- पृष्ठों की शाखा चाहिए:

मूल रूप से github.com रिपॉजिटरी की gh-pages शाखा की तलाश करता है। यह उन सभी HTML पेजों की सेवा करेगा जो यहां सामान्य HTML के रूप में ब्राउज़र को सीधे मिलते हैं।

मैं इस gh- पृष्ठ शाखा को कैसे प्राप्त करूं?

आसान। बस अपने github रेपो नामक एक शाखा बनाएँ gh-pages। --orphanजब आप इस शाखा का निर्माण करते हैं तो निर्दिष्ट करें , क्योंकि आप वास्तव में इस शाखा को अपनी github शाखा में वापस विलय नहीं करना चाहते हैं, आप बस एक शाखा चाहते हैं जिसमें आपका HTML संसाधन हो।

$ git checkout --orphan gh-pages

मेरे रेपो में अन्य सभी गन के बारे में क्या है, यह कैसे इसमें फिट होता है?

नहीं, तुम बस आगे जाओ और इसे हटा सकते हैं। और यह अब करना सुरक्षित है, क्योंकि आप ध्यान दे रहे हैं और एक अनाथ शाखा बनाई है जिसे आपकी मुख्य शाखा में वापस विलय नहीं किया जा सकता है और आपके सभी कोड हटा सकते हैं।

मैंने शाखा बनाई है, अब क्या?

आपको इस शाखा को github.com तक धकेलना होगा, ताकि उनका स्वचालन आपके लिए इन पृष्ठों की मेजबानी कर सके।

git push -u origin gh-pages

लेकिन .. मेरा HTML अभी भी नहीं परोसा जा रहा है!

इन शाखाओं को अनुक्रमित करने और सामग्री को परोसने के लिए आवश्यक बुनियादी ढाँचे को आग लगाने में कुछ मिनट लगते हैं। गितुब के अनुसार 10 मिनट तक।

कदम github.com द्वारा बाहर रखे गए

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

Comments

बहुत अच्छा काम करता है। Git noob के रूप में, मैं $ git commit -m 'init'आपकी पंक्तियों के बीच में भूल गया ।

— सिस्टमैडडिक्ट

URL क्या होगा?

— कोरा तुगय

हम्म ... इतना यकीन नहीं कि यह बाजीगर बिल्ली के बच्चे की तुलना में बहुत आसान है ...

— dreftymac

Answer 5

मैंने सभी टिप्पणियाँ पढ़ीं और सोचा कि GitHub ने सामान्य उपयोगकर्ता के लिए GitHub पृष्ठ बनाना तब तक मुश्किल बना दिया जब तक कि मैं GitHub विषय पृष्ठ पर नहीं गया, जहाँ इसके स्पष्ट उल्लेख है कि सेटिंग्स के अंतर्गत "GitHub पृष्ठ" का एक भाग है जहाँ आप कर सकते हैं। विकल्प चुनें "GitHub पेज के लिए मास्टर शाखा का उपयोग करें।" और voilà !! ... https://username.github.io/reponame पर उस विशेष रेपो की जाँच करें

Answer 6

इसके अलावा, यदि आप टेम्परमॉन्की का उपयोग करते हैं, तो आप एक स्क्रिप्ट जोड़ सकते हैं जो preview with http://htmlpreview.github.com/'रॉ', 'ब्लेम' और 'हिस्ट्री' बटन के साथ एक्शन मेनू में बटन जोड़ेगी ।

स्क्रिप्ट इस तरह से: https://gist.github.com/vanyakosmos/83ba165b288af32cf85e2cac8f02ce6d

Answer 7

आप क्रोम एक्सटेंशन का उपयोग करके HTML कोड का पूर्वावलोकन कर सकते हैं - Run Selected HTMLउपयोग करने के लिए काफी सरल।

यदि आप select all the codeगिटहब के मोड को पढ़ना चाहते हैं , तो यह भी काफी सरल है, सबसे पहले माउस कर्सर को <html>शीर्ष के शुरुआती ब्रैकेट में ले जाएं, फिर Shiftकुंजी को दबाए रखें , और इसके बाद कर्सर </html>को नीचे के ब्रैकेट में ले जाएं।

चयनित HTML - Chrome वेब स्टोर चलाएं

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

चरण 1 : रीड मोड में, html कोड के सभी निकाय का चयन करें।

चरण 2 : माउस राइट क्लिक "रन सीलेटेड एचटीएमएल", फिर आप नए टैब में प्रदान किए गए परिणाम देख सकते हैं।

चल परिणाम:

Answer 8

अब, यह पुराना उत्तर है (क्योंकि "सामग्री-प्रकार के विकल्प संशोधित करें" विस्तार अपेक्षित रूप से काम नहीं कर रहा है।)

यह समाधान केवल क्रोम ब्राउज़र के लिए है। मैं अन्य ब्राउज़र के बारे में निश्चित नहीं हूं।

1. क्रोम ब्राउजर में "कंटेंट-टाइप ऑप्शन्स" एक्सटेंशन जोड़ें।
2. ब्राउज़र में "क्रोम-एक्सटेंशन: //jnfofbopfpaoeojgieggflbpcblhfhka/options.html" खोलें।
3. कच्ची फ़ाइल url के लिए नियम जोड़ें। उदाहरण के लिए:
   • URL फ़िल्टर: https: ///raw/master//fileName.html
   • मूल प्रकार: पाठ / सादा
   • प्रतिस्थापन प्रकार: पाठ / html
4. फ़ाइल ब्राउज़र खोलें जिसे आपने नियम में चरण 3 में जोड़ा है।

Comments

पूछनेवाला शायद हर किसी को प्रदान किए गए पृष्ठ को देखना चाहता है।

— ओंद्रा Oižka

@zakmck ब्राउज़र "टेक्स्ट / प्लेन" हेडर भेज रहा है लेकिन आपको "टेक्स्ट / html" भेजने की आवश्यकता है। मैं अपना डेटा थर्ड पार्टी (" htmlpreview.github.com ") को नहीं भेज सकता कि मैं उपरोक्त चरणों का उपयोग क्यों कर रहा हूं। आप उपरोक्त चरणों में url के लिए नियमित अभिव्यक्ति का भी उपयोग कर सकते हैं।

— विजय

मैं बिल्कुल यही ढूंढ रहा था। मैं पृष्ठ को देखना चाहता हूं, और दोनों बिटकॉइन के रूप में गिट पर।

— एडुआर्डो रीस

मेरे लिए काम नहीं किया।

— एडुआर्डो रीस

@EduardoReis आज, मैंने अपनी मशीन पर जाँच की, यह अब काम नहीं कर रही है। हो सकता है, "सामग्री-प्रकार के विकल्प संशोधित करें" एक्सटेंशन में कुछ बदलाव हों। अगर मुझे कोई और एक्सटेंशन मिला तो मैं यहां पोस्ट करूंगा। धन्यवाद।

— विजय

Answer 9

यह एक सीधा जवाब नहीं है, लेकिन मुझे लगता है कि यह एक बहुत ही प्यारा विकल्प है।

http://www.s3auth.com/

यह आपको मूल पृष्ठ के पीछे अपने पृष्ठों की मेजबानी करने की अनुमति देता है। आपके निजी गितुब रेपो में एपी डॉक्स जैसी चीजों के लिए बढ़िया। बस अपने एपी बिल्ड के हिस्से के रूप में एक एस 3 रखो।

Comments

एक 3 पार्टी सेवा की तरह दिखता है जिसमें गिट के साथ कुछ भी सामान्य नहीं है। इस प्रश्न के संदर्भ में इसका उपयोग कैसे किया जाता है?

— स्तालिनको

Answer 10

आप सिर्फ जीथूब पेज को चालू कर सकते हैं। ^ _ ^

"सेटिंग्स" पर क्लिक करें, "गिटहब पेज" पर जाएं और "स्रोत" के तहत ड्रॉपडाउन पर क्लिक करें और उस शाखा को चुनें जिसे आप सार्वजनिक करना चाहते हैं (जहां मुख्य एचटीएमएल फ़ाइल स्थित है) आआंद वुआला। ^ _ ^