SmarMaker - Documentation
Docs» front» front:architecture

**Ceci est une ancienne révision du document !**

Architecture

Le dossier mobile d'un projet SmartMaker contient un dossier node_modules, un dossier public (fichiers statiques non compilés), un dossier src (code source) et quelques fichiers de configuration, modèle que l'on retrouve dans la majorité des projets React.

Dans le dossier public :

  • images rassemble les icônes de l'application (pwa) et autres images statiques.
  • locales contient les ichiers de traductions json.

Vous pouvez bien évidemment agencer et/ou rajouter des dossiers comme videos, audios, … comme vous le souhaitez.

Dans le dossier src:

  • assets contient les fichiers statiques pris en charges par la compilation.
  • components regroupe les composants jsx de l'application.
  • i18n contient les fichiers de configuration des traductions.
  • redux contient les fichiers de gestion de l'état global de Redux.
  • utils contient les constantes, les fonctions utilitaires, …
  • App.jsx est le premier composant de l'application englobant les pricipaux.
  • main.jsx est le point d'entrée de tout le code source de l'application importé dans index.html.
  • appConfig.js est un fichier de configuration globale de l'application.

Fichiers de configuration :

  • .env contient les variables d'environnement ignoré par le .gitignore.
  • .env.example est le modèle du fichier .env.
  • .gitignore contient la liste des dossiers/fichiers ignorés par Git.
  • eslint.config.js est la configuration de ESLint qui analyse le code et renvoie des erreurs.
  • index.html est le fichier HTML dans lequel React monte l'application.
  • package-lock.json est un fichier généré par npm afin de vérouiller les versions exactes des dépendances.
  • package.json contient la configuration du projet, les dépendances, srcipts, …
  • README.md est un fichier de documentation.
  • vite.config.js contient la configuration de Vite (c'est ici que l'on retrouve celle de la PWA).

Vous serez probablement amené à ajouter, supprimer des dossiers/fichiers ou, plus généralement, modifier cette architecture. Vous remarquerez que la position de la plupart de ces dossiers/fichiers n'a pas une importance technique particulière, mais relève surtout d'une question d'organisation.

Previous Next

SmarMaker - Documentation
Traductions de cette page:
  • Français
  • Deutsch
  • English
  • Español
  • Italiano
  • Nederlands

Table of Contents


  • SmartMaker
    • SmartAuth
    • Back (PHP)
    • Front (React)
      • Architecture
      • Composants et pages
      • Routage
      • Requêtes Api
      • Stockage de données
      • Traductions
      • Thèmes
      • PWA
      • Astuces
    • SmartCommon
    • HowTo first app
  • Formations
  • Démonstration
  • Afficher le texte source
  • Anciennes révisions
  • Liens de retour
  • Haut de page
  • S'identifier
front/architecture.1759313630.txt.gz · Dernière modification : 2025/10/01 10:13 de paolo