A guide covering Ionic including the applications, libraries, and tools that will make you a better and more efficient Ionic developer.
Note: You can easily convert this markdown file to a PDF in VSCode using this handy extension Markdown PDF.
Ionic Framework is a front-end SDK for building cross-platform mobile apps. Built on top of Angular and Apache Cordova, Ionic also provides a platform for integrating services like push notifications and analytics.
Ionic Framework - Enterprise Training
Top Ionic Courses Online | Udemy
[Ionic React: Cross-Platform Mobile Development with Ionic 5 | Udemy](https://www.udemy.com/course/ionic-react/
Ionic & Angular JS: Principles Of Mobile and Web Development
Ionic: Getting Started | Pluralsight
Building Desktop Apps with Ionic and Electron | Pluralsight
Ionic Essential Training | LinkedIn Learning
JavaScript Programming with Visual Studio Code
Google's JavaScript Style Guide
Ionic command line interface (CLI) is the go-to tool for developing Ionic apps.
Stencil is a toolchain for building scalable, enterprise-ready component systems on top of TypeScript and Web Component standards. Stencil components can be distributed natively to React, Angular, Vue.js, and traditional web developers from a single, framework-agnostic codebase.
Stencil ESLint is the ESLint rules specific to Stencil JS projects.
Capacitor is a cross-platform API and code execution layer that makes it easy to call Native SDKs from web code and to write custom native plugins that your app may need. Also, Capacitor provides first-class Progressive Web App(PWAs) support so you can write one app and deploy it to the app stores and the mobile web.
Ionic Native is a curated set of wrappers for Cordova plugins that make adding any native functionality you need to your Ionic mobile app easy.
Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications.
WebStorm is a professional IDE for JavaScript(including support for both HTML and CSS) developed by JetBrains. WebStorm comes with intelligent code completion, on-the-fly error detection, powerful navigation and refactoring for JavaScript, TypeScript, stylesheet languages, and all the most popular frameworks(Angular, React, Vue.js, Ionic, Apache Cordova, React Native, Node.js, Meteor, and Electron).
Monaca is a comprehensive cloud-powered and framework-agnostic set of tools Monaca supports both online and offline development, debugging with live-reload feature and cloud build experience.
Onsen UI is a custom Elements-based HTML5 framework offers a large selection of components and responsive layout support. Onsen UI lets you create professionally designed multiplatform apps without acquiring additional skillset.
App Builder is a complete IDE for Microsoft Windows which allows to create HTML5 and native apps without programming knowledge. Offers dozens of controls and actions ready to be used in your apps and lot of app samples to learn it.
Storybook is a development environment for UI components. It allows you to browse a component library, view the different states of each component, and interactively develop and test components.It works with React, Vue, Angular, Ember, and other web frameworks.
Standard is a JavaScript Style Guide, with linter & automatic code fixer.
Framework7 is a free and open source mobile HTML framework for developing hybrid mobile apps or web apps with iOS & Android native look and feel.
NSB/AppStudio is an IDE for webapps/native apps. One step install includes complete PhoneGap integration, plus Bootstrap, jQuery Mobile and jqWidgets. Drag and Drop Designer. Easy programming in JavaScript or BASIC. Windows and MacOS.
Mobiscroll is a collection of cross platform UI controls for delivering polished iOS, Android & Windows Phone apps. Framework agnostic, use it with plain Javascript, jQuery, Angular, React or Knockout.
Instabug is a service that provides Cordova developers with a bug reporting and in-app feedback solution. With a one minute install guide, it enables users to seamlessly report bugs while automatically attaching details such as network logs, repro-steps, etc.
Quasar is a write code once and simultaneously deploy it as a website, Mobile / Electron App or Browser Extension. Yes, one codebase for all of them, helping you develop an app in record time by using a state-of-the-art CLI and backed by best-practice, blazing f...
VoltBuilder is a modern replacement for PhoneGap Build. Upload project and certificates, then download builds (or upload to store). Uses latest Apache Cordova and SDKs. There's nothing to install: just sign up and submit.
VoltSigner is a free service to create Android and iOS signing certificates. Run completely in your local browser - nothing gets uploaded. Compatible with all build tools. Notably, it can produce iOS certificates on Windows.
NPM is the company behind Node package manager, the npm Registry, and npm CLI.
node-gyp is a cross-platform command-line tool written in Node.js for compiling native addon modules for Node.js. It contains a vendored copy of the gyp-next project that was previously used by the Chromium team, extended to support the development of Node.js native addons.
nvm is a version manager for node.js, designed to be installed per-user, and invoked per-shell. nvm works on any POSIX-compliant shell (sh, dash, ksh, zsh, bash), in particular on these platforms: unix, macOS, and windows WSL.
node-docker is the official Node.js docker image, made with love by the node community.
Mocha is a simple, flexible, fun JavaScript test framework for Node.js & The Browser.
AVA is a test runner for Node.js with a concise API, detailed error output, embrace of new language features and process isolation that lets you develop with confidence.
egg is a born to build better enterprise frameworks and apps with Node.js & Koa.
Fastify is a fast and low overhead web framework, for Node.js.
Express is a fast, unopinionated, minimalist web framework for node.
Meteor is an ultra-simple environment for building modern web applications with JavavScript.
NW.js is an app runtime based on Chromium and node.js. You can write native apps in HTML and JavaScript with NW.js. It also lets you call Node.js modules directly from the DOM and enables a new way of writing native applications with all Web technologies.
PM2 is a production process manager for Node.js applications with a built-in load balancer. It allows you to keep applications alive forever, to reload them without downtime and to facilitate common system admin tasks.
GraphQL is a query language for APIs and a runtime for fulfilling those queries with your existing data. It has support in Java, JavaScript, Ruby, Scala, and other programming languages.
Apollo Client is a fully-featured caching GraphQL client with integrations for React, Angular, and more. It allows you to easily build UI components that fetch data via GraphQL.
Nest is a framework for building efficient, scalable Node.js server-side applications. It uses modern JavaScript, is built with TypeScript (preserves compatibility with pure JavaScript) and combines elements of OOP (Object Oriented Programming), FP (Functional Programming), and FRP (Functional Reactive Programming).
Meteor is an ultra-simple environment for building modern web applications with JavavScript.
mysqljs is a pure node.js JavaScript Client implementing the MySQL protocol.
axios is a promise based HTTP client for the browser and node.js.
Next.js is a React Framework for production gives you the best developer experience with all the features needed for production such as hybrid static & server rendering, TypeScript support, smart bundling, route pre-fetching, and more.
React Starter Kit is an isomorphic web app boilerplate for web development built on top of Node.js, Express, GraphQL and React, containing modern web development tools such as Webpack, Babel and Browsersync. Helping you to stay productive following the best practices.
React Boilerplate is a highly scalable, offline-first foundation with the best developer experience and a focus on performance and best practices.
TypeORM is an ORM that can run in NodeJS, Browser, Cordova, PhoneGap, Ionic, React Native, NativeScript, Expo, and Electron platforms and can be used with TypeScript and JavaScript (ES5, ES6, ES7, ES8).
Enzyme is a JavaScript Testing utility for React that makes it easier to test your React Components' output. The user can also manipulate, traverse, and in some ways simulate runtime given the output.
RxDB is a NoSQL-database for JavaScript Applications like Websites, hybrid Apps, Electron-Apps, Progressive Web Apps and NodeJs.
Redux is a predictable state container for JavaScript apps.
Inferno is an insanely fast, React-like library for building high-performance user interfaces on both the client and server.
Expo is an open-source platform for making universal native apps with React.
React Native Windows is a ramework for building native Windows apps with React. React Native is a framework developed by Facebook that enables you to build world-class application experiences on native platforms using a consistent developer experience based on JavaScript and React.
ReactiveUI is a composable, cross-platform model-view-viewmodel framework for all .NET platforms that is inspired by functional reactive programming, which is a paradigm that allows you to abstract mutable state away from your user interfaces and express the idea around a feature in one readable place and improve the testability of your application.
HTML (HyperText Markup Language) is the basic building blocks of the Web. It defines the meaning and structure of web content along with other technologies used to describe a web page's appearance/presentation using CSS or functionality/behavior using JavaScript.
Cascading Style Sheets (CSS) is a stylesheet language used to describe the presentation of a document written in HTML or XML (including XML dialects such as SVG, MathML or XHTML). CSS also describes how elements should be rendered on screen, on paper, in speech, or on other media.
Microsoft Certified Solutions Associate (MCSA): Web Applications
Intro to HTML/CSS: Making webpages by Khanacademy
Intro to HTML and CSS by Udacity
Modern HTML & CSS From The Beginning (Including Sass) by Udemy
Using Glitch for Developer Relations
WebStorm is a professional IDE for JavaScript(including support for both HTML and CSS) developed by JetBrains. WebStorm comes with intelligent code completion, on-the-fly error detection, powerful navigation and refactoring for JavaScript, TypeScript, stylesheet languages, and all the most popular frameworks(Angular, React, Vue.js, Ionic, Apache Cordova, React Native, Node.js, Meteor, and Electron).
Codeanywhere is a Cloud Integrated Development Environment. Our Cloud IDE saves you time by deploying a development environment in seconds, enabling you to code, learn, build, and collaborate on your projects.
Adobe Brackets is a modern open-source code editor for HTML, CSS and JavaScript that's built in HTML, CSS and JavaScript.
Adobe TypeKit is the Adobe font subscription service for both web and desktop fonts, that makes thousands of fonts from quality foundries accessible, with no extra licensing required.
Ultimate CSS Gradient Generator is a powerful Photoshop-like CSS gradient editor from ColorZilla.
PostCSS is a tool for transforming styles with JS plugins. These plugins can lint your CSS, support variables and mixins, transpile future CSS syntax, inline images, and more.
PurgeCSS is a tool to remove unused CSS in your project.
Tailwind UI is a collection of beautiful, fully responsive UI components, designed and developed by us, the creators of Tailwind CSS. It's got hundreds of ready-to-use examples to choose from, and is guaranteed to help you find the perfect starting point for what you want to build.
Sass(Syntactically Awesome Style Sheets) is a professional grade CSS extension language.
HTML KickStart is a ultra-lean set of HTML5, CSS, and jQuery (javascript) files, layouts, and elements designed to give you a headstart and save you a lot of hours on your next web project.
Mercury is a full featured HTML5 editor. It was built from the ground up to help your team get the most out of content editing in modern browsers.
Maquetta is a WYSIWYG visual page editor for drawing out user interfaces using drag/drop assembly. Maqetta supports both desktop and mobile user interfaces.
Initializr is an HTML5 templates generator to help you getting started with a new project based on HTML5 Boilerplate.
Radi is a tool designed from the ground up to help you create content that will take full advantage of HTML5 features.
Onsen UI is an open source framework that makes it easy to create native-feeling Progressive Web Apps (PWAs) and hybrid apps. Based on Web Components, and provides bindings for Angular 1, 2, React and Vue.js.
Framework7 is a free and open source framework to develop mobile, desktop or web apps with native look and feel. It is also an indispensable prototyping tool to show working app prototype as soon as possible in case you need to.
Gauge.js is a native and cool looking animated JavaScript/CoffeScript gauge.
SproutCore is an open-source framework for building blazingly fast, innovative user experiences on the web.
Tumult Hype is the HTML5 creation app for macOS. The animations and interactive content made with Tumult Hype work on desktops, smartphones and iPads with no code required.
CSS Gradient is a happy little website and free tool that lets you create a gradient background for websites.
Glitch makes easier to build fast, full-stack web apps in your browser for free.
CSS Optimizer is an online tool to clean, compress, and optimize your CSS code.
Sciter is an embeddable HTML/CSS/scripting engine, Windows, MacOS and Linux.
Flexy is minimal CSS framework made with Flex.
Simple CSS is a tool that allows you to easily create Cascading Style Sheets from scratch, and modify existing ones, using a familiar point-and-click interface. With Simple CSS, you can manage multiple CSS projects, import existing .css files as desired, and export projects to .css files.
Conditional-CSS is a CSS module that allows to define a set of rules that will only apply based on the capabilities of the processor or the document the style sheet is being applied to.
Kotatsu is a straightforward CLI tool aiming either at running node.js scripts or serving JavaScript/TypeScript web applications in a modern environment.
AWK is a scripting language used for manipulating data and generating reports.
TypeScript is a language for application-scale JavaScript. TypeScript adds optional types to JavaScript that support tools for large-scale JavaScript applications for any browser, for any host, on any OS. TypeScript compiles to readable, standards-based JavaScript.
TypeScript support for Webpack
TypeScript Support for Nuxt.js
TypeScript Support for React Native
TypeScript Support for Angular
Ionic/TypeScript Starter Project
GitHub Actions for JavaScript and TypeScript
WebStorm is a professional IDE for JavaScript(including support for both HTML and CSS) developed by JetBrains. WebStorm comes with intelligent code completion, on-the-fly error detection, powerful navigation and refactoring for JavaScript, TypeScript, stylesheet languages, and all the most popular frameworks(Angular, React, Vue.js, Ionic, Apache Cordova, React Native, Node.js, Meteor, and Electron).
ReSharper is a Visual Studio Extension for .NET Developers. It comes with code quality analysis, which is available in C#, VB.NET, XAML, ASP.NET, ASP.NET MVC, JavaScript, TypeScript, CSS, HTML, and XML. You'll know right away if your code needs to be improved. ReSharper is one of many powerful tools developed by JetBrains.
ts-migrate is a tool for helping migrate code to TypeScript. It takes a JavaScript, or a partial TypeScript, project in and gives a compiling TypeScript project out. ts-migrate is intended to accelerate the TypeScript migration process. The resulting code will pass the build, but a followup is required to improve type safety.
Deno is a simple, modern and secure runtime for JavaScript and TypeScript that uses V8 and is built in Rust.
gulp-typescript is an TypeScript compiler for gulp with incremental compilation support.
React is a declarative, efficient, and flexible JavaScript library for building user interfaces.
React Native is a framework for building native apps for iOS and Android with React.
Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Angular is a development platform for building mobile and desktop web applications using Typescript/JavaScript and other languages.
Ionic Framework is a powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.
Stencil is a simple compiler for generating Web Components and static site generated progressive web apps (PWA). Stencil was built by the Ionic team for its next generation of performant mobile and desktop Web Components.
Storybook is a development environment for UI components. It allows you to browse a component library, view the different states of each component, and interactively develop and test components.It works with React, Vue, Angular, Ember, and other web frameworks.
Prettier is an opinionated code formatter. It enforces a consistent style by parsing your code and re-printing it with its own rules that take the maximum line length into account, wrapping code when necessary.
Nest is a framework for building efficient, scalable Node.js server-side applications. It is built with TypeScript and combines elements of Object Oriented Programming(OOP), Functional Programming, and Functional Reactive Programming(FRP).
Definitely Typed is a repository for high quality TypeScript type definitions.
TypeORM is an ORM that can run in NodeJS, Browser, Cordova, PhoneGap, Ionic, React Native, NativeScript, Expo, and Electron platforms and can be used with TypeScript and JavaScript (ES5, ES6, ES7, ES8).
NativeScript empowers you to access native APIs from JavaScript directly. The framework currently provides iOS and Android runtimes for rich mobile development and can be utilized in a number of diverse use cases.
AssemblyScript compiles a strict variant of TypeScript to WebAssembly using Binaryen.
React Hook Form is a performant, flexible and extensible forms with easy to use validation(Web + React Native).
Apollo Client is a fully-featured caching GraphQL client with integrations for React, Angular, and more. It allows you to easily build UI components that fetch data via GraphQL.
TensorFlow.js is an open-source WebGL hardware-accelerated JavaScript library for training and deploying machine learning models.
Rome is a linter, compiler, bundler, and more for JavaScript, TypeScript, JSON, HTML, Markdown, and CSS.
Eclipse Theia is an extensible platform to develop full-fledged multi-language Cloud & Desktop IDE-like products with state-of-the-art web technologies.
InversifyJS is a powerful and lightweight inversion of control(IoC) container for JavaScript & Node.js apps powered by TypeScript. An IoC container uses a class constructor to identify and inject its dependencies.
Gatsby is a free and open source framework based on React that helps developers build blazing fast websites and apps.
Meteor is an ultra-simple environment for building modern web applications with JavavScript.
TypeScript ESLint is a monorepo for all the tooling which enables ESLint to support TypeScript.
TS node is a TypeScript execution and REPL for node.js.
- If would you like to contribute to this guide simply make a Pull Request.
Distributed under the Creative Commons Attribution 4.0 International (CC BY 4.0) Public License.