Connaissances prérequises
Avant de vous lancer dans la construction avec O3, vous devez au moins maîtriser HTML, CSS et JavaScript. Si vous débutez totalement dans le développement frontend, il est particulièrement important de bien comprendre les bases. Voici une liste des technologies utilisées dans O3 ainsi que des ressources recommandées pour les apprendre.
HTML & CSS
Une solide compréhension des fondamentaux HTML et CSS est essentielle pour le développement frontend. Voici quelques ressources recommandées :
- Les bases du HTML sur MDN
- Les bases du CSS sur MDN
- CSS Tricks - Un guide complet de Flexbox
- CSS Grid Garden - Un jeu interactif pour apprendre CSS grid
- Le cours CSS de Josh Comeau
- Apprendre CSS sur web.dev
JavaScript
La connaissance de JavaScript est un prérequis pour tout le reste. Nous recommandons les ressources suivantes :
- Introduction to JavaScript - Codecademy
- JavaScript to know for React - Kent C. Dodds
- The Modern JavaScript Tutorial
- JavaScript for impatient programmers
- Josh Comeau’s Operator lookup
- Visual guide to references in JavaScript
React
Les docs officielles sont un excellent moyen de se familiariser avec React. Ne survolez pas les fondamentaux ! Une bonne compréhension des concepts de base est essentielle pour apprendre à développer des modules frontend de haute qualité dans O3. Nous recommandons également les ressources suivantes :
- Erreurs courantes avec React - Josh Comeau
- Comprendre useMemo et useCallback
- Écrire des composants résilients - Dan Abramov (daté mais toujours très utile)
- Un guide (presque) complet du comportement de rendu de React - Mark Erikson
- Pourquoi React Re-renders - Josh Comeau
- Guide du débutant à React - Kent C. Dodds (daté mais toujours très utile)
- Un guide visuel du rendu de React
- Guide des re-rendus de React - Nadia Makarevich
- Quand React rend-il votre composant - Zhenghao Hao
TypeScript
La plupart de notre code est écrit en TypeScript. Nous recommandons les ressources suivantes :
- Essentiels de TypeScript
- TypeScript en 5 minutes
- Total TypeScript
- Feuilles de triche React + TypeScript
Outils JavaScript
- Yarn et Corepack - de nombreux dépôts OpenMRS utilisent Yarn comme gestionnaire de paquets et épinglent la version exacte de Yarn dans le champ
packageManagerdepackage.json. Lancezcorepack enableune fois afin que Node active automatiquement la version de Yarn épinglée par chaque dépôt. - turbo - nous utilisons
turbopour exécuter des scripts pendant le développement local et nos processus d’intégration continue. - swc - nous utilisons SWC pour compiler notre code JavaScript et TypeScript dans un format pris en charge par tous les principaux navigateurs.
- Rspack - la plupart des modules frontend O3 actuels utilisent Rspack pour empaqueter le code en développement local et en production.
- webpack - l’outillage de build O3 prend toujours en charge une configuration compatible Webpack, et quelques modules hérités utilisent encore Webpack directement. Vous rencontrerez surtout les concepts Webpack via Module Federation, la configuration des loaders et les modules frontend plus anciens.
Git
Il est impératif que vous conserviez votre code dans un système de contrôle de version. OpenMRS utilise Git . Vous devez connaître les bases de l’utilisation de Git et de GitHub. Voici d’excellentes ressources d’apprentissage :
- Apprenez avec Git Branching
- Git et GitHub pour les débutants
- Dangit, Git
- Guide OpenMRS pour utiliser Git
API et modèle de données OpenMRS
OpenMRS fournit des API que le frontend utilise pour demander des données. Nous recommandons de vous familiariser avec ces API ainsi qu’avec le modèle de données OpenMRS. Voici les liens pertinents :
Prochaines étapes
Prêt à vous lancer ? Commencez par les Concepts de base pour comprendre la structure d’O3.