3 Most Common Mistakes Made by Ionic Developers

blog

Keval Padia

It has been two years since Ionic has been around and helped us develop hybrid applications based on AngularJS. Ionic has been used to build more than 1 million mobile applications till now. It is an extremely popular framework with a constantly growing community of thousands of other developers. Practices and technologies have evolved so much since the time Ionic has come out.

When there are so many changes, developments, and updates coming up constantly, developers are often confused and end up making mistakes that have potential harm on the quality of the applications being developed and also the productivity of the entire team. Some of these mistakes are so common and easily avoidable. Let’s take a look at some of these most common mistakes that Ionic developers make by avoiding which they can create easily scalable applications with a good performance.

1. Not Making Use of Ionic CLI -

Ionic CLI helps in adding features like platforms and plugins persistence to the Cordova CLI. While using Cordova CLI, the problem you will face is that the platforms and plugins that you will be installing will already be present in the system. It is important to share a similar environment, plugins, and platforms while working on a team so you can easily avoid the bugs. The link between developers and machines is disturbed while working with Cordova.

At the time of using Ionic CLI to install platforms ionic platform add ios and plugins ionic plugin add camera, the package.json file is correctly checked.

Platforms and plugins are then stored in cordovaPlatforms and cordovaPlugins properties:

[su_note note_color="#fdf5e6"]package com.nimblechapps.author;
"cordovaPlugins": [
"cordova-plugin-whitelist@1.0.0",
"cordova-plugin-inappbrowser@1.0.1",
"cordova-plugin-splashscreen@2.1.0"
],
"cordovaPlatforms": [
"android",
"ios"
] [/su_note]

When a developer will run Ionic state restore, he will be able to pull a new code.

2. Using Starter Kit Architecture for Larger Applications -

When you start a project using the Ionic start my app command, it follows this structure:

[su_note note_color="#fdf5e6"]package com.nimblechapps.author;
www/
js/
app.js
controllers/
aaa.js
bbb.js
ccc.js
services/
xxx.js
yyy.js
zzz.js
templates/
aaa.html
bbb.html
Ccc.html
[/su_note]

Files from CSS, HTML, JavaScript is grouped here which is called a Folder-by-Type Structure. It is difficult to scale a structure like this.

There are reasons why you must not use this structure:

  • Finding files to modify a particular structure will be difficult
  • There will be many open folders while working on a feature
  • The number of files will increase
  • The larger the app, more difficult it is to work on

But these are the reasons why you must use it:

  • You can work on a feature independently.
  • Identifying a module is very easy.
  • The number of files in your folders is limited.
  • You can easily find files that are required to modify a specific feature.
  • It is easy to scale. You can easily add any number of features that you wish to add and it won’t be difficult for your team to work on.
  • Even creating a new feature is very easy. All you have to do is copy and paste the existing one.

3. Manually Prototyping Ionic Applications -

While developing on Ionic, you can save a lot of your time by making use of the available components and styles. These components and styles are good because of their aesthetics and minimalist nature.

It is an industry standard to present mockups and wireframes. Looking at a mockup and looking at an actual dynamic component on a mobile device are two very different things. Designers and developers make use of tools like Balsamiq and Azure which help you in developing wireframes with very minimal functionality.

The creators of Ionic made Ionic Creator, which is a tool similar to Balsamiq and Azure. The drag and drop web interface is useful and there are other features as well which are provided by core Ionic. The prototype can be exported into several different formats. You can also share the application you build. A lot of the options on the tool are free to use.

Avoid the Mistakes:

There was a lack of evolution in the practices and tooling. So the number of potential mistakes by Ionic developers increased over time. The mistakes talked about in this article are some of the very basic mistakes so avoid mistakes and try to come out clean with your app development goals. If you think this blog is helpful to you and need more information get in touch with us at Nimblechapps or you can call us on +91 79 2970 7166.

Related Post

CSMS
18 Oct 20228 Views

What Features Will Your EV Charging CSMS Need?

Interested in starting an EV charging business and wondering what to look for in a CSMS software or what features your...

CSMS
06 Oct 202247 Views

What is CSMS for EV Charging Stations?

The global electric vehicle (EV) market is on fire these days. In 2021, the EV market size reached $170 billion mark. However, we have only...

OCCP
03 Oct 202244 Views

What is OCPP and Why is it Important to EV Adoption?

When researching or setting up Electric Vehicle Charging Stations (EVCSs, also known as Electric Vehicle Supply Equipment (EVSE)), you've...