DEV Community

Red
Red

Posted on • Originally published at redthemers.tech

Getting Started with ionic in Angular

Intro
Ionic is one of the leading frameworks for hybrid app development. That means to have one code base for all mobile, Desktop app & web. One can create an app using javascript frameworks like angular,react & vue. Though in this article we will be creating an ionic app using angular. Let's get started.

Prerequisites
Basic understanding of node & npm
Had built at least hello world app in angular
At least know what Android studio is

Installations
First let's install all the required tools/software

VS code editor you can install it from - vs code download

Command line -

Linux - the default terminal is more than enough
Windows - recommended windows powershell or the default terminal

See how to add env to use in terminal

Install node & npm

For linux perform the following operation -

curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash -
Enter fullscreen mode Exit fullscreen mode
sudo apt install nodejs
Enter fullscreen mode Exit fullscreen mode

Use
node --version &
npm --version
to check if it's installed correctly.
For windows please refer - nodejs for Windows

After you had installed the above stuff now run the following command in terminal to install ionic tooling

npm install -g @ionic/cli native-run cordova-res
Enter fullscreen mode Exit fullscreen mode

Run ionic --version to check if its installed correctly
Running the app
Now we create a simple ionic app with these simple commands

ionic start myIonicapp tabs --type=angular --capacitor
cd myIonicapp
Npm i
ionic serve
Enter fullscreen mode Exit fullscreen mode

That's it, now your test application should be running on localhost 8100 or as mentioned in the terminal.

Top comments (0)