-
Notifications
You must be signed in to change notification settings - Fork 0
Frontend
ReactJS is a Javascript library responsible for the user interface (view layer) of mobile and web apps. It has been developed to be highly dynamic and responsive to user input, making it a popular framework for software development.
React has essential features that work well with web development nowadays, mainly reusable components and the virtual DOM. First, each React component has its own unique functionalities, making it versatile and flexible, allowing users to implement them in different ways inside a project. Second, DOM manipulation is imperative to modern web development. Having a virtual DOM meant that developers no longer need to refresh pages whenever UI elements change, and React uses this to improve memory and efficiency.
| Avantages | Inconvénients |
|---|---|
| Easy to learn | JSX syntax |
| Virtual DOM | Fast development pace |
| Reusable components | Poor documentation |
| One-way data flow | |
| SEO friendly | |
| Javascript library already available for use |
Nous avons décidé d'utiliser React, ce framework semble parfait pour notre utilisation car il est aussi très stable et rapide d'utilisation. De plus, la bibliothèque se démarque de ses concurrents par sa flexibilité et ses performances, en travaillant avec un DOM virtuel et en ne mettant à jour le rendu dans le navigateur qu'en cas de nécessité.
Il est facile à apprendre en raison de sa simplicité au niveau de la syntaxe et que nous avons eu une année complète d'apprentissage en Javascript.
Pour finir, son intégration pour le mobile est très rapide grâce à react native.
Angular is an open-source platform from Google used to build user interfaces (website front-end). Its main benefit was to transform HTML-based documents into responsive and dynamic content, allowing the existence of single-page applications. It is currently one of the most popular front-end web development frameworks used today.
Angular forms a part of the "MEAN stack" : a group of software development tools and frameworks (MongoDB, Express, Angular, Node.js) that cover major development aspects.
The basic building blocks of Angular is NGModules, providing all core functionalities for users while they develop their applications. These modules define the core of the applications. Angular also stands out for its two-way data binding, where any changes to the DOM is immediately reflected in the application and vice-versa. This means that developers are no longer required to reload the the page manually.
However, the framework is quite complex and requires a lot of time and dedication to understand or even use properly.
| Avantages | Inconvénients |
|---|---|
| Supported and maintained by Google | Complex |
| Job demand | Steep learning curve |
| Two-way data binding | Hierarchical tree-like architecture |
| Faster DOM Manipulation | Dependency Injection |
| Faster Server Performance | Performance Tradeoff |
| Ease of prototyping and iterative development support | Coupled to Javascript/Typescript |
| Super ease of testing front-end applications | Two-way data binding leading to performance issues |
| MVVM Architecture | Heavily weighted framework |
| Uses plain HTML templates | Conformity to the MEAN stack |
| Migration |
Vue.js is a progressive framework for building single-page applications. Developed for Javascript, it has been designed to be responsive and easy to use with other libraries focused on the view layer. The brainchild of Evan You, he initially developed the framework as a lightweight version of Angular, using the latter's best features such as data binding and making it less performance-heavy. At its core, Vue handles the UI of a website, but it can be used with other frameworks.
Vue is used by web developers to create user interfaces for web-based and hybrid mobile applications. It combines both React and Angular features, and brings it with simple, efficient design.
| Avantages | Inconvénients |
|---|---|
| Tools and Libraries | Language Barriers and Restricted Community |
| Low Storage Requirements | Oversaturates framework choice during development |
| Simple and easy to learn | Lack of support for large-scale projects |
| Extensive documentation | Limited Resources |
| Reactivity - two-way data binding | |
| Reusabiity | |
| Component-based Architecture | |
| Flexibility |
Bootstrap est une collection d'outils utiles à la création du design (graphisme, animation et interactions avec la page dans le navigateur, etc.) de sites et d'applications web. C'est un ensemble qui contient des codes HTML et CSS, des formulaires, boutons, outils de navigation et autres éléments interactifs, ainsi que des extensions JavaScript en option. C'est l'un des projets les plus populaires sur la plate-forme de gestion de développement GitHub.
| Avantages | Inconvénients |
|---|---|
Nous avons utilisé Tkinter qui est une librairie Python. Certains d'entre nous l'ont déja expérimenter et dans notre utilisation nous utilisons des librairies Python ce qui facilite l'intégration notamment nous utilisons Python pour récupérer les informations nécéssaire comme le pourcentage de RAM, CPU,... utilisé
Nous avons eu une autre alternative Kivy qui est aussi une librairie Python cependant le rendu des interfaces font assez ancien et minimaliste . Nous avons eu l'occasion de l'utiliser durant un cours de développement orienté Python.
| Avantages | Inconvénients |
|---|---|