DEV Community

Mike S.
Mike S.

Posted on

My first steps with trying to learn app development on Tauri

Recently I've been trying to find a lightweight alternative to Electron for app development using web technologies. I wanted to avoid using Electron because it consumes a MASSIVE amount of memory and binaries are also huge, even for small and simple applications. My search has let me to find two options that I think can get the job done: Tauri and Neutralino.

In this post, I'll cover how I got started with Tauri and possibly Neutralino in a different post.

For right now, I'll be using Tauri because there appears to be a native plugin for Vue and I've also been wanting an excuse to learn a little Rust.

Here's what I did to get up and running on a Windows machine (Tauri + Vue 3):

  1. Follow the initial instructions here to download all the required core software dependencies. As a summary, you'll need to download and install 4 dependencies:
    • Microsoft Visual Studio 2017 C++ build tools
    • Node.js (I used v14.17.x)
    • Rust & the Cargo package manager
    • WebView2
  2. There are a few other dependencies to install:
    • Install Yarn: npm install --global yarn
    • Install the Vue CLI: yarn global add @vue/cli
  3. Now we start to build our project!
    • Start a new Vue project and select Vue 3 to be your default preset: vue create app1
    • change directory in to app1
    • Install the Tauri plugin for Vue CLI: vue add tauri
  4. Run your app for the first time!
    • yarn tauri:serve
    • please note that you may need to wait a while, this time, before you can see the Tauri app window. This is because a lot of things need to be downloaded and compiled. But future runs should be much quicker.

From here I'll make some other small updates on the following Tauri topics as soon as I learn how to do these things (yes, I'm just sharing what I've learned along the way):

  • How to make a custom CLI with Tauri
  • How to make wire custom functions in Rust to javascript and Vue.
    • I'm told that this is referred to by Tauri as "custom commands"
  • Maybe how to add some components developed using WASM

Image of Datadog

Create and maintain end-to-end frontend tests

Learn best practices on creating frontend tests, testing on-premise apps, integrating tests into your CI/CD pipeline, and using Datadog’s testing tunnel.

Download The Guide

Top comments (0)

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay