morpion en react vs angular

Documents/JournalDeBord.md

@@ -13,4 +13,5 @@
 | 23-24.11.2024 | Création d'utilisateur                       | - | -                      | -   
 | 28.11.2024 | Oauth2 Google api                       | - | -                      | -   
 | 05.12.2024 | Réglages zotero et ajout des sources                       | - | -                      | -   
-| 13.12.2024 | On continue la doc                       | - | -                      | -   
\ No newline at end of file
+| 13.12.2024 | On continue la doc                       | - | -                      | -   
+| 15.12.2024 | Création d'un petit jeu du morpion (Nextjs et Angular)                       | - | -                      | -   

Documents/technologie.md

@@ -45,6 +45,30 @@ Points négatifs:
 **Moins Populaire pour Grands Projets** : Vue.js peut être moins performant que d'autres frameworks pour des projets très volumineux en raison de sa taille plus petite et de sa communauté plus réduite.
 **Moins de Support Communautaire** : Comparé à React ou Angular, Vue.js a une communauté plus petite, ce qui peut limiter les ressources disponibles pour résoudre des problèmes complexes.
 
+### Petit jeu du morpion (React vs Angular)
+
+Je me suis amusé à reproduire un petit jeu du morpion en React(nextjs) et Angular. J'ai utilisé les libs que j'aimerais utiliser dans mon projet de bachelor (Tailwindcss et daisyui).
+
+Je voulais comparer un peu les deux technologies. (Packet manager = pnpm)
+
+![Comparaison taille du projet](images/morpion.png)
+
+  On peut constater constater que angular est presque 3x moins lourd (j'ai supprimé dans les deux projets le dossier *node_modules*)
+
+Lors de la création du projet, react m'a demandé nativement l'installation de tailwindcss et eslint. En Angular, il faut le faire à la main.
+
+React propose soit du js, soit du ts. J'ai décidé d'utiliser du ts pour que ce soit équivalent à Angular.
+
+Angular - performance (clique sur une case morpion)
+
+![Performance angular clique sur un bouton](images/angular-performance.png)
+
+React - performance (clique sur une case morpion)
+
+![Performance react clique sur un bouton](images/react-performance.png)
+
+On peut voir pour un petit projet comme celui-ci les performances sont exactement les mêmes.
+
 ### Conclusion
 
 Je peux donc en conclure que bien qu'Angular soit plus difficile à prendre en main, il est plus utilisé dans les grands projets. Il est certe un peu plus lent mais offre un meilleur support, comme le data-binding et les performances apportées. Le plus dur avec Angular, c'est son apprentissage, mais ceci n'est pas un problème pour moi, car j'en ai déjà beaucoup fait à l'école et en entreprise. Mon choix se porte donc sur **Angular**.

angular-morpion @ 6ba22803

+Subproject commit 6ba228030d5f3f403d8c94427e160fab8ad86637

react-morpion @ 077d5f73

+Subproject commit 077d5f7368f648825178ccffa4223aaa43e6fc08