fbpixel
Étiquettes : , ,
0
(0)

Nous allons voir dans ce tutoriel comment programmer une application smartphone avec React Native et VSCode. React Native est un outil puissant permettant notamment de réaliser des applications multiplateforme (Android, IOs) à l’aide du langage JavaScript. Visual Studio Code est un éditeur de code permettant de développer notamment en C++, Python et avec React Native.

Nous avons vu dans le cadre de projet Arduino ou Raspberry Pi comment créer une application Android avec App Inventor 2. Avec React Native, certe plus complexe, vous serez capable de créer des applications plus évoluer sur Android ou IOs.

Installation de Node.js

Node.js est un environnement d’exécution du langage Javascript permettant de faire du développement Back-end et front-end

Pour installer Node.js sur votre ordinateur Windows, il vous suffit de télécharger l’installateur

Une fois Node.js installé vous aurez accès à npm (Node Package Manager) qui vous permettra d’installer les paquets nécessaires.

Installation et configuration d’Android Studio

Téléchargez et installez Java JDK 11

Configurez JAVA_HOME dans les variables d’environnement (C:\Program Files\Microsoft\jdk-11.0.17.8-hotspot\)

Téléchargez et exécutez l’installateur de Android Studio

Configurez ANDROID_HOME dans les variables d’environnement (C:\Users\ADMIN\AppData\Local\Android\Sdk)

Ouvrir Android Studio. Sur la fenêtre d’accueil, cliquez sur Configure puis AVD Manager

Là vous pourrez définir les appareils virtuels sur lesquels tester votre application.

N.B.: L’installation, la configuration d’Android Studio et le bon fonctionnement des appareils virtuels peut dépendre de l’installation d’Android SDK, Java SDK et Gradle, etc. Ce n’est pas ici le sujet principal mais si vous rencontrez un soucis n’hésitez pas à nous écrire.

Installation et configuration de Visual Studio Code

Pour installer Visual Studio Code, il vous suffit de télécharger et exécuter l’installateur

Une fois le logiciel installé, vous pouvez ajouter les extensions nécessaires au développement sous React Native avec VSCode

Créer un projet React Native

Créer un dossier qui contiendra votre projet ReactNative puis ouvrez le dans VSCode

Dans le terminal,

npx react-native@latest init CustomApp

Installez les dépendances avec yarn et lancer l’application

cd CustomAdd
npm install -g yarn  
yarn install
npx react-native start

Puis appuyer sur « a » pour l’exécuter sur Android

Visualiser l’application sur un appareil Android

Sur votre téléphone Android, dans « Paramètres », allez dans « paramètres supplémentaires » puis « Options pour les développeurs ». Rechercher l’option « Débogage USB » et activez-la. Cela vous permettra d’installer des applications via le port USB.

Vous pouvez vérifier que votre appareil est bien détecté et bien configurer avec la commande adb devices

Une fois votre appareil correctement configuré, si vous relancez l’application elle sera téléchargé et installé sur l’appareil

Applications

  • Créer des applications IOs ou Android pour communiquer avec les objets connectés à base d’Android, Raspberry Pi, ESP32, ESP8266, etc.

Sources

How useful was this post?

Click on a star to rate it!

Average rating 0 / 5. Vote count: 0

No votes so far! Be the first to rate this post.

As you found this post useful...

Follow us on social media!

We are sorry that this post was not useful for you!

Let us improve this post!

Tell us how we can improve this post?