https://github.com/gabrielduete/angular-vue-react
Angular/Vue/React - Comparation
https://github.com/gabrielduete/angular-vue-react
angular framework javascript javascript-library react reactnative vue
Last synced: 12 days ago
JSON representation
Angular/Vue/React - Comparation
- Host: GitHub
- URL: https://github.com/gabrielduete/angular-vue-react
- Owner: gabrielduete
- Created: 2023-03-29T23:11:12.000Z (about 3 years ago)
- Default Branch: master
- Last Pushed: 2023-05-09T02:33:30.000Z (about 3 years ago)
- Last Synced: 2026-04-08T03:41:48.572Z (about 1 month ago)
- Topics: angular, framework, javascript, javascript-library, react, reactnative, vue
- Language: JavaScript
- Homepage:
- Size: 765 KB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Angular - Vue - React
## This repository destinty to comparate Angular, Vue and React.
- [In the files i did a basic comparation to show an input to control a state that changes the text according to change the input. Also a simple creation of a component to work as props.](#code-preview-new-project-in-progress) [New project in progress]
- [In the README is where the comparison between Angular, React and Vue.](#basic-comparison-between-angular-vue-and-react)
# Basic comparison between Angular, Vue and React.
#### Comparisons were made on qualities and defects of each tool. Also some suggestions for when to use each one.
#### The repository was written based on the studies that were referenced at the end and my experience as a front react developer for 1 year.
# 
ngular
First front end framework - aiming to bring a robust experience, using js to manipulate the DOM
## Angular 1
| Benefits | Drawbacks |
| ------------------------------------------------- | -------------------------------------------------------------- |
| Maintained by google | Very heavy, the structure it is complex |
| Brought the idea of Two-Way Data Binding | Requires a lot of knowledge in class components and typescript |
| Relates well to fullstack projects (monorepo too) | |
### Angular 2+
It was rewritten from 0.
| Benefits | Drawbacks |
| ----------------------------------------------------------------------------------- | ----------------------------------------------- |
| Suitable for typescript usage | Very heavy, the structure it is complex |
| Much more performant than the 1 version | Quite bureaucratic to create solutions |
| Plenty of content in the community | Migration issues between Angular 1 to Angular 2 |
| Cosntant evolution | |
| Ensures that the project follows an architecture very similar to the other projects | |
### Suggestions when to use:
- Team fullstack
- Project complex and scalable
- Team with typescript experience
# 
ue
| Benefits | Drawbacks |
| ---------------------------------------- | -------------------------------------------------------------------------------------- |
| Simple learning | Quite new so the community is not that extensive |
| Lightweight bundle | People with experience in other frameworks may have a little more difficulty learning. |
| Simple codes and tools | Very flexible, it can bring problems such as code standardization. |
| Encourages a clean code | |
| Works well for developing small projects | |
| Helps with prioritization | |
### Suggestions when to use:
- Simple application with a short lead time
- Team with more juniors
- Want to structure a clean code pattern in the project with ease
# ⚛️ React
| Benefits | Drawbacks |
| --------------------------------------------------------------------------------- | --------------------------------------------------------------------------------- |
| Huge community, most used globally | As it gets longer, it becomes more complex to understand. |
| Lightweight bundle | Aworks well with Reduce, but adds more complexity to your code. |
| You can install just what you need | Because it is a lib, it ends up depending on other frameworks and design patterns |
| Works well with Redux | |
| Complex codes, requires more of the programmer to create and maintain the project | |
| Lightweight bundle | |
| Maintained by facebook | |
| Works well cross-platform app, SPA or mobile apps. | |
### Suggestions when to use:
- Want to work with compotenization
- Want to scale the project easily
- Must build a short or long project
# References:
#### PT-BR
- [REACT, VUE ou ANGULAR - Qual framework JavaScript escolheria hoje](https://youtu.be/L78ENSEHXLE)
- [Angular vs React vs Vue - A Batalha dos Frameworks!!!](https://youtu.be/VmmA5SFN2WM)
- [Angular vs React vs Vue - Qual deles é o melhor? | Aquino Explica](https://youtu.be/8-3ZOdp_ZDo)
- [React vs Angular vs Vue: Qual Framework Aprender em 2023](https://youtu.be/gTKHpxq8ISY)
- [Não tente aprender um framework antes de ver este vídeo. Angular, React, Vue, Laravel](https://youtu.be/VMwWUUYmyow)
- [O que é o Vue.js?](https://www.treinaweb.com.br/blog/o-que-e-o-vue-js)
#### EN
- [React vs Angular vs Vue.js — What Is the Best Choice in 2023?](https://www.techmagic.co/blog/reactjs-vs-angular-vs-vuejs/)
- [Vue vs React: What to choose in 2023?](https://digitalya.co/blog/vue-vs-react/)
- [Front-end development: What should I learn? React, Vue, Angular or Svelte?](https://www.linkedin.com/pulse/front-end-development-what-should-i-learn-react-vue-angular-slomska/)
# Code Preview [New project in progress]
## Angular
## Vue
## React
