Ionic Developer Glossary

Autoprefixer

Autoprefixer is a tool that adds vendor-specific-prefixes to hand-written Sass/CSS code. This ensures that standardized CSS rules you write will be applied across all supporting browsers. For example, instead of having to know every flexbox syntax used by various browsers, autoprefixer allows you to just write display: flex; and it'll automatically plug in the correct CSS.</p> </section>

Babel

Babel is a next-generation JavaScript compiler. Currently, today's browsers do not support every feature of the next-generation of JavaScript (ES6). Babel solves this problem by compiling your ES6 code in to ES5, which is the well-known version of JavaScript supported in all browsers.

Circular Dependency

A circular dependency is a problem caused when two modules depend on each other. This can cause dependency injection to break, and is to be avoided. This article outlines the problem of circular dependencies, and proposes a solution.

CLI

A CLI, or command-line interface, is text-based interface for interacting with a program. The common command-line app for a Mac user is the Terminal app, and Windows users often use Command Prompt. The Ionic community often uses this term to refer to Ionic's CLI. Ionic's CLI can be used for a number of things, such as creating production builds of an app, running the development server, and accessing Ionic services.

CommonJS

CommonJS is a group that defines standard formats for JavaScript API's. They have defined standards for JavaScript modules and packages.

Cordova

Cordova is a way to transform standard HTML/CSS/JS into a full-fledged native app. It provides a JavaScript API for accessing native device functionality, such as the camera or accelerometer. Cordova contains the necessary build tools for packaging webapps for iOS, Android, and Windows Phone.

Dependency Injection

Dependency injection is a pattern used by Angular to resolve or "inject" dependencies into a module. The injector finds the instance of the dependency being requested, and passes or "injects" this instance to the module.

ES5

ES5 refers to EcmaScript 5th Edition. A simple way to put it is that ES5 is the version of JavaScript which developers are most familar with today.

ES2015/ES6

ES2015/ES6 are two commonly used names for the most recent version of JavaScript. A wide range of new features have been introducted in this version, including classes, modules, iterators, and promises. The final draft of ES6 has been approved, which means eventually ES6 code will be interpreted directly by a browser. To use ES6 features today, tools such as Babel and TypeScript have to transpile ES6 code down to ES5.

ES2016/ES7

ES2016/ES7 are two commonly used names for the experimental version of JavaScript. This future version of JavaScript will add a number of new features to the language, including async functions and typed objects. It is constantly being revised, and it is not currently suitable for production apps.

Git

Git is a version control system for managing code. It allows development teams to contribute code to the same project without causing code conflicts.

Gulp

Gulp is a tool for running tasks which can be used to build your application. Common build tasks include transpiling ES6 to ES5, turning Sass in to CSS, minifying code, and concatenating files.

Hybrid App

A hybrid app is a mobile app that is written using web technologies such as HTML, CSS, and JavaScript. Hybrid apps run in a WebView that contains your code. By using tools like Cordova, your code can access native device functionality such as the camera and accelerometer. Unlike native apps which typically only are built for a single platform, hybrid apps can run on iOS, Android, Windows Phone, and anywhere that has a WebView.

Ionicons

Ionicons is an open-source icon set used and created by Ionic. It includes iOS, Material Design, and social icons, as well as a wide range of commonly used icons. Ionicons is included by default in Ionic distributions, but they can be used in any project.

iOS

iOS is a mobile operating system used by the iPhone and iPad. iOS 9 is the most recent version of the operating system.

Karma

Karma is the unit testing framework used internally for Ionic. Karma can initialize Ionic and Angular components, and run tests against them once instantiated. Karma's API provides a number of assertions and other functions that make unit testing easier. For example, Karma could instantiate a NavBar, set the title using Ionic's NavBar API, and then make sure that the title was actually updated.

Material Design

Material Design is a design guideline created by Google. It includes a UI interaction standard, a colorscheme, layouts, components, and much more. Material Design is used for many default system interfaces on recent versions of Android. By default Ionic components will switch to a material design theme when on Android.

Minification

JavaScript source code can be reduced in size through minification. This process does not change the functionality of the code, even though whitespace, newlines, and other characters are removed. Minified JavaScript files will often be written `.min.js` file extension so it is clear that the contents include minified code. In a typical Ionic project, Gulp is used for minification.

Module Loader

A module loader is a tool that takes modules of a certian format, loads its dependencies, and makes the module available to your application. The Ionic community will often use this term to talk about module loaders like SystemJS or RequireJS.

Modules

Modules are organized units of code that belong together. Often times modules will be grouped by functionality. Modules can use other modules, but they have to explicitly import them. In other words, you can't globally access a function you define inside a module. Aside, from code reuse and organization, this helps avoid namespace conflicts. For example, you could define an `alert()` function inside a module, and it wouldn't conflict with `alert()` function that the `window` object provides.

Prior to to ES6, JavaScript had no built in standard for defining how to build and import a module. The JavaScript community subsequently came up with two different standards for modules — AMD and CommonJS. ES6 modules support both of these formats, so they are considered the "future" of how JavaScript modules will be written.

Native App

A native app is a mobile app that is written using low-level APIs provided by the platform it runs on. Native apps can typically only be run on a single platform (eg: iOS, Android, Windows Phone). The term "native" is often used to compare these types of applications with Ionic apps, which are considered "hybrid".

Native Plugin

A native plugin is a piece of code that exposes an API that can be used to access native device functionality. For an Ionic app, this is typically accomplished through Cordova. These plugins expose a JavaScript API that may interact with numerous platform APIs under the hood.

node

node is a runtime environment that lets you write JavaScript on the server-side. In addition to being used for web services, node is often used to build developer tools, such as the Ionic CLI.

npm

npm is the package manager for node. It allows you to install, share, and package node modules. Ionic can be installed with npm, along with a number of its dependencies.

Protractor

Protractor is the framework Angular and Ionic use for end-to-end testing. Protractor provides an API for selecting DOM elements, and running tests against them. For example, you could use the API to easily create a test that opens your app, fills out a form, and makes sure that it loads the next page when the form is submitted.

Sass

Sass is a stylesheet language that compiles to CSS and is used by Ionic. Sass is like CSS, but with extra features such as variables, mixins, and for loops.

SystemJS

SystemJS is a module loader (like RequireJS) that loads all module formats - AMD, CommonJS, and ES6, and is built on top of the ES6 Module Loader polyfill (a polyfill implementing the way JavaScript will load modules natively in the future).

transpiler

Transpile means to convert code from one language, to another language. Typically a transpiler will convert a high-level language to another high-level language. Often times the Ionic community will talk about transpiling ES2015/ES6 or TypeScript to ES5.

TypeScript

TypeScript is a superset of JavaScript, which means it gives you JavaScript, along with a number of extra features such as type declarations and interfaces. Although Ionic is built with TypeScript, using it to build an Ionic app is completely optional.

Webpack

Webpack bundles together JavaScript modules and other assets. It can be used to create single or multiple "chunks" that are only loaded when needed. Basically you can use Webpack to take your many files and dependencies and bundle them into one file, or however you see fit.

Web App

Like a hybrid app, a web app is written using web technologies such as HTML, CSS, and JavaScript. However, unlike a hybrid app, a web app can only be loaded in a browser. Also, although a web app may use responsive design and could be used by a mobile browser, it cannot access native device functionality like camera and accelerometer.

</div>