Best Online Asset Storage for Webflow 2023

Sometimes you just need files to be stored outside of Webflow, wether that be because Webflow don’t support the file type or you need extra JavaScript characters. Here’s my top recommendations.

Serve Images in Next Gen Format: https://youtu.be/D4Z-QVyH26U

Transcript

Hello and welcome to another episode of WebFlow and Code where I teach you the underlying code, you’re writing in WebFlow.

Today, we’re gonna be talking about my top recommendations for online cloud storage.

Now, there might be a number of different reasons why you want online cloud storage, namely to store maybe external javascript files.

Because as you might know, Webflow sets a limit on the number of characters you can write in embed elements, but there could be other things like fonts or images or anything you want really that you can’t use Webflow asset management for.

And this tees me up for an episode I’ve got ready for you guys coming in the near future, so stay tuned for that.

What You Need Out Of Cloud Storage

So really there are two main aspects to cloud storage. Firstly, obviously the actual storage of the assets themselves. But secondly, you want a CDN to serve those assets closer to the user and it caches those assets in that area.

I’ve seen chatter of people using GIT hub to store their assets and the issue with that is that it’s not got a CDN in front of it. So it’s not caching the assets and you’re putting undue pressure on git hub servers so they could block that IP or do something with it so really you want that CDN in front of the server.

Things to Consider

This list compiles itself of services that both host and use a CDN but it also has a very clear and manageable pricing.

Structure pricing kind of sits in two ways either per the amount of storage you use or a fixed monthly fee, which you’ll get basically an amount of bandwidth.

So it really comes down to really how much do you intend on people accessing that those files?

So if, if there’s a lot of bandwidth being used, but you only need a few assets, then it probably go for the option of paying per gigabyte of storage whereas if you know, you need tons and tons and tons of gigabytes but not a lot of traffic, you might go for the 60 month fee.

Now, I don’t think I’ve seen in this list anything less than $5 a month but again, I think you get a UX experience, you get a cleaner experience and it’s just sort of more catered towards our sort of needs and like I say, they provide that CDN.

AWS

Now my first recommendation and we’ve kind of gone over this in the past with my webp before Webflow supported webP It was AWS.

Now, the AWS has a service called S3 and admittedly Amazon and all their services has the most awful, awful UX going basically and it really is a very, very cheap way to do it.

The good thing about AWS S3 is that actually charge you for the amount of gigabytes will use and again, I’ll put on the screen now, the price per gigabyte and it really is nothing. You know, I’d be surprised if you push any more than a few megabytes really, but it really comes down to how much you use.

So it’s, it really is the most kind of flexible.

Google Cloud

So in the same ways, Google Cloud also have their own services.

Now, I will admit I have not had any experience using Google Cloud’s sort of s three equivalent, but I can imagine given their the two kind of competing companies here that they’re very, very much in similar in price and functionality and all the rest of it.

Firebase

So I’ve actually just taken a quick look at Google Firebase and actually, that’s a really good viable option.

Instead of going through the configuration of Google Cloud and Google Cloud CDN, I would take a look at Firebase, the storage option that they have there because again, you just upload your assets, you get a URL that you can access from that thing.

There’s a bit of configuration around a lot, read but not write but it’s a really non techie way and I think it basically uses the same prices setting up manually.

I probably recommend Firebase over AWS if you don’t want to get too much into the techie stuff (and I’ll encourage you to explore it at the very least) there are other services that make it really digestible in the kind of you pay a monthly fee and you just get online storage of your assets.

Digital Ocean Spaces

With that being said, the first option is Digital Ocean Spaces.

Now, the good thing about Digital Ocean spaces that it actually comes with a CDN, unlike Google and Aws where you need to add a CDN.

This one is very simple to add under the hood they are using AWS, so they’re probably using S3 and I think this is a great option because $5 a month and again, it’s a very, very simple you are to use when it comes to uploading your assets.

So that, that comes in the second suggestion.

Vultr

Vultr spelt V U L T R is another one of my recommendations again, is $5 a month fee, is the same sort of stuff really. It comes down to your preference when it comes to the UI kind of how easy it is to use.

But ultimately you upload your assets and your given https, you are aware, you’re able to access that asset.

Cloudinary

And finally, just before we wrap up and get into using some of these tools, I just wanted to cover Cloudinary.

Now again, I’m going to be totally honest and I haven’t actually used clouded area, but it’s been on my radar for quite a while.

Cloudinary is great because it’s a service that stores your, I think it’s just image and video assets.

I’m not too sure, at least image assets for certain.

And what’s great about it is that in the URL you can pass query parameters which you can dictate like the size of it, the image compression, the file format and various things like that. It’s super, super flexible.

But one of the reasons why I haven’t used it is just because it’s so damn expensive.

So I would strongly recommend giving Cloudinary shot and if I get a chance I’ll add some B-roll of me maybe using it or playing around with it but Cloudinary for image assets is actually a really viable solution, I think.

Using the S3

So, using S3 is pretty simple. If you search S3 inside of the search panel up here you go through to what’s known as buckets, And you’re gonna want to create a new bucket, you can give this, it needs to be unique, but I would recommend giving it the domain name of your your website.

So it would be my domain dot com, whatever, that’s probably already taken.

So we’re just gonna put some random numbers here.

You want to select your region and again, because it’s going to be served from a CDN, it really doesn’t matter too much.

This can be all left the same and you’ll see here, it’s got block all public assets access.

So we don’t actually want to do that.

We want to take that and it warns us that this will be public and that is all fine.

Versioning is fine managed key.

This is all fine.

It’s just double check here.

Object like that seems just fine to me.

So I create my bucket and go into my bucket.

And it’s just a case of now if I get a CSS file, CSS, we can upload that and then we can open this and you can see there’s my CSS far available on if we paste that https.

Using the Digital Ocean

So jumping into Digital Ocean now on the side here, you’ll see spaces and create space bucket.

Now again, it’s all on S3 so we get all of these Amazon S3 stuff content delivery network.

We absolutely want that finalizing, create, choosing my domain.

So there we go.

There’s, there’s that $5 a month once again, were able just to upload CSS files and copy.

Okay.

Probably because I had “dot com” in the actual name of the bucket there so it’s just causing some problems but yeah, I hope that was helpful to have a look at some of the links below.

There might be some credits available for you to try out these services and see what works for you.