Guten Tag!

Many greetings from Munich, Germany. Last week we talked about creating static files instead of using a shiny app. The advantage of that is that it’s much easier to host these static files.

But of course, this still leaves the question of how to do that. And that’s exactly what we’re going to do today. So let’s talk about:

• How to host static files like HTML files with Netlify

• How to make your life even easier with Quarto using the inbuilt integrations

• How to host your static files under a custom domain like my private “albert-rapp.de” domain

Creating an Account at Netlify

Let’s start out with creating an account at Netlify. It’s free to use and unless you have a lot of traffic, you don’t actually have to pay anything (unless you get a whole lot of traffic or want to use premium features).

Alternatively, you can also use something like GitHub Pages, it’s very similar to set up and use. Here I’m just opting to show you Netlify because this is what I use.

Adding a New Site

Once you’ve registered and logged in, you can add a new site on the overview page.

If you already have the static files, then you would just go on to deploy manually and then just drag and drop all of the HTML files into the window that comes after that. And that’s it. It’s as easy as that to serve your files anywhere.

If you had a Quarto blog (like the one you could easily create using one of my most popular tutorials), then you could take the rendered output directory _site and just drop it in there. Once you do that, you will get assigned a random URL and you can visit your files using that URL.

Using the Inbuilt Quarto Integration for Quarto projects

This drag-and-drop is great for one-off approaches. But for a bigger project like my blog I don’t take the _site directory and manually drag and drop it into Netlify. Instead, I use the inbuilt integration from Quarto. To do so, inside of the RStudio project for my Quarto blog, I just have to type into the console quarto publish.

The dialogues that follow are pretty straight-forward. You just have to click through all of them and then everything will be published for you automatically.

Using a Custom URL

Right now, our project is available through a cryptic link that ends in “netlify.app”. If I wanted to have my content available under a different URL, what I need to do is to go to “Domain management”, click on “Add a domain”, and insert the domain that I want to use.

In this case, I could just call this quarto-test.albert-rapp.de. This is a subdomain of a domain that I own. (Obviously ownership of a domain like that is a prerequisite) Netlify then asks me to add this domain:

Ways to set up DNS

Now, in order for this to work, I need to set up my DNS.

This sounds very technical, but really all you have to know is that this tells anyone that accesses your URL to redirect to that Netlify website (without actually showing users that original cryptic url) It’s basically a rerouting, an alias, if you will. And there are three ways to do DNS:

• A record,

• AAAA record, and

• CNAME.

There are technical nuances, but in principle, they all do the same rerouting. They just differ in the way they set this up. Netlify uses CNAME and when you add you subdomain Netlify tells you what CNAME you need to set in your subdomain:

This means that you have to go to wherever you’ve bought your domain, stick that into the DNS CNAME settings of that subdomain, and then you will just have to wait minutes to hours until the changes all go through. This is how it looks with the domain provider I use:

Enabling HTTPS

Once you have done that, within the HTTPS section, you can enable the automatic generation of encryption certificates. This way, Netlify will take care of all the security for you so that users can just go to your website and don’t get a warning from their browser that this website only uses HTTP and not HTTPS.

And don’t worry if the certificate doesn’t immediately work. It can take a while until the DNS changes go through. So if you’ve set up everything like I’ve described, just wait a few hours and then try again. And with that you’re done. You can now navigate to your custom domain and everything should be there.

So there you have it. That’s how you bring your HTML files on the road. As always, I hope you enjoyed this newsletter. And if you have any questions don’t hesitate to reply to this mail or contact me on LinkedIn.

See you next week,
Albert 👋

Enjoyed this newsletter? Here are other ways I can help you:

• My playlist on YouTube

• Free book: Yet Again - R + Data Science

• Free book: Beautiful tables with {gt}

• Blog posts