The big question: is it possible to build native apps with Vue.js?
Using Vue.js for hybrid apps is one thing, but can it be used for building native apps? Before answering this question let’s get it straight what are the native and hybrid mobile applications. In simple words, differences between native and hybrid apps are these:
- Native applications are the ones that were built for the specific platform. It means, if you are building a mobile application, it will be written for a specific platform (might be Android, iOS or any other). Usually it is a preferable type of application as it provides the best performance, it is better for users in terms of UX, has a support from application stores.
- Talking about hybrid app, it’s an application that is a mix of native application and web application. It works in different platforms, so if you’ve written an application for the web, it will work perfectly fine in mobile. Yet, it will not be customized for the mobile device specifically and it still will be web application.
If you are interesting in learning more about differences between native and hybrid, I encourage you reading this article.
Now when we know the differences between those, let’s get back to the question. Great news and the answer to this question is that yes, Vue.js does support native applications. You can make a native app with Vue pretty easily, however hybrid applications are also possible to build with Vue. keep reading to find out what are the Vue.js frameworks that can help developing a mobile app. Spoiler alert: there are many of them.
Best Vue.js mobile frameworks
There are different frameworks for the development of mobile applications. Some of them provides you all the tooling and needed possibilities for developing mobile applications, while some of them are just UI libraries that helps you make a good looking mobile application with Vue. Let’s get started from the Vue frameworks that lets building native apps, Here are the most popular Vue.js mobile frameworks for the development of native applications:
What are the main advantages of the framework:
- As the NativeScript is independent to Vue, in case you will want to rewrite your application that was written with Vue.js, for example, with Angular, it will be possible to do so. Although, it will take some time to rewrite the Vue.js specific part, but as the core of your app will be around the NativeScript, it will not hurt that much.
So if you are confident you want to try NativeScript, a convenient way would be by using the nativescript-vue plugin.
Vue-native is another great option when choosing a framework for building mobile apps with Vue. Secret with this, that it compiles to React Native, and it looks very familiar to React Native. And as currently, React Native is doing great and is one of the most loved frameworks for native mobile development. If you have experience building native apps with React, you will probably have no difficulties figuring this framework out. Framework has over 7.2k GitHub stars.
And if we are heading to the advantages, we should also include React Native benefits, as the Vue-Native is only a wrapper around React Native:
- Framework is a wrapper around React Native – a mature and popular framework for developing mobile applications. What does that mean? A combo of two great ecosystems – Vue and React.
- This one is true about Vue in general, but the framework focuses on the view layer
- Highly adaptive and lightweight solution
Another tool that might be used for Vue mobile development, is Vux. It provides mobile UI components based on Vue and WeUI. Probably the name is not very familiar to you. Contrary to NativeScript or Vue-native, Vux is not being talked about that much. The main reason for this is that it’s documentation is mostly in Chinese, so unless you know the language or have a friend who can help you, it will take you some time to master this. But as the code is not in Chinese, figuring out the documentation might not be the misison impossible. And it might even be worht it – Vux is being used pretty actively and it has over 17k stars on GitHub. English documentation is under the way, so let’s hope soon we will be able to refer to the English documentation.
Vum is UI framework for building mobile applications. According to to the developers, Vum takes the style for different framework components, from frameworks such as Framework7, WeUI, MSUi, Light7, Ratchet and vue-strap. If you are searching for a UI mobile framework for Vue, it’s another option that you might want to consider. The documentation is in English and looks poorly translated also has some spelling mistakes, but overall, it’s pretty understandable. It has over 1.6k stars on GitHub.
Quasar is a powerful Vue.js framework that allows you not only building hybrid mobile applications, but a lot more. It helps you to ship Electron apps, responsive websites, mobile apps that uses the same codebase. The framework uses Cordova for Android and iOS hybrid applications, so it’s a much richier solution that Cordova. Applications for a lot of different platforms could be created with this. Quasar has more than 14.6k GitHub stars.
Some of the reasons why Quasar is a great option for building your next mobile app with Vue:
- Extensive and rich documentation, helping to create a codebase for different platforms.
- Provides a great performance.
- Framework is a perfect choice for building different types of applications: SPA (single page application), SSR (server-side rendered application), PWA (proggressive web application), browser extensions, mobile applications, Electron multi-platform desktop applications.
- Uses material design for building the UI.
Onsen UI is a framework for building hybrid Vue.js applications. In fact, not only Vue might be used – it supports React, Angular and Vue. The framework provides a range of UI elements that will help you developing clean and simple app. Different design guidelines can be used for creating a good looking application on Android or iOS platforms. Framework has over 8k stars on GitHub.
Framework7 is another powerful framework that might fulfill the needs of building mobile apps with Vue. It has a plethora of needed UI components that helps to create web or progressive web applications. As the ecosystem of Framework7 is huge, it also has Vue.js components and works pretty well with Vue. However, keep in mind that the framework will not provide native mobile applications. Instead of it, PWA (progressive web applications) can be built with it. So, if your needs are to build native apps specifically, this might not be the best option. Currently, more than 15k of developers stared Framework7 on GitHub.
What are the advantages of using Vue.js for building mobile applications?
- The biggest reason you should use Vue.js for developing mobile applications, is that you won’t need to learn another language and framework. Of course, this might become a disadvantage in some cases: if you are trying to improve as a developer, learning what other choices are there and how do they work, will help you to grow. However, if everything you want is to build an app as fast as it possible without too much of a headache, Vue.js will do the work.
- Vue.js is a lightweight and fast solution. In the same time, it is progressive and is not some kind of a chunky and heavy framework that is suited for enterprises. Anyway, if you are familiar with Vue.js then it is a great choice for building your next mobile app. Especially when the installation of the Vue.js native frameworks is so simple.
Should I really start developing a mobile application with Vue.js?
That’s completely up to you. You should consider your reasons. You might have a specific need, for example, you are a doing client work and your client asked to make his website that is suitable for mobile. However, if you are considering building an mobile app with Vue as your personal project, or you are trying to guess the future and thinking of learning a handy skill of native mobile applications development so that you could earn living from this, I really encourage you doing so.
According to the statistics, mobile users will keep going in pretty rapid pace (Source: Statista)
From the current trend and speed of growth, we can speculate that the hybrid mobile applications will thrive in the future (of course, and nowadays this niche is doing well).
Now when we had reviewed the best Vue.js frameworks for mobile, it’s your choice to use whatever framework you like. As there is Vue.js used for all of them, the learning curve would not be that steep (if you are fluent in Vue.js). And finally, don’t forget that these are just tools, no matter which one you will choose, if you have a specific goal, most of them can be used for doing the job. But of course, one frameworks are more specialized in solving specific cases, than others.