This blog post starts my journey towards mastering NativeScript Vue. Little is written about NativeScript Vue because it is relatively new as compared to its sibling NativeScript Angular. Here, you will find tips, tutorials and lessons on learning this very interesting piece of coding tech.
What got me interested in NativeScript Vue was learning Vue.js itself. I found Vue easy to understand and after some curiosity in building hybrid mobile apps, I found NativeScript Vue that allowed for building truly native mobile apps rather than just packing web code in web view.
Prerequisites
You will need to install node.js on your system first. You can do that by downloading NodeJs from the NodeJs website: https://nodejs.org/en/download/
Or, you can install NodeJs using Node Version Manager like I did. The benefits of using NVM is that you can easily switch between different NodeJs versions through command line.
I’ll be listing the steps for macOS. For Windows instructions, please follow the steps here: https://docs.antora.org/antora/2.2/install/windows-requirements/
To install NVM, run this command from either your terminal prompt. Make sure you have cURL enabled on your machine:
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.0/install.sh | bash
Check NVM version to make sure it installed correctly:
nvm --version
To install Node via NVM. Enter this in your terminal:
nvm install node
Use Node:
nvm use node
Install Homebrew
Let’s install Homebrew first. Homebrew will make installing NS easier:
ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
Update Brew:
brew update
Install NodeJs LTS 10.x
brew install node@10
Install Xcode essentials
You may be prompted to install Xcode Command Line Tools. Run this command to verify installation:
xcodebuild -version
Enter these commands in order:
1.
sudo gem install xcodeproj
2.
pod setup
3.
sudo easy_install pip
4.
pip install six
Android essentials
Setup JDK:
brew tap AdoptOpenJDK/openjdk
You have to set the Android HOME variable path for your machine. To do so, type this in terminal:
export JAVA_HOME=$(/usr/libexec/java_home -v 1.8)
Install Android SDK:
brew cask install android-sdk
Set the Android HOME variable again:
export ANDROID_HOME=/usr/local/share/android-sdk
Install Android Studio
In order to get the simulator to work, you need to install Android Studio. Without this, you won’t be able to run virtual devices on your machine. You can download it from here: https://developer.android.com/studio
Install NativeScript
To install NativeScript, enter this command:
npm install -g nativescript
A handy way of making sure your installation is all complete, is to use this command on the terminal:
tns doctor
If your machine is correctly configured, you should see:
No issues were detected
Closing
These are the steps you have to go through on a Mac to install Xcode, Android and NativeScript. I’ll be documenting my journey in using NativeScript Vue. Again, there’s not much documented about NativeScript Vue and I intend to do that.