Turn Any Webflow Website Into a Desktop App

Ever wondered how difficult it is to build a no-code desktop app? Well wonder no further, as it's 1000x easier than you might think.

The process that we are going to use to turn a Webflow website into a desktop app can be done in less than 5 minutes, and can also be used for a bubble.io website, or any other no-code website that you might want to turn into a desktop app.

Here's what the end product looks like using the dawn-dashboard.webflow.io Webflow website. Not too shabby at all.

Since there is only a couple of small steps we need to do, let's jump right in.

1. Install Node.js

Firstly, if you don't already have Node.js installed, you will want to do that first.

You can find a download at https://nodejs.org/en/. Download using the left button, "Recommended for most users".

Once it's downloaded, quickly go through the installation process and it will be up and running! It won't be a physical app, so don't worry when you can find it anywhere.

2. Install Nativefier

With Node installed, we're now going to install the converter that we will use to convert our website into an app.

To do this we're going to use Nativefier, and you can find all the Nativefier documentation on their Github: https://github.com/nativefier/nativefier. We won't need to use this link for now as we will be installing Nativefier through our computer terminal.

Open up any terminal app (I'm using Hyper), and use this command to install Nativefier.

npm install -g nativefier

It will then work through the installation process.

If you run into any errors or permission issues, feel free to quickly Google the issue and you will likely find what's going wrong. If it's a permission issue, you can type "sudo !!" to change your permission to be universal and re-run the command.

Now that we have Nativefier installed, all we have left to do is convert our website.

3. Turn your Webflow website into an app

To convert the website, all you need to do is copy the URL of the website you want to use, and type nativefier "www.website.com" in terminal. For example, in this case I'm going to use nativefier "dawn-dashboard.webflow.io"to convert my website.

Once it converts, it's going to spit out a folder with your website desktop app in it. To make the folder output onto my desktop, I changed directory in the terminal using cd Desktop.

If you want to override the name of the app, instead use this command when converting the website:

nativefier —name 'Dawn' 'dawn-dashboard.webflow.io'

By doing this we are telling the name of the app to output as "Dawn".

And that's it, double click your app and see how it looks!

Since we can use this process on any website, we could even turn Webflow itself into a desktop app. All we need to do is type nativefier "https://webflow.com/dashboard" into the terminal and it's good to go as a working desktop app.

And that's it, you can now convert any website you want into a working desktop app!

Since you've saved so much time from not having to code a desktop app from scratch, why not go make some brownies?

‍