If you’re a web developer looking to create cross-platform mobile apps, then you should check out the Ionic Framework. Ionic Framework is used by over 4 million developers worldwide, making it the fastest-growing app development framework on the market. This open-source development platform allows you to create apps with HTML, CSS, and JavaScript, which can then be deployed on iOS, Android, and Windows Phone devices.
In this article, we’ll show you how to install the Ionic Framework on Ubuntu 22.04 using Node.js and NPM. Let’s get started!
Step 1 – Installing Node.js
Node.js is the primary requirement for running Angular applications. You can install the required Node.js using NVM command-line utility. Log in to your Ubuntu system and follow:
- Use the following command to install NVM:
curl https://raw.githubusercontent.com/creationix/nvm/master/install.sh | bash
- Now activate the NVM enviornemnt on your system.
source ~/.bashrc
- As of today, Angular 14 is the latest version that suport Node.js 14 LTS and 16 LTS versions. Following command will install Node.js 16 on your system.
nvm install v16
Step 2 – Install Ionic Framework on Ubuntu
Next, you need to install the Ionic node module on your system. Ionic provides and commands line utility for creating packages, building, and starting applications.
npm install cordova --location=global
Run the below NPM command to install the Ionic framework on your system.
npm install @ionic/cli --location=global
After completing the installation of the Ionic framework, use the following command to check the installed version.
ionic -v
6.20.1
Step 3 – Create Ionic Application
Now, You can create a new Ionic application on your Ubuntu system using the starter templates.
- Use the following command to view available starter templates
ionic start --list
- Select a template as per your requirements and create a new Ionic application. You can also choose a blank template to start:
ionic start myApp my-first-app
Here myApp is the name of the new applicaiton and my-first-app is the starter template name.
OutputYour Ionic app is ready! Follow these next steps: - Go to your cloned project: cd ./myApp - Run ionic serve within the app directory to see your app in the browser - Run ionic capacitor add to add a native iOS or Android project using Capacitor - Generate your app icon and splash screens using cordova-res --skip-config --copy - Explore the Ionic docs for components, tutorials, and more: https://ion.link/docs - Building an enterprise app? Ionic has Enterprise Support and Features: https://ion.link/enterprise-edition - Now, run the below command to serve the Ionic application.
cd ionic-app
ionic serve
This will start the Ionic application on port 8100. You can access your ionic application in a web browser using the localhost or system IP address.
Running Ionic Application on Ubuntu - You can also define the host and port while running the Ionic application as below:
ionic serve --host 0.0.0.0 --port 3005
For more details visit http://ionicframework.com/docs/guide/installation.html
Conclusion
In this tutorial, you have learned to install the Ionic framework CLI on the Ubuntu system. Also, provide you with instructions to create and run a new Ionic application.