Ionic React Overview

@ionic/react combines the core Ionic experience with the tooling and APIs that are tailored to React Developers.

note

The first official version of Ionic React is v4.11.

First, install the Ionic CLI:

npm install -g @ionic/cli

then run:

ionic start myAppName

The CLI will guide you through the setup process by asking a couple of questions, including the framework to use (React, of course!) and the starter code template.

After the app has been created, launch the app:

ionic serve

Now, start building out the app using some of the Ionic UI components.

React Version Support

Compatible with React version 16.8 and above.

React Tooling

Ionic React projects are just like React projects, leveraging react-dom and with setup normally found in a Create React App (CRA) app. For routing and navigation, React Router is used under the hood.

One difference is the usage of TypeScript, which provides a more productive experience. To use plain JavaScript, rename files to use a .js extension then remove any of the type annotations with each file.

Native Tooling

Capacitor is the official cross-platform app runtime used to make your Ionic React web app run natively on iOS, Android, Electron, and the web.

While there are no known technical limitations to using Ionic React with Cordova plugins, Capacitor is officially recommended. There are no plans to support a Cordova integration for Ionic React in the Ionic CLI tooling at this time. For more details, please see here.