Home›Programs›Mobile: compare and prototype with Ionic, React Native and Flutter
Mobile development

Mobile: compare and prototype with Ionic, React Native and Flutter

Understand mobile development approaches, compare frameworks and prototype with three technologies.

Request this program
Duration
28 h · 4 days
Level
Intermediate
Format
On site · Remote · Blended
Max. group size
12 participants

Overview

This program lets you choose a mobile technology with full knowledge. After an overview of the approaches (native, web, hybrid), participants prototype the same application with Ionic, React Native, then Flutter, comparing architecture, navigation, state, persistence and deployment. Generative AI is used throughout the course to boost productivity.

Who this program is for

  • Web developers who want to target mobile
  • Architects who must choose a technology
  • Technical project managers

Prerequisites

  • Web development basics (HTML, CSS, JavaScript)
  • Knowledge of Angular, React or XML appreciated

Learning objectives

  • Compare native, web, hybrid and cross-platform
  • Design the architecture of a mobile application
  • Build a responsive, interactive interface with each framework
  • Handle navigation, state, storage and network calls
  • Test on several devices
  • Prepare deployment
  • Use generative AI to speed up development

Detailed curriculum

8 modules · 28 h · 4 days

Day 1
Overview of mobile development3.5 h
50% theory · 50% practice
  • Android and iOS: the constraints of each platform
  • Native, web, hybrid and cross-platform
  • Ionic, React Native, Flutter, MAUI, Kotlin Multiplatform
  • Selection criteria
  • Setting up the environments
Designing a mobile application3.5 h🛠 1 workshop
30% theory · 70% practice
  • Expressing the need and user journeys
  • Mobile mockups
  • Architecture and breakdown
  • Productivity with generative AI
  • Scoping the running application
🛠 Hands-on workshops
Mockup and architecture1.5 h

Scope the application that will be prototyped three times.

✅ Deliverable : A mockup and an architecture plan
Day 2
Ionic: web and Capacitor3.5 h🛠 1 workshop
30% theory · 70% practice
  • Architecture of an Ionic application
  • Components and navigation
  • State management
  • Capacitor and access to native features
  • Persistence and communication with a server
🛠 Hands-on workshops
Ionic prototype1.5 h

Build the main screens with Ionic.

✅ Deliverable : An Ionic prototype
Ionic: testing and deployment3.5 h
50% theory · 50% practice
  • Testing on browser, emulator and device
  • Performance
  • Building for Android and iOS
  • Publishing
  • Lessons learned
Day 3
React Native: components and navigation3.5 h🛠 1 workshop
30% theory · 70% practice
  • Native components and styles
  • Navigation
  • State management
  • Forms and lists
  • Access to native modules
🛠 Hands-on workshops
React Native prototype2 h

Build the same screens with React Native.

✅ Deliverable : A React Native prototype
React Native: data and deployment3.5 h
50% theory · 50% practice
  • Local persistence
  • Network calls
  • Notifications
  • Building and publishing
  • Comparison with Ionic
Day 4
Flutter: widgets and navigation3.5 h🛠 1 workshop
30% theory · 70% practice
  • Dart and widgets
  • Layout and themes
  • Navigation
  • State management
  • Communication with native features
🛠 Hands-on workshops
Flutter prototype2 h

Build the same screens with Flutter.

✅ Deliverable : A Flutter prototype
Comparison and recommendations3.5 h🛠 1 workshop
30% theory · 70% practice
  • Persistence and deployment with Flutter
  • Comparison grid of the three approaches
  • Performance, costs and skills
  • Recommendations depending on context
  • Next steps
🛠 Hands-on workshops
Recommendation memo1.5 h

Write the technology recommendation for a real project.

✅ Deliverable : A reasoned memo

Tools and technologies

Android StudioFlutterIonicReact NativeVisual Studio Code

Teaching methods

  • Alternating short lectures and hands-on work
  • Live demonstrations by the trainer
  • Capstone project built throughout the modules
  • Group corrections and discussion of best practices

Assessment

  • Hands-on exercises corrected in each module
  • Mini-project completed at the end of the course
  • Knowledge-check quiz

Required equipment

  • A computer with an internet connection
  • Node.js, Android Studio or an emulator, and a code editor

Resources provided

  • Course materials and repository of corrected exercises

Career outcomes

  • A reasoned technology decision table
  • Three comparable prototypes
  • Decision criteria for your own context
Request this program← All programs