{"id":6305,"date":"2020-05-19T12:13:44","date_gmt":"2020-05-19T12:13:44","guid":{"rendered":"https:\/\/max-drake.cc\/?p=6305"},"modified":"2020-05-20T12:02:13","modified_gmt":"2020-05-20T12:02:13","slug":"deploy-code-to-github-for-web-page-with-freenom-domain-cloudflare-dns-for-https-security","status":"publish","type":"post","link":"https:\/\/max-drake.cc\/?p=6305","title":{"rendered":"Deploy code to Github for web page with Freenom domain &#038; Cloudflare DNS for HTTPS security"},"content":{"rendered":"\n<p>Use gitgub to host your website is a free service that you can utilise as well as using Freenom to get a free domain name for the site instead of the github domain. To get the Custom domain secure you can use Cloudflare CDN. <\/p>\n\n\n\n<figure class=\"wp-block-embed-youtube wp-block-embed is-type-video is-provider-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe title=\"Github Free Web Hosting Free Custom Domain,CDN,SSL\" width=\"678\" height=\"381\" data-src=\"https:\/\/www.youtube.com\/embed\/Cbhz3Lzomcs?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" class=\"lazyload\" data-load-mode=\"1\"><\/iframe>\n<\/div><\/figure>\n\n\n\n<p>This is something that occurs when working on your own, you do silly things and no-one points out to you how foolish those thins are. I&#8217;m currently hosting the covidmap.html on one of my websites on my VPS (Virtual Private Server). So after getting updated code in Excel, I paste it into a code editor and test it, then copy across to my VPS. <\/p>\n\n\n\n<p>I could just update the code in VS Code and then push to github and host it as a static website, in some way similar to what I&#8217;m doing with my VPS but can use VS code to do the Git push saving me bouncing between programmes.  The one question is the CDN hosting on Cloudflare holds a cache of the files, so could be displaying out of date data. I think the cache is updated every 4 hours but havent explored it. <\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Setup on Github<\/h3>\n\n\n\n<p>Pretty simple, you have to make the repo <strong><span style=\"color:#cf2e2e\" class=\"color\">public<\/span><\/strong> or pay. So I made the repo public, <strong><a rel=\"noreferrer noopener\" href=\"https:\/\/github.com\/drakemax\/TestGraphPage\" target=\"_blank\">HERE<\/a><\/strong>. <\/p>\n\n\n\n<p>Next, go to Settings Tab on the Repo and scroll down to GitHub Pages and choose the branch that you want to be the web page. It saves itself then gives you a link (<em>see green band in image below<\/em>.) If you<strong><span style=\"color:#cf2e2e\" class=\"color\"> RIGHT click on LINK <\/span><\/strong>then choose <strong>Open in new tab <\/strong> it will open in the browser,<em><span style=\"background-color:#7bdcb5\" class=\"background-color\"> you may have to type in the intex.html file as someties I got a blank, it takes a little while to recognise the link as live. <\/span><\/em><\/p>\n\n\n\n<p>There is abox for custom domain, further down, we need to go to Freenom to set that up:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"837\" height=\"712\" data-src=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-17_02_36-Options.jpg\" alt=\"\" class=\"wp-image-6306 lazyload\" data-srcset=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-17_02_36-Options.jpg 837w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-17_02_36-Options-300x255.jpg 300w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-17_02_36-Options-768x653.jpg 768w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-17_02_36-Options-50x43.jpg 50w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-17_02_36-Options-59x50.jpg 59w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-17_02_36-Options-100x85.jpg 100w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-17_02_36-Options-118x100.jpg 118w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-17_02_36-Options-752x640.jpg 752w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-17_02_36-Options-640x544.jpg 640w\" data-sizes=\"(max-width: 837px) 100vw, 837px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 837px; --smush-placeholder-aspect-ratio: 837\/712;\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">Freenom initial setup<\/h4>\n\n\n\n<p>Get new DNS. Freenom doesn&#8217;t like me at the moment as its not letting me create new domains. Re-purposing some of my existing domains I&#8217;ve initially set the &#8220;<a href=\"https:\/\/my.freenom.com\/clientarea.php?managedns=max-drake.cc&amp;domainid=1086504947\">Manage Freenom DNS<\/a>&#8221; to:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"434\" data-src=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_16-Client-Area-Freenom-1024x434.jpg\" alt=\"\" class=\"wp-image-6310 lazyload\" data-srcset=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_16-Client-Area-Freenom-1024x434.jpg 1024w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_16-Client-Area-Freenom-300x127.jpg 300w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_16-Client-Area-Freenom-768x326.jpg 768w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_16-Client-Area-Freenom-1536x651.jpg 1536w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_16-Client-Area-Freenom-2048x869.jpg 2048w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_16-Client-Area-Freenom-50x21.jpg 50w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_16-Client-Area-Freenom-118x50.jpg 118w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_16-Client-Area-Freenom-100x42.jpg 100w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_16-Client-Area-Freenom-236x100.jpg 236w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_16-Client-Area-Freenom-1509x640.jpg 1509w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_16-Client-Area-Freenom-640x271.jpg 640w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_16-Client-Area-Freenom-1811x768.jpg 1811w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_16-Client-Area-Freenom-1920x814.jpg 1920w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_16-Client-Area-Freenom-scaled.jpg 1600w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/434;\" \/><\/figure>\n\n\n\n<p>Once those point to<strong><span style=\"color:#cf2e2e\" class=\"color\"> [GITHUB ACCOUNTNAME].github.io<\/span><\/strong>, in my case drakemax<strong>.github.io<\/strong>  the root path, NOT the Repo itself. (<em><span style=\"color:#ff6900\" class=\"color\">This is confusing, but you have to make a file in the repo called <\/span><strong><span style=\"color:#cf2e2e\" class=\"color\">CNAME<\/span><\/strong><span style=\"color:#ff6900\" class=\"color\"> with the name of your Domain in it with no whitespaces and save it. )<\/span><\/em><\/p>\n\n\n\n<p>Note, in filling out the DNS form in Freenom the TTL should be set to the smallest number, this I&#8217;ve heard means TimeToLive , so when its going to start propogating across the servers to update the domain data. <\/p>\n\n\n\n<p>For the Github IP&#8217;s they suggest you get them from the meta page <strong><a href=\"https:\/\/developer.github.com\/v3\/meta\/\" target=\"_blank\" rel=\"noreferrer noopener\">HERE.<\/a><\/strong> <\/p>\n\n\n\n<p>Saving<a href=\"https:\/\/max-drake.cc\/?p=6305\">Preview(opens in a new tab)<\/a>Add titleDeploy code to Github for web page with freenom domain<\/p>\n\n\n\n<p>Use gitgub to host your website is a free service that you can utilise as well as using Freenom to get a free domain name for the site instead of the github domain. To get the Custom domain secure you can use Cloudflare CDN.<\/p>\n\n\n\n<p>This is something that occurs when working on your own, you do silly things and no-one points out to you how foolish those thins are. I&#8217;m currently hosting the covidmap.html on one of my websites on my VPS (Virtual Private Server). So after getting updated code in Excel, I paste it into a code editor and test it, then copy across to my VPS.<\/p>\n\n\n\n<p>I could just update the code in VS Code and then push to github and host it as a static website, in some way similar to what I&#8217;m doing with my VPS but can use VS code to do the Git push saving me bouncing between programmes. The one question is the CDN hosting on Cloudflare holds a cache of the files, so could be displaying out of date data. I think the cache is updated every 4 hours but havent explored it.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Setup on Github<\/h3>\n\n\n\n<p>Pretty simple, you have to make the repo <strong>public<\/strong> or pay. So I made the repo public, <strong><a rel=\"noreferrer noopener\" href=\"https:\/\/github.com\/drakemax\/TestGraphPage\" target=\"_blank\">HERE<\/a><\/strong>.<\/p>\n\n\n\n<p>Next, go to Settings Tab on the Repo and scroll down to GitHub Pages and choose the branch that you want to be the web page. It saves itself then gives you a link (<em>see green band in image below<\/em>.) If you<strong> RIGHT click on LINK <\/strong>then choose <strong>Open in new tab<\/strong> it will open in the browser,<em> you may have to type in the intex.html file as someties I got a blank, it takes a little while to recognise the link as live.<\/em><\/p>\n\n\n\n<p>There is abox for custom domain, further down, we need to go to Freenom to set that up:<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" data-src=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-17_02_36-Options.jpg\" alt=\"This image has an empty alt attribute; its file name is 2020-05-19-17_02_36-Options.jpg\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" class=\"lazyload\" style=\"--smush-placeholder-width: 837px; --smush-placeholder-aspect-ratio: 837\/712;\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">Freenom initial setup<\/h4>\n\n\n\n<p>Get new DNS. Freenom doesn&#8217;t like me at the moment as its not letting me create new domains. Re-purposing some of my existing domains I&#8217;ve initially set the &#8220;<a href=\"https:\/\/my.freenom.com\/clientarea.php?managedns=max-drake.cc&amp;domainid=1086504947\">Manage Freenom DNS<\/a>&#8221; to:<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" data-src=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_16-Client-Area-Freenom-1024x434.jpg\" alt=\"This image has an empty alt attribute; its file name is 2020-05-19-15_05_16-Client-Area-Freenom-1024x434.jpg\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" class=\"lazyload\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/434;\" \/><\/figure>\n\n\n\n<p>Once those point to<strong> [GITHUB ACCOUNTNAME].github.io<\/strong>, in my case drakemax<strong>.github.io<\/strong> the root path, NOT the Repo itself. (<em>This is confusing, but you have to make a file in the repo called <strong>CNAME<\/strong> with the name of your Domain in it with no whitespaces and save it. )<\/em><\/p>\n\n\n\n<p>Note, in filling out the DNS form in Freenom the TTL should be set to the smallest number, this I&#8217;ve heard means TimeToLive , so when its going to start propogating across the servers to update the domain data.<\/p>\n\n\n\n<p>For the Github IP&#8217;s they suggest you get them from the meta page <strong><a href=\"https:\/\/developer.github.com\/v3\/meta\/\" target=\"_blank\" rel=\"noreferrer noopener\">HERE.<\/a><\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" data-src=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-09_57_50-Meta-_-GitHub-Developer-Guide-1024x1017.jpg\" alt=\"This image has an empty alt attribute; its file name is 2020-05-20-09_57_50-Meta-_-GitHub-Developer-Guide-1024x1017.jpg\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" class=\"lazyload\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/1017;\" \/><\/figure>\n\n\n\n<p>The <strong>CNAME<\/strong> file points the domain name to the specific repo in your account.<\/p>\n\n\n\n<p>You put your Domain name into the Custom Domain name box as <strong>www.drax.gq<\/strong> (with the www. in fromnt of it) and after the re-routing of domain name to github it goes live .<\/p>\n\n\n\n<p><strong>BUT<\/strong> it will be an<strong> http:\/\/www.drax.gq<\/strong> so an insecure website that Goggle thinks is BAD.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" data-src=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-18_15_02-Transmission-Type.jpg\" alt=\"This image has an empty alt attribute; its file name is 2020-05-19-18_15_02-Transmission-Type.jpg\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" class=\"lazyload\" style=\"--smush-placeholder-width: 301px; --smush-placeholder-aspect-ratio: 301\/116;\" \/><\/figure>\n\n\n\n<p>So at this point, we have a website, either with an odd <strong>https:\/\/drakemax.github.io\/TestGraphPage\/<\/strong> URL which is secure but cumbersome, or a <strong>http:\/\/www.drax.gq<\/strong> URL that expresses the persons identity about the site, but insecure!<\/p>\n\n\n\n<p>So what we have done here is got a free domain, who&#8217;s postal adddress (or mobile phone number provider) is Freenom. But we&#8217;ve moved address (or Mobile phone number) to a different place (mobile number provider) so we need to redirect it to where it now is, which is Github server and the user account is drakemax.<\/p>\n\n\n\n<p>We have to share that change of address (new mobile phone provider (keeping the same number)) around to other people or else they wont be able to contact us. This REDIRECT is sent out to lots of different servers around the world that keeps peoples addresses.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Cloudflare setup for security and quicker user response globally to your website<\/h4>\n\n\n\n<p>So, in comes<strong> Cloudflare CDN<\/strong>. This offers 2 things, 1\/ A secure site with a HTTPS for the custom domain name &amp; 2\/ A Content Delivery Network as well. This basically Caches your webpagers around the globe so that when someone from Calefornia looks at your website by typing in <strong>www.drax.gq<\/strong> (<em>I&#8217;m leaving out the http\/ or S for the moment<\/em>) instead of coming to my website in New Zealand, the call goes to a server on the West Coast of the USA and takes the information from there, as there is a copy of our website on that server. It will be updated at regular intervals , so any changes you&#8217;ve made on your website can be shown on the updated servers around the world.<\/p>\n\n\n\n<p>Why would you want to do that?<\/p>\n\n\n\n<p>If you have big images and videos and GIFs and other big files on your website display pages, then when a person calls to your site those files have to be copied acorss to their computer so that they can be shown. If they are very big, then they will take a while to be copied across, so the website will be SLOW SLOW SLOW!<\/p>\n\n\n\n<p>So what CDN or Content Delivery Network does is store a copy of each of your web pages , a snapshot of them at an instant in time, and stores that information on web servers around the world. So when the person in Calefornia asks for a web page they get the information from that West Coast of USA server rather than files from New Zealand, so the time to get the files from a local server will be quicker and your webpage will render on their screen quicker, so will be more responsive.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">What do we need to do for cloudflare ? Part 1- Change of address<\/h4>\n\n\n\n<p>First, there is a free tier. So we can use cloudflare to host our content. What it needs is to get us to tell FREENOM to redirect enquiries from Freenom servers to Cloudflare servers, so we need to change the Nameserver addresses<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" data-src=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_49-Client-Area-Freenom-1024x346.jpg\" alt=\"This image has an empty alt attribute; its file name is 2020-05-19-15_05_49-Client-Area-Freenom-1024x346.jpg\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" class=\"lazyload\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/346;\" \/><\/figure>\n\n\n\n<p>The standard freenom has 4 nameserver addresses, but the cloudflare server only has 2.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" data-src=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_59-Client-Area-Freenom-1024x425.jpg\" alt=\"This image has an empty alt attribute; its file name is 2020-05-19-15_05_59-Client-Area-Freenom-1024x425.jpg\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" class=\"lazyload\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/425;\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" data-src=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_06_53-Client-Area-Freenom-1024x541.jpg\" alt=\"This image has an empty alt attribute; its file name is 2020-05-19-15_06_53-Client-Area-Freenom-1024x541.jpg\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" class=\"lazyload\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/541;\" \/><\/figure>\n\n\n\n<p>So we&#8217;re telling the FREENOM server , when the address comes in , send it to another server (<em>or master post office, in this case Cloudflare server<\/em>) where they will sort\/redirect the information to . So like a CAR number plate, registered at one location, when someone comes to enquire about it, they redirect them to another place where the numberplate was re- registered.<\/p>\n\n\n\n<p>Now, as per the car, the owner is still the same, GitHub, they have the file that we are calling, but instead of going to the original organization that registered the car, the owner has taken his car to another country, and they now have the records of that car &amp; its owners information.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">What do we need to do for cloudflare ? Part 2- Filters<\/h4>\n\n\n\n<p><em>The Domain Name System<\/em> (<strong>DNS)<\/strong> is the phonebook of the Internet. We have a couple of ways of reaching a specific place and they are 1\/ <strong>http:\/\/drax.cf<\/strong> or 2 \/ <strong>http:\/\/www.drax.cf <\/strong>(though you may only see it in the address bar on your browser as <strong>www.drax.cf<\/strong>. So to mananage the variations we use a filter, that takes in varients , like the above 2 examples and conmverts them into an HTTPS to make them secure. It usesPage Rules to allow varients using<strong> http:\/\/*drax.gq\/*<\/strong> and says anything with these varients change to an HTTPS secure link.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" data-src=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-19_53_59-Page-Rules-_-drax.gq-_-Account-_-Cloudflare-Web-Performance-Security-1-1024x620.jpg\" alt=\"This image has an empty alt attribute; its file name is 2020-05-19-19_53_59-Page-Rules-_-drax.gq-_-Account-_-Cloudflare-Web-Performance-Security-1-1024x620.jpg\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" class=\"lazyload\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/620;\" \/><\/figure>\n\n\n\n<p>On websites such as <strong>http:\/\/drax.gq <\/strong>you can have sub-domains, these can be totally different web pages accesses from a path like <strong>Http:\/\/about\/drax.gq<\/strong> which would take you to a totally seperate web page. You could also make a file called about.html and put it in <strong>http:\/\/drax.gq<\/strong>\/about.html but you&#8217;ll see a few sites that use sub-domains to take you to say a members area of the site, or an area where there is a checkout or shop area or blog area on a site, so a discrete sub area of the website. This is aprapos to the <strong>http:\/\/*drax.gq<\/strong> part of that page rule that will allow you to reach these points of the site as well through a secure connection.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Finally the webpage<\/h4>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" data-src=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-10_01_04-Mail-1024x428.jpg\" alt=\"This image has an empty alt attribute; its file name is 2020-05-20-10_01_04-Mail-1024x428.jpg\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" class=\"lazyload\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/428;\" \/><\/figure>\n\n\n\n<p>To recap, this is what we have done:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>deploy files to free Github account to a Repository (folder)<\/li><li>allow the folder to be web enabled in Github &amp; get URL link to html website files<\/li><li>create a free FREENOM account to get a free CUSTOM DNS name<\/li><li>Host the DNS name in the Github repository<\/li><li>This DNS is only http:\/\/ so is insecure, to secure it we use cloudflare<\/li><li>Create free cloudflare account that will cache outr websitre around the globe and make it an HTTPS:\/\/ site so secure and data flow encrypted<\/li><\/ul>\n\n\n\n<p>Well done all.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"1017\" data-src=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-09_57_50-Meta-_-GitHub-Developer-Guide-1024x1017.jpg\" alt=\"\" class=\"wp-image-6317 lazyload\" data-srcset=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-09_57_50-Meta-_-GitHub-Developer-Guide-1024x1017.jpg 1024w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-09_57_50-Meta-_-GitHub-Developer-Guide-300x298.jpg 300w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-09_57_50-Meta-_-GitHub-Developer-Guide-150x150.jpg 150w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-09_57_50-Meta-_-GitHub-Developer-Guide-768x763.jpg 768w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-09_57_50-Meta-_-GitHub-Developer-Guide-50x50.jpg 50w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-09_57_50-Meta-_-GitHub-Developer-Guide-100x100.jpg 100w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-09_57_50-Meta-_-GitHub-Developer-Guide-101x100.jpg 101w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-09_57_50-Meta-_-GitHub-Developer-Guide-644x640.jpg 644w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-09_57_50-Meta-_-GitHub-Developer-Guide-640x636.jpg 640w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-09_57_50-Meta-_-GitHub-Developer-Guide-773x768.jpg 773w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-09_57_50-Meta-_-GitHub-Developer-Guide.jpg 1048w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/1017;\" \/><\/figure>\n\n\n\n<p>The <strong><span style=\"color:#cf2e2e\" class=\"color\">CNAME<\/span><\/strong> file points the domain name to the specific repo in your account. <\/p>\n\n\n\n<p>You put your Domain name into the Custom Domain name box as <strong><span style=\"color:#cf2e2e\" class=\"color\">www.drax.gq <\/span><\/strong> (with the www. in fromnt of it) and after the re-routing of domain name to github it goes live . <\/p>\n\n\n\n<p><strong><span style=\"color:#cf2e2e\" class=\"color\">BUT<\/span><\/strong> it will be an<strong><span style=\"color:#cf2e2e\" class=\"color\"> http:\/\/<\/span>www.drax.gq<\/strong> so an insecure website that Goggle thinks is BAD.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"301\" height=\"116\" data-src=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-18_15_02-Transmission-Type.jpg\" alt=\"\" class=\"wp-image-6311 lazyload\" data-srcset=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-18_15_02-Transmission-Type.jpg 301w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-18_15_02-Transmission-Type-50x19.jpg 50w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-18_15_02-Transmission-Type-130x50.jpg 130w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-18_15_02-Transmission-Type-100x39.jpg 100w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-18_15_02-Transmission-Type-259x100.jpg 259w\" data-sizes=\"(max-width: 301px) 100vw, 301px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 301px; --smush-placeholder-aspect-ratio: 301\/116;\" \/><\/figure>\n\n\n\n<p>So at this point, we have a website, either with an odd <strong><span style=\"color:#cf2e2e\" class=\"color\">https:\/\/drakemax.github.io\/TestGraphPage\/<\/span><\/strong>  URL which is secure but cumbersome, or a <strong><span style=\"color:#cf2e2e\" class=\"color\">http:\/\/www.drax.gq<\/span><\/strong>  URL that expresses the persons identity about the site, but insecure!<\/p>\n\n\n\n<p>So what we have done here is got a free domain, who&#8217;s postal adddress (or mobile phone number provider) is Freenom. But we&#8217;ve moved address (or Mobile phone number) to a different place (mobile number provider) so we need to redirect it to where it now is, which is Github server and the user account is drakemax. <\/p>\n\n\n\n<p>We have to share that change of address (new mobile phone provider (keeping the same number)) around to other people or else they wont be able to contact us. This REDIRECT is sent out to lots of different servers around the world that keeps peoples addresses. <\/p>\n\n\n\n<h4 class=\"wp-block-heading\"><span style=\"color:#9b51e0\" class=\"color\">Cloud<\/span><span style=\"color:#cf2e2e\" class=\"color\">flare<\/span> setup for security and quicker user response globally to your website<\/h4>\n\n\n\n<p>So, in comes<strong> Cloudflare CDN<\/strong>. This offers 2 things, 1\/ A secure site with a HTTPS for the custom domain name &amp; 2\/ A Content Delivery Network as well. This basically Caches your webpagers around the globe so that when someone from Calefornia looks at your website by typing in <strong>www.drax.gq<\/strong> (<em>I&#8217;m leaving out the http\/ or S  for the moment<\/em>) instead of coming to my website in New Zealand, the call goes to a server on the West Coast of the USA and takes the information from there, as there is a copy of our website on that server. It will be updated at regular intervals , so any changes you&#8217;ve made on your website can be shown on the updated servers around the world. <\/p>\n\n\n\n<p>Why would you want to do that? <\/p>\n\n\n\n<p>If you have big images and videos and GIFs and other big files on your website display pages, then when a person calls to your site those files have to be copied acorss to their computer so that they can be shown. If they are very big, then they will take a while to be copied across, so the website will be SLOW SLOW SLOW!<\/p>\n\n\n\n<p>So what CDN or Content Delivery Network does is store a copy of each of your web pages , a snapshot of them at an instant in time, and stores that information on web servers around the world. So when the person in Calefornia asks for a web page they get the information from that West Coast of USA server rather than files from New Zealand, so the time to get the files from a local server will be quicker and your webpage will render on their screen quicker, so will be more responsive. <\/p>\n\n\n\n<h4 class=\"wp-block-heading\">What do we need to do for cloudflare ? Part 1- <span style=\"color:#0693e3\" class=\"color\">Change of address<\/span><\/h4>\n\n\n\n<p>First, there is a free tier. So we can use cloudflare to host our content. What it needs is to get us to tell FREENOM to redirect enquiries from Freenom servers to Cloudflare servers, so we need to change the Nameserver addresses<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"346\" data-src=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_49-Client-Area-Freenom-1024x346.jpg\" alt=\"\" class=\"wp-image-6312 lazyload\" data-srcset=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_49-Client-Area-Freenom-1024x346.jpg 1024w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_49-Client-Area-Freenom-300x101.jpg 300w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_49-Client-Area-Freenom-768x260.jpg 768w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_49-Client-Area-Freenom-50x17.jpg 50w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_49-Client-Area-Freenom-148x50.jpg 148w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_49-Client-Area-Freenom-100x34.jpg 100w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_49-Client-Area-Freenom-296x100.jpg 296w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_49-Client-Area-Freenom-640x216.jpg 640w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_49-Client-Area-Freenom.jpg 1464w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/346;\" \/><\/figure>\n\n\n\n<p>The standard freenom has 4 nameserver addresses, but the cloudflare server only has 2. <\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"425\" data-src=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_59-Client-Area-Freenom-1024x425.jpg\" alt=\"\" class=\"wp-image-6313 lazyload\" data-srcset=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_59-Client-Area-Freenom-1024x425.jpg 1024w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_59-Client-Area-Freenom-300x125.jpg 300w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_59-Client-Area-Freenom-768x319.jpg 768w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_59-Client-Area-Freenom-1536x638.jpg 1536w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_59-Client-Area-Freenom-50x21.jpg 50w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_59-Client-Area-Freenom-120x50.jpg 120w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_59-Client-Area-Freenom-100x42.jpg 100w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_59-Client-Area-Freenom-241x100.jpg 241w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_59-Client-Area-Freenom-1542x640.jpg 1542w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_59-Client-Area-Freenom-640x266.jpg 640w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_59-Client-Area-Freenom-1850x768.jpg 1850w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_59-Client-Area-Freenom-1920x797.jpg 1920w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_05_59-Client-Area-Freenom-scaled.jpg 1600w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/425;\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"541\" data-src=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_06_53-Client-Area-Freenom-1024x541.jpg\" alt=\"\" class=\"wp-image-6314 lazyload\" data-srcset=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_06_53-Client-Area-Freenom-1024x541.jpg 1024w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_06_53-Client-Area-Freenom-300x159.jpg 300w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_06_53-Client-Area-Freenom-768x406.jpg 768w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_06_53-Client-Area-Freenom-1536x812.jpg 1536w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_06_53-Client-Area-Freenom-50x26.jpg 50w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_06_53-Client-Area-Freenom-95x50.jpg 95w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_06_53-Client-Area-Freenom-100x53.jpg 100w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_06_53-Client-Area-Freenom-189x100.jpg 189w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_06_53-Client-Area-Freenom-1211x640.jpg 1211w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_06_53-Client-Area-Freenom-640x338.jpg 640w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_06_53-Client-Area-Freenom-1453x768.jpg 1453w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_06_53-Client-Area-Freenom-1920x1015.jpg 1920w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-15_06_53-Client-Area-Freenom-scaled.jpg 1600w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/541;\" \/><\/figure>\n\n\n\n<p>So we&#8217;re telling the FREENOM server , when the address comes in , send it to another server (<em>or master post office, in this case Cloudflare server<\/em>) where they will sort\/redirect the information to .  So like a CAR number plate, registered at one location,  when someone comes to enquire about it, they redirect them to another place where the numberplate was re- registered. <\/p>\n\n\n\n<p>Now, as per the car, the owner is still the same, GitHub, they have the file that we are calling, but instead of going to the original organization that registered the car, the owner has taken his car to another country, and they now have the records of that car &amp; its owners information. <\/p>\n\n\n\n<h4 class=\"wp-block-heading\">What do we need to do for cloudflare ? Part 2- <span style=\"color:#0693e3\" class=\"color\">Filters<\/span><\/h4>\n\n\n\n<p><em>The Domain Name System<\/em> (<strong><span style=\"color:#cf2e2e\" class=\"color\">DNS)<\/span><\/strong> is the phonebook of the Internet. We have a couple of ways of reaching a specific place and they are  1\/ <strong><span style=\"color:#cf2e2e\" class=\"color\">http:\/\/drax.cf<\/span><\/strong> or 2 \/ <strong><span style=\"color:#cf2e2e\" class=\"color\">http:\/\/www.drax.cf <\/span><\/strong>(though you may only see it in the address bar on your browser as <strong><span style=\"color:#cf2e2e\" class=\"color\">www.drax.cf<\/span><\/strong>. So to mananage the variations we use a filter, that takes in varients , like the above 2 examples and conmverts them into an HTTPS to make them secure. It usesPage Rules to allow varients using<strong><span style=\"color:#cf2e2e\" class=\"color\"> http:\/\/*drax.gq\/*<\/span><\/strong> and says anything with these varients change to an HTTPS secure link. <\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"620\" data-src=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-19_53_59-Page-Rules-_-drax.gq-_-Account-_-Cloudflare-Web-Performance-Security-1-1024x620.jpg\" alt=\"\" class=\"wp-image-6316 lazyload\" data-srcset=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-19_53_59-Page-Rules-_-drax.gq-_-Account-_-Cloudflare-Web-Performance-Security-1-1024x620.jpg 1024w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-19_53_59-Page-Rules-_-drax.gq-_-Account-_-Cloudflare-Web-Performance-Security-1-300x182.jpg 300w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-19_53_59-Page-Rules-_-drax.gq-_-Account-_-Cloudflare-Web-Performance-Security-1-768x465.jpg 768w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-19_53_59-Page-Rules-_-drax.gq-_-Account-_-Cloudflare-Web-Performance-Security-1-1536x930.jpg 1536w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-19_53_59-Page-Rules-_-drax.gq-_-Account-_-Cloudflare-Web-Performance-Security-1-50x30.jpg 50w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-19_53_59-Page-Rules-_-drax.gq-_-Account-_-Cloudflare-Web-Performance-Security-1-83x50.jpg 83w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-19_53_59-Page-Rules-_-drax.gq-_-Account-_-Cloudflare-Web-Performance-Security-1-100x61.jpg 100w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-19_53_59-Page-Rules-_-drax.gq-_-Account-_-Cloudflare-Web-Performance-Security-1-165x100.jpg 165w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-19_53_59-Page-Rules-_-drax.gq-_-Account-_-Cloudflare-Web-Performance-Security-1-1057x640.jpg 1057w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-19_53_59-Page-Rules-_-drax.gq-_-Account-_-Cloudflare-Web-Performance-Security-1-640x388.jpg 640w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-19_53_59-Page-Rules-_-drax.gq-_-Account-_-Cloudflare-Web-Performance-Security-1-1268x768.jpg 1268w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-19-19_53_59-Page-Rules-_-drax.gq-_-Account-_-Cloudflare-Web-Performance-Security-1-scaled.jpg 1600w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/620;\" \/><\/figure>\n\n\n\n<p>On websites such as <strong>http:\/\/drax.gq <\/strong>you can have sub-domains, these can be totally different web pages accesses from a path like <strong>Http:\/\/<span style=\"color:#cf2e2e\" class=\"color\">about<\/span>\/drax.gq<\/strong> which would take you to a totally seperate web page. You could also make a file called about.html and put it in <strong>http:\/\/drax.gq<\/strong>\/about.html but you&#8217;ll see a few sites that use sub-domains to take you to say a members area of the site, or an area where there is a checkout or shop area or blog area on a site, so a discrete sub area of the website. This is aprapos to the <strong>http:\/\/*drax.gq<\/strong> part of that page rule that will allow you to reach these points of the site as well through a secure connection. <\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Finally the webpage <\/h4>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"428\" data-src=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-10_01_04-Mail-1024x428.jpg\" alt=\"\" class=\"wp-image-6318 lazyload\" data-srcset=\"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-10_01_04-Mail-1024x428.jpg 1024w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-10_01_04-Mail-300x125.jpg 300w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-10_01_04-Mail-768x321.jpg 768w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-10_01_04-Mail-1536x641.jpg 1536w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-10_01_04-Mail-2048x855.jpg 2048w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-10_01_04-Mail-50x21.jpg 50w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-10_01_04-Mail-120x50.jpg 120w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-10_01_04-Mail-100x42.jpg 100w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-10_01_04-Mail-239x100.jpg 239w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-10_01_04-Mail-1533x640.jpg 1533w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-10_01_04-Mail-640x267.jpg 640w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-10_01_04-Mail-1839x768.jpg 1839w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-10_01_04-Mail-1920x802.jpg 1920w, https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-10_01_04-Mail-scaled.jpg 1600w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/428;\" \/><\/figure>\n\n\n\n<p>To recap, this is what we have done:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>deploy files to free Github account to a Repository (folder)<\/li><li>allow the folder to be web enabled in Github &amp; get URL link to html website files<\/li><li>create a free FREENOM account to get a free CUSTOM DNS name <\/li><li>Host the DNS name in the Github repository<\/li><li>This DNS is only http:\/\/ so is insecure, to secure it we use cloudflare<\/li><li>Create free cloudflare account that will cache outr websitre around the globe and make it an HTTPS:\/\/ site so secure and data flow encrypted <\/li><\/ul>\n\n\n\n<p>Well done all.  Another video on general hosting:<\/p>\n\n\n\n<figure class=\"wp-block-embed-youtube wp-block-embed is-type-video is-provider-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe title=\"How to get started for free Free Web Services, Domains &amp; Email\" width=\"678\" height=\"381\" data-src=\"https:\/\/www.youtube.com\/embed\/Ze2xas3VUr8?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" class=\"lazyload\" data-load-mode=\"1\"><\/iframe>\n<\/div><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>Use gitgub to host your website is a free service that you can utilise as well as using Freenom to get a free domain name for the site instead of the github domain. To get the Custom domain secure you can use Cloudflare CDN. This is something that occurs when working on your own, you [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":6318,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[449,29],"tags":[],"class_list":["post-6305","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-github","category-web"],"featured_image_src":"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-10_01_04-Mail-scaled.jpg","featured_image_src_square":"https:\/\/max-drake.cc\/wp-content\/uploads\/2020\/05\/2020-05-20-10_01_04-Mail-scaled.jpg","author_info":{"display_name":"Max Drake","author_link":"https:\/\/max-drake.cc\/?author=1"},"_links":{"self":[{"href":"https:\/\/max-drake.cc\/index.php?rest_route=\/wp\/v2\/posts\/6305","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/max-drake.cc\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/max-drake.cc\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/max-drake.cc\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/max-drake.cc\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=6305"}],"version-history":[{"count":0,"href":"https:\/\/max-drake.cc\/index.php?rest_route=\/wp\/v2\/posts\/6305\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/max-drake.cc\/index.php?rest_route=\/wp\/v2\/media\/6318"}],"wp:attachment":[{"href":"https:\/\/max-drake.cc\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=6305"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/max-drake.cc\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=6305"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/max-drake.cc\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=6305"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}