⏩ React Live: the interactive conference
Two weeks ago I attended the React Live conference; it’s one of the biggest React conferences in the Netherlands. Besides being a conference, Passionate People (the event organizers) tried to spice it up by adding live coding to their sessions.
“Most impressive Conference Venue I have ever been too” — Evan You
🔑 Key learnings
I usually write my conference blogs talk by talk, but since everyone is doing that, it’s quite annoying to read. I collected my key learnings below.
Theme UI
Build consistent; theme-able React apps based on constraint-based design principles.
This way of working allows you, your product team, and the UI/UX team to be consistent when making changes. You can define a theming object based on the rules that the UI/UX team gives you.
You can later use emotion (a CSS-in-JS library) in your components to read the object that you’ve defined.
You can also tokenize the above values, so they have a single source of truth.
Transform SVGs into React components
SVGR is an SVG to React transformer. The transformed SVG will be a simple React component that becomes highly configurable. SVGR is available as a module, webpack plugin or via CLI.
Framer motion
As an addition to the SVG part, you can use Framer X’s motion library to power your transformed SVG with fluid cross-device animations.
Infinite Red Ignite
Infinite Red has released a new version of their React Native boilerplate tooling called Ignite. Check it out, it’s incredible!
Besides Ignite, Infinite Red also offers a tool called ReactorTron: a desktop app for inspecting your React and React Native projects on macOS, Linux, and Windows.
Mobx state tree
An Opinionated, transactional, MobX powered state container. That is combining the best features of the immutable and mutable world for an optimal DX.
Besides MobX, Overmind was also mentioned as a proper state container https://overmindjs.org/
I don’t use MobX, but it was refreshing to see what’s possible
Next level NextJS 9
Tim did a live coding session with Zeit’s product NextJS. It was interesting to see what new features have been added since the time I first tried it (over a year ago). It now has zero-config TypeScript support, file-based dynamic routing, automatic static optimization, and many more features.
Fun fact: During the talks, we had WiFi problems, and as you can imagine, that’s not ideal for a live coding conference. 😅 Luckily they managed to fix it rather quickly by providing a UTP cable for the speakers. Shout out to the team!
Thank you for taking the time to read this story! If you enjoyed reading this story, clap for me by clicking the below so other people can see this here on Medium.
I work at Sytac.io; We are a consulting company in the Netherlands, we employ around ~100 developers across the country at A-grade companies like KLM, ING, ABN-AMRO, TMG, Ahold Delhaize, and KPMG. Together with the community, we run DevJam check it out and subscribe if you want to read more stories like this one. Alternatively, look at our job offers if you are seeking a great job!
