How to setup a CDN on a website (In under 5 minutes!)
Articles,  Blog

How to setup a CDN on a website (In under 5 minutes!)


Hi it’s James here, Founder of CDNify. In this video I’m going to show you how you can implement a CDN onto your website in under five minutes. Now we have a basic site here: Birdsong.fm, and if we look in the source code you’ll
see there are numerous Javascript CSS and images, we’ll call these ‘assets’. So our assests are currently loaded from our website host which means that they are gonna load slower then if we hosted them on a CDN. We’ll cover how to easily implement a CDN to speed everything up. Firstly we’ll need to log in to CDNify, creating an account if we haven’t got one
creating accounts we haven’t got one already. Then we’ll click on ‘add a new resource’, the dashboard shows because our account is currently new and it hasn’t got any existing resources
resources the CDN host name will be the name of
our resource this is a user friendly URL where the assets will be loaded from, in
this case I’m gonna use CDN.birdsong.fm. The origin URL is normally all existing
site, the server that the files have been uploaded to which in this case is
birdsong.fm. The CDN will then mirror the content from this existing site
from this existing sites finally we can choose whether or not we
want SSL support, in this case we don’t require SSL so we’ll leave that option
disabled. We then can click and create the new CDN resource on our account that will create it in a few seconds. It’s important to note that it can take up to
fifteen minutes for this new resource to start functioning correctly, whilst it’s provisioned across all of our network we’ll now click on ‘manage’, you’ll notice this currently is empty but it will begin populating with statistics
once we start using the CDN on our website. I’d like to draw your attention to the
resource detail, here we can see the host name we just choose and also the cName, this is the actual resource host name on
our platform. You can use the raw host name if you
like but we’re going to create a pointer for our CDN.birdsong.fm domain in this tutorial. Finally what we’re going to do is we’re going to copy the cName record to our clip board because we’ll need that in a minute. Now we’ll head onto our web hosting account
so we can edit the DNS for our domain, this is a similar procedure across most web hosts and registrars. We have a selection of specific DNS editing tutorials available covering most common providers. So let’s go ahead and editor our DNS zone,
n_s_a_ then we’ll scroll down and we’ll click ‘add a record’.
record The type of record should be set to CNAME. The record name in this case is CDN.birdsong.fm and so we’ll set this here. And finally the value of our record is
the CNAME in which we just copied to our clipboard so we’ll paste this in here and we can go ahead and click on save. Now the DNS has been updated for our domain so now CDN.birdsong.fm will point to a unique CDN host name. It’s important to note that sometimes
CNS changes may take awhile to start working on all computers, so please be patient if it doesn’t work instantly!
instantly The last step of the processes is to edit our website code. I’ve got the home page here in my HTML editor and we’re going to update all of the assets to point to the CDN with a single click. The file names and structure of our
files will remain exactly the same all the CDN will do is mirror what is on our web
server and cash it in multiple locations around
the world. The content is then served to users from the nearest geographic location thus making your website load lightning
fast. To do this we’re going to use find and replace, we’ll then find assets and simply pre pend our CDN host name that we just created so we’ll replace it with HTTP:// CDN. birdsong.fm/assets and then click
replace and hey presto all of the links have been updated. Finally we can upload our updated HTML back on to the web server. Now if we go back into our source in
chrome and refresh this we can see the URLs for our assets now
point to the CDN, and if we click on a file such as jQuery
we can see that it loads the JavaScript. All this is doing is mirroring, or pulling, the jQuery file it is already on our server storing it on the CDN, this will reduce the number hits to your web server significantly and speed up load times for your website visitors!

4 Comments

  • Mario Callejas

    I tried to setup an account and got an JSON error from your site! "Customer not found" when trying to input my card info

  • Hasan Raza

    Very good tutorial, I also found a similar blog post tutorial on: https://www.cloudways.com/blog/add-cdn-to-drupal/ I hope people will find it useful.

  • robs stevejobs

    Hi sir, you can help me find this server to distribute the updates in my website. here is the link I found: updates-http.cdn-apple.com/2019SpringFCS/fullrestores/041-68314/CC3C4D6, in other site when I try to download it outside the iTunes

Leave a Reply

Your email address will not be published. Required fields are marked *