DEV Community

Cover image for Building a Desktop App with Vue: Vuido

Building a Desktop App with Vue: Vuido

Natalia Tepluhina on September 03, 2018

Update: Building Vue desktop app with Electron I love Vue. It's a great framework allowing you to build awesome web applications. But the real ma...
Collapse
 
ismaelamezcua profile image
Ismael Amezcua •

Superb introduction to Vuido. Just a heads up, if your are copy/pasting the code into your application, there is a missing } on the following line:

axios
  .get(
    `/weather?q=${this.query&units=metric&&appid=<YOUR_API_KEY>`,
   )

It should be

axios
  .get(
    `/weather?q=${this.query}&units=metric&&appid=<YOUR_API_KEY>`,
   )

You could also declare a variable for your API key so it would be easier to import from env variables:

const apiKey = process.env.API_KEY;

axios
  .get(
    `/weather?q=${this.query}&units=metric&&appid=${apiKey}`,
   )
Collapse
 
n_tepluhina profile image
Natalia Tepluhina •

Thanks for spotting this and for the advice! Fixed ;)

Collapse
 
yunseopkim profile image
yunseop kim •

Thank you for this article. If possible, I would like to translate this article and share it with Korean developers, can I translate it?

Collapse
 
n_tepluhina profile image
Natalia Tepluhina •

Sure, would be happy to see it translated!

Collapse
 
yunseopkim profile image
yunseop kim • • Edited

this is the korean translation! :D

Many korean developers like this article!

devtimothy.tistory.com/91

Thread Thread
 
n_tepluhina profile image
Natalia Tepluhina •

Awesome! Thank you for you work on this translation =)

Collapse
 
danieljsummers profile image
Daniel J. Summers •

Nice writeup! I think your executable is probably bigger because of the Axios library also being included.

Collapse
 
n_tepluhina profile image
Natalia Tepluhina •

Yes, probably without dependencies it'd be around 20Mb indeed :)

Collapse
 
michalmecinski profile image
Michał Męciński •

The Linux and Mac packages are actually bigger, but the Windows 32-bit version is around 20 MB ;)

Thread Thread
 
n_tepluhina profile image
Natalia Tepluhina •

Hi Michal! First of all I want to thank you for your work on Vuido and LaunchUI! Awesome projects and awesome documentation!

Indeed, just checked and Windows 32-bit package is 22.4 Mb (probably a bit more for Axios, as mentioned in comments)

Thread Thread
 
michalmecinski profile image
Michał Męciński •

And I thank you very much for writing this great article :)

Collapse
 
jodyshop profile image
Waleed Barakat •

Awesome! I think Vue with be the next big thing :)

Collapse
 
n_tepluhina profile image
Natalia Tepluhina •

Really hope so :)

Collapse
 
jodyshop profile image
Waleed Barakat •

It will be! too many big tech companies use it worldwide!

Collapse
 
gergelypolonkai profile image
Gergely Polonkai •

This is a really good article, with one thing off: Electron apps are not desktop apps. Please stop suggesting that.

Electron is a huge resource hog. Running three of them easily eats up all my 8GB of memory. It’s not a solution, but a problem. If you want desktop apps, write desktop apps.

Collapse
 
thejaredwilcurt profile image
The Jared Wilcurt •

Alternatively, you can use NW.js. It's all the same features as Electron, but uses much less resources. If lower resources are your highest priority though, then go with LibUI-Node/Vuido.

Collapse
 
n_tepluhina profile image
Natalia Tepluhina •

Well, this is a good point to look at while building an Electron app ;)

Collapse
 
thejaredwilcurt profile image
The Jared Wilcurt •

You've left out NW.js, which has great Vue support. There is nw-vue-devtools, which unlike Electron is always the latest most up-to-date version of Vue's dev tools. There is Vue-Desktop-Basic, NWjs-Vue, NW-Skeleton, and Vue-NW-Seed for boilerplates. NO ONE should be using Electron. With that sad, glad to see Vuido/LibUI-Node getting some attention.

Collapse
 
n_tepluhina profile image
Natalia Tepluhina •

Thank you! Will look into it

Collapse
 
kurisutofu profile image
kurisutofu •

I was just wondering if it was possible to use Vue with Electron so I'm looking forward to the next article!

Collapse
 
n_tepluhina profile image
Natalia Tepluhina •

Yes, it's definitely possible! Will publish it soon

Collapse
 
cynthiablue profile image
cynthiablue •

I am brands new to Vue and am thinking of starting a project for a desktop application using Vue. I also like Quasar and I'm wondering, if I start the project using Vuido will I be able to add Quasar on as well? Thanks.

Collapse
 
jenlooper profile image
Jen Looper •

Really interesting article! Now I'm wondering what I want to build with Vuido!

Collapse
 
n_tepluhina profile image
Natalia Tepluhina •

Thank you! Yeah it's still very new but already looks nice

Collapse
 
ckissi profile image
Csaba Kissi •

I wonder if it supports menubar apps on mac/win. Anybody?

Collapse
 
dbelyaeff profile image
Dmitriy Belyaev •

It's nice but without an ability to customize interface it's not so good as it could be.

Collapse
 
thomas_ph35 profile image
Thomas •

I've made the exact same thing using, Native-Script vue (on IOS and Android) !
Seems like OpenWeatherMap is a good start for a first app.

Collapse
 
n_tepluhina profile image
Natalia Tepluhina •

Props for using nativescript-vue! Awesome choice for native mobile apps ;)
Yeah I like OpenWeatherMap API, very nice and clear :)

Collapse
 
superdiana profile image
Super Diana •

Natalia this is brilliant! thank you so much! - looking forward to the electron version!!

Collapse
 
n_tepluhina profile image
Natalia Tepluhina •

Thanks Diana! You know I will do it soon =)