# data[].attributes.body
Présentation du cours

Organisation du cours et examen

Mes attentes

Déroulement des leçons

Discussion sur vos attente

Présentation d'outils et supports/ressources utiles

Tips & Tricks

Plan de la leçon

Présentation du module

Chapitre 1 : Analyser les données et le scénario

Exercices

# data[].attributes.body
Chapitre 4.1 - Possibilités et conditions de publication

Chapitre 4.2 - Étapes nécessaires à la publication

Chapitre 4.3 - Commercialisation d'une application mobile

Exercice transversal - Publication d'une app

# data[].attributes.body
Chapitre 2.1 - Typologies des applications

Exercice 3

Chapitre 2.2 - Fonctions et capteurs

Exercice 1

# data[].attributes.body
Chapitre 3.4 - APIs Capacitor

Activité : "Mini Kit Natif"

Chapitre 3.5 - Navigation

Chapitre 3.6 - Simulation et tests

Activité pratique : En route pour Ilum ! 💠🪐

# data[].attributes.body
Revue de l'exercice pratique - "Apprenons Supabase"

Ajout d'une synchro offline - online

Chapitre 8 - Détection du réseau

Chapitre 9 - Synchronisation

# data[].attributes.body
Revue de l'exercice pratique

9.5 - Synchronisation cloud

Chapitre 3.2 - Rappel UX & intro Ionic

Activité : créer une première page structurée

Chapitre 3.3 - Les composants UI d'Ionic

Activité : construire une interface

# data[].attributes.body
Chapitre 2.6 - Persistance cloud et BaaS

Interlude - Intro à TypeScript

Chapitre 3.1 - Mise en place de l'environnement de développement

Exercice pratique - Apprenons Supabase

# data[].attributes.body
Chapitre 2.3 - Architecture et composants

Chapitre 2.4 - Persistance et scénarios offline

Exercice CityQuest

Chapitre 2.5 - Authentification

Kahoot

# data[].attributes.headline
Activité du jour : devenir Darth Jar Jar

# data[].attributes.subject
Activité du jour : devenir Darth Jar Jar

# data[].attributes.headline
🎅 Bonnes fêtes 🎄 et Noyeux Joël à tous ⭐

# data[].attributes.subject
🎅 Bonnes fêtes 🎄 et Noyeux Joël à tous ⭐

# data[].attributes.attachment_link.readable_text
Présentation du module

Objectifs, compétences visées, organisation

Introduction

Types d'apps, installer Ionic, prise en mian IDE/simulateur

Bases Ionic + composants UI

Découvrir structure projet, composants de base, navigation simple

TypeScript pour débutants

S'initier aux bases TS

UX/UI mobile & guidelines

Standards ergonomiques, bonnes pratiques mobiles

Gestion de données & persistance

Stockage local, scénraois offline/online

Accès capteurs (géolocalisation)

Comprendre API Capacitor, permissions, GPS

Autres capteurs & multimédia

Découvrir capteurs mouvement, caméra, micro

Connexion API externe

Consommer une API REST

Tests & qualité

Voir tests fonctionnels et non-fonctionnels (UX, portabilité), debug & simulateurs

Publication & distribution

Comprendre stores (Android/iOS), PWA, étapes publication, contraintes légales

Récap & présentation projets

Bilan module, retour sur compétences acquises

# data[].attributes.attachment_link.description
Open-Source UI Toolkit to Create Your Own Mobile Apps

# data[].attributes.attachment_link.title
Capacitor - Cross-platform Native Runtime for Web Apps | Capacitor Documentation

# data[].attributes.attachment_link.description
A cross-platform native runtime for building Native Progressive Web Apps for iOS, Android, and beyond

# data[].attributes.attachment_link.title
Documentation - TypeScript for JavaScript Programmers

# data[].attributes.attachment_link.title
Un navigateur Web sécurisé, rapide et privé avec fonctionnalités de blocage des publicités | Brave

# data[].attributes.attachment_link.description
Le navigateur Brave est un navigateur Web rapide, privé et sécurisé pour PC, Mac et mobile. Téléchargez-le maintenant pour profiter d’une expérience de navigation plus rapide et sans publicité, qui permet d’économiser des données et de préserver l’autonomie de la batterie en bloquant les logiciels d…

# data[].attributes.attachment_link.title
Appflow: The Easiest Way to Build and Deploy Apps | Ionic.io

# data[].attributes.attachment_link.description
Appflow is the easiest way to build and deploy amazing apps. Move faster with cloud native, live updates, app publishing, and the ability to automate it all.

# data[].attributes.attachment_link.title
Google NotebookLM | AI Research Tool & Thinking Partner

# data[].attributes.attachment_link.description
Meet NotebookLM, the AI research tool and thinking partner that can analyze your sources, turn complexity into clarity and transform your content.

# data[].attributes.body
Rappel des éléments précédents

Chapitre 1.2 - Standards ergonomiques et UX

Exercice 2

Chapitre 1.3 - Caractéristique des appareils mobiles

Exercice 2

# data[].attributes.attachment_link.description
Join a game of kahoot here. Kahoot! is a free game-based learning platform that makes it fun to learn – any subject, in any language, on any device, for all ages!

# data[].attributes.attachment_link.readable_text
Live Reload is useful for debugging native functionality (such as plugins) on device hardware. Rather than deploy a new native binary each time you make a code change, it reloads the browser (or WebView) when changes in the app are detected. Learn more here.

Safari can be used to debug an Ionic app on a connected iOS device or iOS simulator.

First, on the iOS device, enable Web Inspector from Settings > Safari > Advanced.

Next, open Safari on a Mac then enable Show Develop menu in menu bar under Safari > Preferences > Advanced.

Run the iOS simulator or connect your iOS device to your Mac, then run the Ionic app that you want to debug.

Within Safari, select Develop in the toolbar. In the dropdown menu options, you should see the name of your device and app. Hover over the app name and click on localhost. This will open a new window with the Safari Developer Tools - use them to inspect and debug the Ionic app running on your device.

Use Google Chrome's DevTools to debug an app when it is running in the browser using the ionic serve command, deployed to an emulator, or on a physical device.

To inspect a physical device, first you need to have developer mode enabled. Connect your Android device to the computer then go to Settings > About scroll to Build Number and tap that 7 times. This will activate a new option in the Settings menu called Developer Options.

Next, go to Settings > Developer Options and ensure that the developer options switch is toggled on. Scroll down to USB Debugging and ensure that it is also enabled. Developer Options & USB Debugging are enabled by default in the Android emulator.

Open the Chrome browser and navigate to the URL chrome://inspect/#devices. Your connected Android device should show up in the list of Remote Targets.

On your device, open the Ionic app that you would like to debug using Chrome.

With your app running on the device, head back to Chrome and click on inspect under your device in the list of remote targets. This will open the Chrome Developer Tools in a new window. You will then be able to use all of the Chrome DevTools to debug the application as it runs on your device.

Visual Studio Code can also be used to debug an Ionic app running in the Chrome web browser.

To do this, run your app in the browser using ionic serve. Take note of the port that your app is running on. Next, open your Ionic project using Visual Studio Code.

In the far-left vertical menu within VS Code, click on the run icon. If you are configuring this for the first time in your project, click on the option to create a launch.json file. Select Chrome from the environment options dropdown. This will automatically generate a launch.json file with configurations for launching Chrome against localhost.

Make sure that the port used in the url property of your launch.json file matches the port that you observed earlier when you ran ionic serve. Using an incorrect port number will not work.

In the debug target dropdown menu, select Launch against Chrome, then click run. This will open a new instance of the Chrome browser and VS code will attach to it. You can set breakpoints and use the other debugging tools within VS Code while your app is running in Chrome.

Visual Studio Code has a dedicated plugin for debugging apps that run in an Android WebView.

The plugin creates a bridge between the device and the Visual Studio Code developer tools and permits debugging right from the editor.

In order to use this plugin to debug your Ionic apps, first install it then start your app in the Android emulator or connect your Android device and run the app. You may need to enable USB debugging on your Android device.

In the root of your Ionic project, create a folder called .vscode and inside that folder create a file called launch.json. Inside launch.json, enter the following code to configure the plugin to debug Ionic apps:

Next, launch the debugging process, selecting your device and Ionic app. VS Code will attach to both the Android device and Ionic app and you can now debug your app, which includes setting breakpoints.

# data[].attributes.attachment_link.description
Ionic Framework's ultimate guide to debugging apps in iOS Safari and Android Chrome. Read our debugging guide to get started with your Ionic apps today.

# data[].attributes.body
Bonus - Monétiser une app mobile

Révisions

Préparation de notes

Revue des thématiques abordées

# data[].attributes.body
Présentation de vos projets

Chapitre 5.1 - Vérifier les exigences fonctionnelle

Chapitre 5.2 - Vérifier les exigences non fonctionnelles

Exercice pratique - Tester une application et rédiger les rapports de tests

# data[].attributes.body
Une feuille recto-verso manuscrite

Un mindmap collaboratif, à faire valider minimum 1 SEMAINE AVANT L'EXA

# data[].attributes.body
Problème

# data[].attributes.body
Copyright ©️ Meynier Alexsandra

# data[].attributes.body
YT - How to add Google AdMob in Ionic Vue Apps