[HELP] ReactJs orienté composant

Alexandre Buchs
Javascript

Bonjour,

Actuellement j'essaye de travailler sur ReactJs et j'utiliser Webpack car je code en ES6, seulement je suis pas un expert sur la compilation.
Donc mon probleme c'est que j'aimerais organiser mon projet en "Orienté Composant", seulement je ne sais pas faire la compilation et je ne trouve pas de tuto pour m'expliquer comment faire ce genre de chose.
Actuellement mon projet ressemble a ça :

-Back
-Front
    -index.html
    -webpack.config.js
    -App.jsx
    -main.js
    -package.json

Tout Fonctionne a merveille mais je me dit que dés que je vais avoir plusieurs page ça va commencer a etre un sacré bazar.
Donc j'aimerais construire une structure qui ressemble plus a ceci :

-Back
-Front
    -Home
        -home.jsx
        -home.html
        -home.css
    -Register
        -register.jsx
        -register.html
        -register.css
    -index.html
    -package.son
    -webpack.config.js
 etc...

Si quelqu'un à les capacités ou des sources pour m'aider je prends direct.

Merci à vous !

3 réponses

Defy
Réponse acceptée

Je ne comprend pas ton probleme, en faite.
je pense que tu n´as pas bien compris le principe de react. si tu veut faire du multi page fait utiliser react router et un point entree de tes composant pour rendre l´application dans le dom. en suivant le tuto sur le site de react tu comprendra mieux comment faire

Alexandre Buchs
Auteur

Edit :
Je viens de regarder avec "react-router" et je comprends qu'on assigne le composant directement dans le main.js par exemple en meme temps que l'on cible avec 

document.getElementById('app');

Mais en gros je voudrais que chacun de mes composants soit dans une fichiers differents parce que j'imagine que de base ils ne sont pas chargé.

encore edit :
je crois que je viens de comprendre, on mets le lien du composant direct dans la balise "Route" est-ce que c'est bien ça ?
merci !

Defy

oui absolument, les dependances sont resolue automatiquement par ton systeme de build. il suffit d'avoir un point d'entrée qui bootstrap ton application.