React Newsletter #49

How Airtable uses React, Top 6 Reasons Why We Love React, and Why TDD’ing your frontend feels pointless


Articles

How Airtable uses React

In early 2015, Airtable had just launched publicly and released its iOS app. After a long product sprint in preparation for the launch and release, their engineering team finally had the opportunity to take a step back and try out new frameworks and tools as a foundation for our next phases of work. These are their thoughts on jumping to React.

Top 6 Reasons Why We Love React

The front end team at Syncano recently switched to React. Here's why they love it.

Page object for testing React.js components

In this article Boris (who is quite possibly a cat) will tell you a little trick how to make your test code a bit fancier and easier to maintain known as the PageObject pattern. The PageObject pattern is quite common in Selenium testing world, but it can be also useful when you are writing unit tests on every single UI-Component.

Why TDD’ing your frontend feels pointless

TDD (Test Driven Development) is a practice where you write tests for a feature that doesn't exist yet, and then build the feature to make the tests pass. In a lot of ways it is a clean and organized way to create features. TDD can be tricky on the frontend because there are a lot of nuances involved with creating client side applications. Emil Ong talks about why TDD feels pointless on the frontend, and what to do about it.


Tutorials

State-Driven Routing with React, Redux, Selectors

Routing is complex. There are a lot of disparate pieces that come together to give users the ability to navigate a site. There is the address bar ui element which displays a url string on screen. There is back/forward functionality accessible through buttons, keyboard shortcuts or other input methods. There are links which navigate to new content in various ways. There is url input through the address bar.

Baz talks about simplifying the process in what he calls State-driven routing.


Projects

Props-Provider

The PropsProvider component primarily allows components to defer rendering details to their children. This allows for a higher degree of component reuse when those aspects are not intrinsically tied to each other.

Desklamp

Clean routing and state container for React.

React-synthesis

A modern CMF running React, Node and Mongo that is extensible and easily approachable.


made with ❤️ by ui.dev