Tech Talk - Explore Vue.js as a React Developer

Picking up a new framework or library can seem intimidating. React and Vue are two popular, well-supported tools for front-end development, and if you already know one, you can leverage your knowledge to become productive with the other relatively quickly.

Both are JavaScript-based, use a virtual DOM, and use composable, reactive components to build applications. They both have CLIs that take care of the boilerplate required to spin up an application quickly and easily. This lecture focuses on React developers learning Vue in mind, but if you are a Vue developer learning React, you are welcome. Practical differences between the two come down to syntax and knowing one of the two can be easily leveraged into learning the other.

By exploring two applications, one written in React and one written in Vue, that output identical content in the browser, compare how they accomplish the same goal.

Vue 3.0 makes it easier to make component logic available in different parts of your app. It’s a great improvement both from the developer and the client's perspective. And while it might be tricky and time-consuming for programmers to swiftly switch between the frameworks and technologies, Vue 3.0 addresses that issue very well, especially for React developers!

It’s always good to take a step outside of the “bubble” and see what the world has to offer.

Transcript

1. Explore Vue.js as a React developer September, 2021
2. Similar APIs help developers coming from “different worlds” to switch between the environments easily when needed
3. Developers were mainly debating whether they should be using Angular vs React
4. Over the course of the last couple of years, we’ve seen a new player called Vue.js
7. History
8. React is backed up by the Facebook, providing the stability and long-term support that a tech giant can provide.
9. React became open source in May 2013, that allowed its community to create countless third-party libraries
10. Vue.js was created by Evan You, a former Google employee. Vision to create a framework that combined the best of React, Ember and Angular
11. Idea to provide additional features and improve coding performance. It relies on its active community to push it forward
12. As an alternative to React or Angular, it has gained interest among front-end developers
13. Why are Vue.js and React so popular?
15. Low learning curve richer and richer ecosystem provides very powerful tooling including CLI, state management, and routing libraries
19. Innovative tools that both Vue.js and React offer to the Front-end Developer
20. Virtual DOM Component-based structure Official support to build mobile apps* * VueNative is a wrapper around ReactNative APIs
21. Libraries
22. Libraries to use in a Vue.js application Vuetify: to create complex UI elements Vuex: to manage application state Axios: to integrate with the REST API Vue Router: to update the UI when the URL changes
23. Libraries to use in a React application Material UI: to create complex UI elements Styled Components: to change the look & feel Redux: to manage application state Axios: to integrate with the REST API React Router: to update the UI when the URL changes
24. Drawbacks
26. Lack of official documentation - super-fast development of ReactJS leaves no place for the proper documentation
27. React is unopinionated - meaning that developers sometimes have too much choice;
28. More time to master which means that is required deep knowledge of how to integrate user interface into full framework
29. Companies that use ReactJS Facebook, Instagram, Netflix, New York Times, Yahoo, Khan Academy, Whatsapp, Codecademy, Dropbox, Airbnb, Asana, Atlassian, Intercom, Microsoft...
31. Lack of resources. Small market share in comparison with React or Angular. knowledge sharing in this framework is still in the beginning phase
32. Risk of over flexibility. Sometimes, Vue.js might have issues while integrating into huge projects and there is still no experience with possible solutions
33. Chinese background. As far as Vue.js has a bit of Chinese background, This leads to a partial complexity on some stages of development.
34. Companies that use Vue.js Xiaomi, Alibaba, Wizz Air, Euronews, Grammarly, and Laracasts, Adobe, Behance, Codeship, Reuters.
35. Summary
36. It really depends on the specific needs of your project.
37. For a real engineer, there is no substantial difference which framework to choose, because it just takes some time to get used to the new one.
38. Every framework has its own pros and cons, meaning that there should be just a right choice for every single case during the product development.
39. Q & A
40. HypeTech Tech education and shaping ideas into hype products hypetech.io | reactweek.dev Marko Arsić Founder and CEO @ HypeTech Founder of HypeTech Education Lecturer @ ReactWeek.dev Independent Tech Consultant Helping companies set up teams and standardize the development process github.com/marsicdev
41. As everything good in life, knowledge is great only when shared hypetech.io/education
42. contact@reactweek.dev