BT

Facilitating the Spread of Knowledge and Innovation in Professional Software Development

Write for InfoQ

Topics

Choose your language

InfoQ Homepage News React Conf 2018 Introduces React Hooks and React 16.7 Alpha

React Conf 2018 Introduces React Hooks and React 16.7 Alpha

This item in japanese

Bookmarks

The recent React Conf 2018 includes the alpha release of React 16.7, a "Hooks "proposal which would allow developers to use state and other React features without writing classes, and several promising third-party React packages.

The biggest news at React Conf was the new proposal for Hooks, which strives to solve several problems in React:

  • Difficulty in reusing stateful logic between components
  • Complex components become difficult to understand
  • Classes confuse both people and machines

The React team believes that classes are the most significant barrier to learning React because many engineers do not understand how `this` works in JavaScript, as it is very different from other languages. The current distinction between function and class components within React and when to use each leads to disagreements between experienced React developers.

React is not removing classes, but instead offering Hooks which work with existing code to encourage gradual adoption.

It is easy to try Hooks in CodeSandbox, and there's a new UseHooks website with a daily example of Hooks.

Also at React Conf, Microsoft software engineer Chris Trevino spoke about "The Missing Abstraction of Charting" and introduced chart-parts, an open source project providing a flexible, React-friendly, grammar of graphics for data visualization. The source code structure is not specific to React and could also provide a foundation for other charting and data visualization implementations.

SVG is becoming increasingly popular in a virtual DOM world. Beyond charts and data visualization, software engineer Elizabet Oliveira introduced techniques for providing SVG illustrations as React components. She also shared react-kawaii, an example collection of open source illustrations provided as React components.

TypeScript support for React continues to improve, including the announcement that the next release of create-react-app includes a flag to generate a TypeScript version of the application source code.

Another announcement at React Conf was RouteQL, an open source library for back-end agnostic, GraphQL style colocation of data requests in React.

RouteQL takes the idea of expressive colocated querying data from the frontend in tools like GraphQL (we even use the graphql query structure and parser) and the idea of a Query component or routeql higher order component from tools like Apollo and applies them to make these queries backend agnostic. RouteQL transforms queries into route requests, allowing you to use props to determine route and query parameters.

To use the alpha release of React 16.7, install it with yarn:

yarn add react@next react-dom@next

Videos from all of the React Conf 2018 sessions are now available, including the React Today and Tomorrow and 90% Cleaner React video which introduces the motivation behind React Hooks.

Rate this Article

Adoption
Style

BT