Neomezený rozsah a bezplatný Web Hosting se stránkami GitHub a Cloudflare

Mám tajemství, které šetří mým klientům spoustu peněz, udržuje jejich webové stránky v bezpečí a má vestavěné zálohy.

tajemství: dělám jejich webové stránky statické. Poté jej ukládám a hostuji pomocí GitHubu a pomocí Cloudflare jej obsluhuji přes HTTPS a zrychluji. Moji klienti vždy platí pouze za své doménové jméno, přesto dostanou mnohem víc, než kdy očekávali.

proč statický obsah?

statické stránky jsou úžasně rychlé, protože není zapojen žádný čas zpracování serveru., Také spácháním kódové základny statických aktiv v úložišti git se vrácení změn jednoduše stává otázkou návratu k předchozímu odevzdání. Zálohy jsougit push a v podstatě obsluhujete celý svůj web z mezipaměti, což znamená, že váš server téměř nikdy nebude muset znovu zpracovat požadavek.

budování komplexního uživatelského rozhraní?

s příchodem front-end rámců, jako je React a jeho příbuzní, můžete vytvářet magické zážitky s ničím jiným než HTML / CSS a JavaScript., Budete muset oddělit svou back-end logiku od front-end ačkoli, ale i Ruby on Rails lodě s režimem API nyní.

kdykoli dostanu smlouvu o vytvoření webové stránky, zvažuji, zda statický web stačí k uspokojení potřeb mého klienta a v mnoha případech je.

zajímá Vás, jaké případy použití mám na mysli? Skvělé! Pojďme diskutovat o některých situacích, kdy možná budete chtít zvážit statický obsah, a vysvětlit, jak tento přístup může ušetřit čas vás i vašeho klienta.,

webové stránky s brožurou

webové stránky s Brožurkami mají poskytovat informace o podnikání a během svého života se výrazně nemění. Dynamická aplikace je zjevně zbytečná pro tyto stránky, a protože tyto stránky jít neudržovaná pro let, dostávají málo, pokud žádné aktualizace, jsou obvykle snadné cíle pro hackery, no, hack.

statické šablony HTML jsou výrazně levnější než jejich protějšky CMS a v budoucnu je lze snadněji vyladit. Vývojáři požádáni o aktualizaci těchto stránek nevyžadují specializované znalosti o konkrétním CMS., Zpravidla vždy dělám statické webové stránky pro brožureware stránky.

Bonus: malé podniky milují neplatí opakující se měsíční hostingové poplatky. Je pravda, že hosting není obrovská cena, ale klienti se prostě nemusí obtěžovat platit nic jiného než doménu, což je skvělé.

jednostránkové aplikace

předvádíte skvělou a skvělou novou aplikaci, která se spoléhá na moderní front-end rámce?

vaše aplikace je již většinou statická., Udělat pár kroků navíc izolovat jakékoli straně serveru logiku do samostatné aplikace, a získat plný prospěch z mít vaše aplikace podává výhradně z Cloudflare je cache.

vaše aplikace bude k dispozici po celou dobu.

blogy

to je těžké prodat. Je těžké přesvědčit lidi, že statické stránky mohou být použity pro blogy, ale přečtěte si mě – neodešel jsem z hlubokého konce.

blogy nejsou nic jiného než obsah vykreslený šablonami. Jednoduše nepotřebujete plnohodnotnou aplikaci, která analyzuje každý požadavek a vykresluje novou stránku. Statické místo je ideální pro tento případ použití.,

zvažte Jekyll. Dáte mu tekuté šablony a Markdown obsah, a kombinuje je dohromady do statické webové stránky. Nevyžaduje se žádné zpracování za běhu a váš blog se najednou cítí výrazně rychleji.

tento pracovní postup je obzvláště užitečný, protože stránky GitHub podporují Jekyll. Najednou, blog příspěvky mohou být přispívány s požadavky pull, a veškerý váš obsah je uložen v rámci správy verzí. Ne-vývojáři mohou stále přispívat příspěvky v Markdown zveřejněním svých příspěvků prostřednictvím Stackedit.

ve skutečnosti používám Stackedit k napsání tohoto příspěvku právě teď!,

Pokud chcete komentáře k příspěvkům na blogu, Disqus vám dává výkonný systém komentářů vložením úryvku JavaScriptu.

tato stránka, kterou čtete, používá také Disqus.

stránky GitHub

stránky GitHub jsou odpovědí GitHubu na stránky projektu a umožňují vám obsluhovat jakékoli statické webové stránky přímo z vašeho úložiště. Vzhledem k tomu, GitHub stránky podporují vlastní domény, můžete hostit statické webové stránky na stránkách GitHub zdarma, s nasazuje přímo z Git.

nasazení na stránky GitHub.

dost mluvit, uvidíme to v akci!,

jsem šel dopředu a udělal jednu stránku reagovat aplikaci, která načte a zobrazí aktuální směnný kurz pro pákistánské rupie z veřejného API. Nasadíme to na stránky GitHub.

nejprve vytvoříme nové úložiště GitHub.

GitHub pages jsou podávány z pobočky s názvem gh-pages tak pojďme vytvořit pro svůj projekt.

$ git checkout -b gh-pagesSwitched to a new branch 'gh-pages'

a posuneme web nahoru:

a jsme hotovi!, V tomto bodě webové stránky budou k dispozici na s zdarma SSL:

Důležité věci, na vědomí:

• GitHub stránky slouží index.html soubor ve vašem projektu gh-pages větve
• webové stránky se podává v USERNAME.github.io/REPOSITORY-NAME

Přizpůsobení název domény.

servírování webu mimo GitHub je v pořádku, ale každý slušný web potřebuje vlastní název domény. Naštěstí, GitHub vám umožní přinést svou vlastní doménu na párty!,

nejprve vytvoříme speciální soubor CNAME a umístíme tam název naší domény. To umožní githubovi vědět, který název domény má směřovat do úložiště.

$ echo 'pricecheck.gilani.me' > CNAME$ git add .$ git commit -m 'Add a custom domain'...$ git push...

za Druhé, ať je to bod na CNAME pro naši subdoménu na GitHub DNS na USERNAME.github.io:

Upozornění: Nepoužívejte tento pro apex domény! PřidáníCNAME záznam do kořenového adresáře vaše doména zakáže MX a TXT záznamy., Použijte to pouze pro subdoménu. Apex domény jsou diskutovány později.

V tomto bodě, naše webové stránky by měl běžet na naše vlastní domény na HTTP:

Důležité věci si uvědomit:

• výchozí *.github.io doména je podávána přes HTTPS.
• náš vlastní název domény se podává prostřednictvím nezabezpečeného HTTP.
• nepoužívejteCNAME záznam v doméně apex, pokud nechcete své e-maily zabít.

omezení stránek GitHub:

• Repos musí mít Velikost souboru menší než 1 GB.,
• webové stránky musí mít Velikost souboru menší než 1 GB.
• měsíční limit šířky pásma je 100 GB. Obejdeme to později.

Použití apex doméně jako vaše vlastní domény

nejjednodušší způsob, jak obejít toto omezení je použít www u, jelikož vaše subdomény a přesměrovat veškerý HTTP provoz z vrcholu do www. V mém příkladu bych přesměrovat gilani.me , který ukazuje na můj statické stránky, ale nelíbí se mi dělat věci jednoduchým způsobem.,

Pokud opravdu chcete použít doménu apex, zkontrolujte, zda vám poskytovatel DNS umožňuje nastavit ANAME záznamy. Tyto jsou (zjednodušená) na půli cesty mezi CNAME záznamy od vás nechali přejděte na domény a A záznamy, protože nemají zrušit jiné záznamy na stejné zóně.

No ANAME? Poslední možností je změna na poskytovatele DNS, který to podporuje: zadejte Cloudflare., Cloudflare poskytujeCNAME zploštění na doménách apex, což je ekvivalent záznamu ANAME. Nejlepší je udělat přepínač právě teď, protože budeme pokrývat Cloudflare v další části.

TLDR: přepněte na bezplatný DNS Cloudflare a nastavte CNAME na doméně apex. Dělají něco zvláštního s jejich CNAME to dělá to funguje.

SSL a Cloudflare

Vítejte v éře Post-Snowden., Všechny naše nejhorší obavy schválil vládní snooping a hacking byly potvrzeny, a svět se usilovně snaží zabezpečit data v tranzitu a v klidu.

jako moderní webový administrátor se očekává, že na vašem webu poskytnete alespoň SSL bez smíšeného obsahu.

došlo k bodu, kdy Google Chrome označuje běžné webové stránky HTTPS jako nezabezpečené a vyhledávání Google začíná upřednostňovat webové stránky HTTPS příznivěji ve svém žebříčku. Budeme diskutovat ještě více strategií pro zajištění front-end později, ale prozatím budeme pokrývat pouze SSL.

naštěstí jsme nyní zašifrovali.,

je to nezisková a zcela automatizovaná certifikační autorita (CA), která Vám umožňuje programově vydávat krátkodobé 90denní SSL certifikáty pro všechny domény, které ovládáte. Je to hračka k použití; je to open source; a projekt je podporován množstvím společností, včetně Mozilly a Nadace Electronic Frontier Foundation.

uvedení Cloudflare k dobrému použití

Cloudflare je služba ochrany DNS, CDN a DDoS.

ukládá vaše webové stránky do mezipaměti a slouží uživatelům ze serverů geograficky blízkých, čímž je váš web rychlejší., Má další výhodu, že vás udržuje pod limitem šířky pásma GitHubu 100GB, protože i když se váš web stane šíleně populární, většina požadavků zasáhne mezipaměť a nikdy se nedostane na server.

kromě toho nabízí Cloudflare službu s názvem Universal SSL, kde vám vydávají bezplatný SSL certifikát od svých partnerů CA, takže získáte HTTPS zdarma … navždy.

proč Cloudflare?

vím, co si myslíte: Gílání, právě jsi mi řekl, jak úžasné Nechat to Šifrování je. Proč mluvíš o Cloudflare? No, všechno jde o jednoduchost.,

Jako duševní cvičení, představte si, nastavení více Nginx cache a reverzní proxy po celém světě, dává jim všechny platné SSL certifikáty a slouží uživatelům webových stránek od jejich nejbližších místech.

To má za následek vaše webové stránky se podává prostřednictvím SSL i v případě, že původ server nemá certifikát SSL, i když Cloudflare vám dává speciální self-signed certifikáty, které si můžete dát na svůj původ server pro bezpečné připojení až Cloudflare servery. To je to, co vám Cloudflare dává s bezplatným plánem a nemusíte ani obnovovat certifikát každých 90 dní.,

jako nezávislý pracovník získávám klienty, kteří chtějí co nejrychleji spustit web pro své podnikání. Nerozumí ani se nestarají o bezpečnostní obavy, trápí moderní web nebo šifrování během tranzitu. Někteří klienti se snaží pochopit myšlenku doménových jmen, a najít to nepříjemné, když musí zaplatit $15 roční poplatek „jen aby moje webové stránky běží“. Zkuste jim tedy vysvětlit, proč musí platit za shluk reverzních proxy, které chrání jejich web, který běží na samotném bezplatném hostingu.

nastavení Cloudflare SSL

pojďme si znovu zašpinit ruce., První věc, kterou udělat, přepínač směrování všechny vaše dopravu přes Cloudflare:

Dále, pod Crypto, zabezpeˇ cení SSL nastavte úroveň na „Plnou.“

Síla „Automatické HTTPS Přepsat“ zabít smíšený obsah varování.

v tomto okamžiku bude naše webové stránky pracovat přes HTTP i HTTPS. Vynutíme HTTPS pro všechno v naší doméně.

vše hotovo., Naše webové stránky by se měly vždy načíst přes HTTPS se zeleným“ zabezpečeným “ hodnocením v prohlížeči Chrome.

Poslední Slova a Bezpečnostní Aspekty

Existuje několik věcí, které jsem nevěděl, diskutovali výše, a rád bych si chvíli, abych objasnil pár bodů.

šikovnější z vás bude poukázat na to, že tam jsou některé do očí bijící bezpečnostní problémy s tímto nastavením, a to, že neexistují žádné bezpečné HTTP hlavičky jako:

• Content-Security-Policy: zatížení skripty a majetku před whitelist hostí, a může zakázat inline js.,
• X-Frame-Options: zakáže načítání vašeho webu v iframe.

a máte pravdu. Stránky GitHub a dokonce ani Cloudflare vám neumožňují přizpůsobit záhlaví HTTP. CSP však můžete nastavit pomocí značky HTML meta.

Stačí vložit do vaší stránky:

<meta http-equiv="Content-Security-Policy" content="default-src https:">

Nicméně, v současné době, neexistuje žádný praktický způsob, jak nastavit X-Frame-Options záhlaví na GitHub pages, což znamená, že útočník může nahrát své webové stránky do speciálně vytvořený iframe a vytáhněte XSS útoku., Pokud jste oddaný, i když, můžete obejít tento problém tím, že žádá uživatele, aby potvrdil své heslo nebo 2FA token při každém citlivé činnosti, nebo složením CSRF token při každém ověřené žádosti.

velkým problémem pro některé je to, že pomocí bezplatných veřejných úložišť v GitHubu je váš web a zdrojový kód k dispozici každému, kdo jej chce rozvětvit nebo stáhnout. Takže si myslím, že obavy zde jsou nesprávné.

statický obsah není zdrojový kód v tom smyslu, že není kompilován nebo zpracován jako skript před podáním uživateli., Váš uživatel dostane přesně stejnou statickou kopii webu, pokud by měl spustit webový prohledávač namířený na váš web. Zatímco hosting kódu v úložišti GitHub rozhodně usnadňuje stahování kopie vašeho webu, nevystavuje nic, co již nebylo veřejné.

škálování, neomezené škálování

nápady uvedené v tomto článku se neomezují pouze na bezplatný webhosting malých aplikací.,

můžete vytvořit front-end vrstvy založené na moderní JavaScript rámec, háček je až do rozsáhlé cloud-based Backend-as-a-Service (BaaS), jako Firebase, a vytvářet složité aplikace bez starostí o servery, uptime, nebo jakékoli jiné infrastruktury související problém.

vytvoření nové vzrušující webové hry?! Podívejte se na GameSparks, a ty jsou dobré jít.

shrnutí, vyznání a odkazy

v tomto článku jsem to vypadalo, jako bych ručně publikoval svou aplikaci React na gh-pages. Nic takového jsem neudělal., Pracoval jsem na master a když přišel čas nasadit, běžel jsem npm run deploy která odstartovala build script a tlačil stavět do gh-pages. Podívejte se prosím namaster větev mého úložiště, abyste zjistili, jak to funguje.,

Takeaways

Výhody:

• Okamžité nasazení
• Snadná spolupráce
• Bezpečné hosting prostředí

Upozornění:

• přístup k HTTP hlavičky
• Snadno stáhnout kopii webové stránky
• GitHub znalosti
• Závisí na dodavateli technologií

Odkazy: