2 min read

Ionic has been a popular UI library among web developers because of it being completely framework-agnostic. Now they have announced the much anticipated Ionic 4 Beta release with a focus on performance, build time improvements, theming and multi-framework capabilities, and more.

Although the release is in beta, Ionic invites developers to try testing and migrate their existing ionic-angular apps.

You need to install the latest version of the Ionic CLI (4.0.0) using:

npm install -g ionic
Since v4 is still in beta, creating projects with it requires a flag when starting a new Ionic app:

ionic start myApp tabs –type=angular

Your v4 beta app will be created using ng cli conventions and the new Ionic 4 components.

Let’s talk about the features Ionic 4 comes packed with.

Focus on Web standards

Ionic 4 has been rebuilt using standard Web APIs, and each component is packaged as a standards-compliant Web Component. With this standardization, the framework will now rely solely on APIs browser’s native support keeping the public API for each component stable.

The Ionic team has also developed and open-sourced a Web Component compiler Stencil, to use Web Components for each component more easily. Ionic 4 completely embraces modern Web APIs such as Custom Elements, CSS Variables, and Shadow DOM.

Updates for Angular

This release also adopts new Angular tooling and features following Angular standards and conventions to make Ionic 4, Angular’s leading mobile solution.

Angular developers can now use the Angular CLI directly for Ionic apps. ionic-app-scripts are now replaced with Angular CLI and Router.

Changes to Documentation

Ionic 4 comes with a completely redesigned Ionic Framework documentation. The documentation increases load and navigation performance, making it easier to update and maintain. There are more examples and previews along with more code snippets. The new docs are built with Stencil.

Other improvements

  • New Ionicons 4.0 with reduced sizes, and brand new icon forms reflecting the latest iOS and Material Design styles.
  • Ionic Native 5.0 Beta has been upgraded to be framework independent. Check out the new Native API Docs
  • CLI 4.0, is heavily refactored offering powerful Cordova integration with livereload, custom schematics for generators, and support for multiple projects.
  • New CLI Docs, provide more information in a cleaner and easier to read layout.
  • Shadow DOM, makes it easy to reduce the amount of client-side code by embracing native browser APIs and web-standards. Additionally, Shadow Dom helps in easily consuming Ionic components from any web app by encapsulating its styles.

You can learn more about the Ionic 4 Beta release in the Ionic 4 beta docs. The Migration Guide and the Installation guide are also available.

Read Next

Ionic Components
Creating Our First App with Ionic
How to use SQLite with Ionic to store data?

Content Marketing Editor at Packt Hub. I blog about new and upcoming tech trends ranging from Data science, Web development, Programming, Cloud & Networking, IoT, Security and Game development.


Please enter your comment!
Please enter your name here