How To: Host an external repository in Webflow for free.

If you've ever tried to include a lot of JS or CSS code in Webflow I'm sure you've come across the sign indicating the character limit.

In general, Webflow is very good at saving us the need to use code (welcome to the no-code revolution!) But there are times that we still have to write or use an external library.

How can we host these libraries without having to buy a separate hosting for them?

There is a very simple solution: jsDelivr.

Basically jsDelivr allows us to convert any of our GitHub repos into a CDN that we can use in any of our projects.
This means that we can use GitHub as the host of our libraries (they can be ours or third parties) and include them in our Webflow project in a super simple way.

The task is divided into two parts.

On the one hand, the base URL of jsDelivr which is and will always be:
https://cdn.jsdelivr.net/gh/

Later you will have to add the Username and the Name of the GitHub Repo to the URL above.

The final URL will look like this:
https://cdn.jsdelivr.net/gh/{username}/{repo name}/{path to file}

‍

For the purpose of this tutorial what we are going to do is grab the username, the name of the repo, and put them in the URL that we have above

Suppose we want to include the typed.js library to our project and for this demo we are not going to do it in the simplest way there is.

Simplest Way:
<script src="https://cdn.jsdelivr.net/npm/typed.js@2.0.11"></script>