How to Create Your Own Free Content Delivery Network (CDN)

Learn how to Create your own free Content Delivery Network (CDN) to host CSS and JavaScript files easily with Cloudinary.


Follow these steps I’ve outlined below to create your own blazing fast CDN.

Image CDN Cloudinary and WordPress.
Image CDN – Cloudinary and WordPress CDN Tutorial.

What is a Content Delivery Network?

A content delivery network, or content distribution network is a geographically distributed network of proxy servers and their data centers.

The goal is to distribute service spatially relative to end-users to provide high availability and high performance.

In other words, CDN’s improve site speed and reduce bandwith on tour server, increasing the performance of your website.


How to setup your own free Cloudinary CDN

Test my newly created link below. Speed Kills.

https://res.cloudinary.com/ux-ui-technologies/raw/upload/v1543467854/omahacode.min.css 

To setup your Content delivery network, you must first create a free account with Cloudinary.

  1. Go to Cloudinary.com.
  2. Sign up for your free account.
  3. Locate your dashboard.
  4. Open your preferred text editor (Atom, Visual Studio Code, Sublime text).
  5. Create a new .css file in your desired text editor (I recommend minifying your CSS).
  6. Navigate to the Media Library tab within Cloudinary.
  7. Upload your new .css file.
  8. Copy the URL of your new .css file (i.e., https://res.cloudinary.com/ux-ui-technologies/raw/upload/v1543467854/omahacode.min.css)
  9. Insert your new CDN url in the top ‘head’ area of your website

Locate your Cloudinary Dashboard

After you’ve created an account, you’ll be able to view your Cloudinary dashboard.

View your Cloudinary Dashboard
View your Cloudinary Dashboard

Upload your files into Cloudinary

Now that you’ve create a new .css or .js file with your favorite text editor, upload the new file into Cloudinary.

Cloudinary Upload Image
Uploading your files into Cloudinary Media

Copy the URL of Your Newly Uploaded File

Now, Select the link icon and copy this to add as a stylesheet.

Copy Media File Cloudinary
Click on the link icon and copy your CDN url

Insert the url within the Section as a Stylesheet

Add the new url as a stylesheet:


Omaha Code Loads in under 2.5 seconds

View how fast OmahaCode.com loads.

Omaha Code Web Page Test Score

Follow Us on Twitter

Cloudinary Media Expert - Neil Humphrey of Omaha

Cloudinary Media Developer Expert

Media Developer Experts will leverage the Cloudinary platform to foster a community of media-management professionals; receive training and certifications to become experts within their field or audience; advance the state of media management, adoption, and best practices; and make the web more accessible.

More Tutorials