How to Install Ionic Framework on Debian 10

Ionic is a free and open-source framework for building high-quality, cross-platform native and web apps. It comes with a powerful command-line interface that helps you to create a project from a simple command. Ionic supports Android, IOS, and the Universal Windows Platform for developing apps. Ionic uses Cardova plugins to access Camera, GPS and Flashlight.

In this post, we will show you how to install Ionic Mobile App Framework on Debian 10 server.

Prerequisites

• A server running Debian 10.
• A root password is configured on the server.

Getting Started

First, update the system packages to the updated version by running the following command:

apt-get update -y

Once all the packages are updated, you can install other required packages with the following command.

apt-get install curl gnupg2 wget -y

Install Node.js

Next, you will need to install Node.js to your system. By default, the latest version of Node.js is not included in the Debian repository. So you will need to add the Node source repository to your system.

You can add the Node source repository with the following command:

curl -sL https://deb.nodesource.com/setup_14.x | bash -

Once the repository is added, install the Node.js with the following command:

apt-get install nodejs -y

After installing Node.js, verify the Node.js version with the following command:

node --version

You should see the following output:

v14.17.1

Next, you also need to install Cordova to your system. You can install it with the following command:

npm install -g cordova

Once installed, you can proceed to the next step.

Install Ionic Framework

First, you will need to install an ionic CLI utility to your server. You can install it with the following command:

npm i -g @ionic/cli

After installing ionic, verify the ionic version with the following command:

ionic -v

You should get the following output:

6.16.3

Create a Project with Ionic

Now, you can create your first project with the following command:

ionic start

You will be asked to select the framework between React or Angular, specify your project name, and select a template as shown below:

Pick a framework! ????

Please select the JavaScript framework to use for your new app. To bypass this prompt next time, supply a value for the
--type option.

? Framework: Angular

Every great app needs a name! ????

Please enter the full name of your app. You can change this at any time. To bypass this prompt next time, supply name,
the first argument to ionic start.

? Project name: myapp

Let's pick the perfect starter template! ????

Starter templates are ready-to-go Ionic apps that come packed with everything you need to build your app. To bypass this
prompt next time, supply template, the second argument to ionic start.

? Starter template: tabs
? Preparing directory ./myapp in 3.69ms
? Downloading and extracting tabs starter in 591.18ms
? Integrate your new app with Capacitor to target native iOS and Android? No

Your Ionic app is ready! Follow these next steps:

- Go to your new 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

Start the Application

Now, change the directory to your project and start the application with the following command:

cd myapp

ionic serve --host 0.0.0.0 --port 8100,/p>

You should get the following output:

> ng run app:serve --host=0.0.0.0 --port=8100
[INFO] Development server running!
       
       Local: http://localhost:8100
       External: http://216.98.11.73:8100
       
       Use Ctrl C to quit this process

[INFO] Browser window opened to http://localhost:8100!

Now, open your web browser and access your application using the URL http://your-server-ip:8100. You should see your ionic application on the following screen:

<img alt="Ioniq test page" data-ezsrc="https://kirelos.com/wp-content/uploads/2021/08/echo/p1.png611140f22d463.jpg" ezimgfmt="rs rscb5 src ng ngcb5" height="397" loading="lazy" src="data:image/svg xml,” width=”750″>

Conclusion

Congratulations! you have successfully installed the Ionic framework on Debian 10 server. You can now start creating your mobile application using the Ionic framework.