I didn’t learn React because it is popular. No, I didn't just take a deep dive into Context, React.memo, and Hooks because companies are only hiring engineers with React experience. Angular engineers are in high demand. The Angular community is very strong. I found out in 2020 it is possible to tweet you are available for an Angular gig and someone may tweet back. The next day I found myself being onboarded 100% remote on an Angular project. I didn't just learn about React because I think it's fast or even sustainable front end solution. To the contrary, I've heard plenty of my engineer friends grumble over the performance of their poorly architected React applications.
Nope, I didn’t learn React to watch Dan Abramov start arguments with engineers on Twitter. So why did I just choose to switch to React after several years developing with Angular?
Eventually React became more interesting when the library could work seamlessly with ES2015 modules. You could extend from React.Component and use TypeScript. Th I did find that React's Virtual DOM was performant, however took issue when they had to create a whole other standard to make it work: JSX. Another framework was released that promised to be closer to the features in ES2015 I wanted to explore and potentially be able to deliver even more performance gains.
Angular 2.0.0 was released. The way Angular applications are coded with TypeScript really appealed to me. The architect and performance junkie in me loved how that framework is so methodical, predictable, and when used responsibly, fast. So blazingly fast that I could reliably animate SVG by manipulating attributes through one-way data binding in Angular.
I was coding a waveform monitor that needed to animate bezier curves while WebGL was rendering beneath it. The results with Angular were faster than any other library I tried. Angular would animate the SVG at ~60fps, faster than even d3. Angular has solid rendering performance, sustainable patterns for development, excellent tooling, a fantastic community. Why would I need anything else? I can't speak enough about how welcoming the Angular community has been, by far the greatest group of engineers I've had a chance to hang out with post college.
I spent a few years honing my skills with Angular while React grew in popularity. Around the time React engineers were refactoring their applications to use Context, I would be grumbling at all the experts and their blog posts that extolled the virtues of React by making false comparisons to Angular. For example, bloggers will tell you Angular is slower because of two-way data binding, however Angular prefers unidirectional data flow. The default when binding to DOM attributes in Angular is actually one-way.
I already understand the performance implications of global state with Redux and the pitfalls of prop drilling, even to be aware that Context may cause superfluous rerenders. I just lack some of the practical day-to-day knowledge having been invested in other frameworks and libraries.
The past couple weeks I coded some simple React applications from scratch. No tutorial, just doing. Sometimes I reference documentation or open source code examples. Over the next month I plan on scaling one of this applications while keeping it performant, using the usual bag of tricks I have accumulated from other enterprise grade web applications.
I started out with create-react-app, but became largely underwhelmed by the experience. It's 2020 and I want to be using the fastest tooling for building React. I also don't want to be monkeying around with Webpack when I am experimenting with building React. I ended up bootstrapping some starter code using Parcel, a build tool that is fast and has zero configuration.
Earlier this week I published some React starter code built with Parcel on Github. In a minimal amount of time I was able to get the following features baked into the starter repo.
- ✅ TypeScript
- ☄️ Server Side Rendering
- ⚡️ Hot Module Replacement
- ⛱ Lazyloading
- 🧪 Unit Tests
- 📖 Storybook
- 👄 SASS
- 🏝 PostCSS
- 💇♂️ Prettier
- 🌎 i18n
The speed I was able to bake all these features into a custom repo speaks volumes to the versatility of the React ecosystem.
I feel much more comfortable now that I know how everything is built and configured. I can experiment and learn how to integrate Redux from scratch, build out a library of components with Storybook, or even learn some of the pitfalls of server-side rendering React right out of the gate. I could have done these things with create-react-app, but if I just read a tutorial and integrated some of these features by copying and pasting I wouldn't have really learned anything. I learn by doing.
Even though I have some reservations with learning React at this point in time, I am willing to put those aside so I can excel at my next job. I could have accepted a job offer where I led a team of Angular engineers, but right now I feel like I need to learn something new.
During the next few months I may share some revelations. I really look forward to becoming a part of the React community. I hope to see you at a meetup or conference in 2020!
Do you have any tips for someone getting started with React in 2020? If you have any feedback for my first React starter repo, please share.