Programmation · React Native

Défis de code

Une histoire, une mission, des tests automatiques. Ton code tourne dans un vrai téléphone d'aperçu : quand tous les voyants passent au vert, c'est gagné.

Codey

0/6

réussis

★

Défi 01

L'enseigne du food-truck

Nassim ouvre son food-truck ce soir sur les quais. Son enseigne numérique est éteinte et les clients passent sans s'arrêter. Allume-la : un grand « OUVERT » vert qui se voit de loin, sur un fond sombre.

React NativeTextStyles
+40 XP
★

Défi 02

Les tickets du guichet

À la poste de Kinshasa, le distributeur de tickets est en panne et la file s'allonge. Programme l'écran du guichet : « Suivant » appelle le ticket suivant, « Remise à zéro » recommence à 1 en début de journée.

React NativeuseStatePressable
+50 XP
★★

Défi 03

La cible du radar

La station météo de Libreville veut un écran radar. Dessine une cible de trois cercles concentriques (180, 120 et 60 de diamètre), parfaitement centrée à l'écran.

React NativeFlexboxDimensions
+70 XP
★★

Défi 04

Le classement de la ligue

La ligue Topre affiche ses scores dans le désordre et les joueurs protestent. Trie-les du meilleur au moins bon et affiche chaque ligne sous la forme « 1. Awa — 910 ».

React NativeListesTriImmutabilité
+80 XP
★★★

Défi 05

La connexion sécurisée

L'appli de covoiturage de Dakar reçoit des inscriptions avec des e-mails invalides. Protège l'écran de connexion : le bouton ne doit fonctionner que si l'e-mail contient un @ et que le mot de passe fait au moins 6 caractères.

React NativeTextInputValidationdisabled
+110 XP
★★★

Défi 06

Le mode nuit

Les chauffeurs de nuit de Montréal sont éblouis par l'appli. Ajoute un interrupteur : en mode nuit, le fond passe en #1d1e20 et le libellé devient « Mode nuit ».

React NativeSwitchStyles dynamiques
+100 XP