Convert your web project to a desktop app with Tauri.
So, you just make a simple website using your favorite framework, and now you want to turn it into an app. You think of Electron, but you know that Electron is heavy and can make your app run like a memory hog. So what are the alternatives?
Well, in this post, I will show you an introduction to an alternative to Electron: Tauri, and how to use it to turn your website into a fully functional app.
What is Tauri?
Tauri is a polyglot and generic system that is very composable and allows engineers to make a wide variety of applications. It is used for building applications for Desktop Computers using a combination of Rust tools and HTML rendered in a Webview. Apps built with Tauri can ship with any number of pieces of an optional JS API / Rust API so that webviews can control the system via message passing.
In short, it's a tool that helps you build an app with web technology using Webview (your OS's web rendering engine).
Note: At the time this post is writing, Tauri is still in beta and only support major desktop platforms (Windows, Mac, Linux).
Setting up the environment
1. Install system dependencies
Install Node.js and
You are likely to have Node.js and
npm already installed on your computer before reading this post. But if you don't, then you can install it from your package manager.
Install Rust and
cargo package manager
To install Rust and
cargo, you can use
In case you are using Linux, then you can install it from your package manager:
To check out if Rust has been installed successfully, run the following command:
Integrate Tauri into your project
Now we have installed Tauri, let's integrate it into our project.
Install the CLI package
We will install its CLI package as a dev dependency:
You can also install it as a global dependency, but it is recommended that you install it locally
If you install the package locally, you will need to add
tauri into your
scripts part in
Initialize Tauri in your project
Run the following command...
...will create a new directory in your working directory, called
src-tauri, it will look like this:
Finally, we will check if everything is set up properly by using command
Which should return something like:
Start development mode
Start your devserver
Start the devserver of your app. This depends on the bundler/framework that you are using.
Start Tauri development window
The time you run this command, it will take several minutes for
cargo to install and compile all the packages that it needed. Since they are all cached, subsequent builds will be much faster since it only needs to rebuild your code.
Once Rust has finished building, the webview will open, and it should show your app. You can make changes to your web app. If your tooling has hot reloading, then the webview will reload just like a browser. When you make changes to the Rust files, they will be rebuilt automatically and your app will restart.
You may run into a problem that requires debugging, for this part, please visit it the App Debugging part from Tauri's official documentation: https://tauri.studio/en/docs/usage/development/debugging
Build your app
Run your build command
Now you are ready to package your app, you will need to run your bundler/framework's build command (if you are using one)
Bundle your app with Tauri
tauri dev, this will take some time for Rust to install packages and build everything. But on subsequent builds, this will be much faster.
When it has done building, the binary will be located at
src-tauri/target/release/[app name], and its installers will be located at
And that's it! You now have learned how to use Tauri to build an app from your web project!
Goodbye and have a nice day! :D