A GraphQL client without queries, how to test custom React hooks, and more...

дата:

#181 — March 25, 2020

Read on the Web
React Status
Your weekly React news digest, every Wednesday

gqless: A GraphQL Client without Queries? — The ambitious idea is for you to 'forget you're using GraphQL'. Instead, you use the attributes of the underlying data in your views and queries are automatically generated to suit. An interesting approach at the least. GitHub repo.

Sam Denty

How to Test Custom React Hooks — If you've begun writing your own custom hooks and want to build confidence that they'll work as expected, you want to get started testing it properly. Kent works through how to go about it.

Kent C Dodds

Powerful, Ready-To-Use Data Table to Help Build Your App Fast — Tired of sweating over that Data Table? The KendoReact professional Data Table is one of the fastest, chock-full of features, and backed by a legendary support Data Table for React. Check it out today.

Progress KendoReact sponsor

Redux Toolkit 1.3: An Official, Opinionated Toolkit for Redux Development — Formerly known as Redux Starter Kit, Redux Toolkit helps you out of the boilerplate and setup quagmire that can blight heavy Redux usage. v1.3 adds two new APIs: createEntityAdapter to help manage normalized state, and createAsyncThunk to abstract common data fetching behavior. Learn more in this release post.

Redux

Airbnb Transfers Ownership of Enzyme, Its React Testing Library — Enzyme is a React component testing utility originally built by Airbnb, but ownership has now been passed on to the broader community. This post shows off what Enzyme is about and puts out a call for help for the project.

Bruno Couriol (InfoQ)

Babel 7.9.0 Released — A new minor release for the popular JavaScript compiler which includes updates related to @babel/preset-env, TypeScript 3.8, Flow, and JSX:

"We also worked with the React team to provide a new JSX transform, which will make it possible for React and React-like libraries to further optimize the creation of JSX elements with the addition of the jsx function vs. React.createElement."

Nicolò Ribaudo, member of the Babel team.

💻 Jobs

Find a Dev Job Through Vettery — Vettery is completely free for job seekers. Make a profile, name your salary, and connect with hiring managers from top employers.

Vettery

React + Rails Experts — Join Our Bootsrapped Remote Team — Aha! is primarily a Rails application, but we are using React to make excellent interactive experiences on top of Rails.

Aha!

📘 Tutorials and Stories

How to Create a Summer Road Trip Mapping App with Gatsby and Leaflet — A very optimistic title, here! But Colby's fingers are crossed we'll be back on the road for summer and this is a well put together, easily accessible tutorial. There's also a seven minute screencast to go along with it.

Colby Fayock

Embracing Modern Image Formats: Leveraging Webp in HTML and React — A thorough look at how using next-gen image formats along with the <picture> element can reduce image sizes dramatically.

Josh W Comeau

Building Chat With React? Stream Chat Has You Covered — Have a look at our interactive chat tutorial in React and learn how to build with Stream Chat.

Stream sponsor

Creating Sortable Tables with React — There's a lot to moving parts to deal with if you have a table of data and you want to make it dynamic with a columnar sorting feature. Leaning on a third party library is one option, but what if you want to do it by hand? A solid tutorial, as you'd expect from Smashing Magazine. End result demo / code.

Kristofer Giltvedt Selbekk

10 JavaScript Things New React Devs Need to Know — Very much beginner level only, things like filter, fat arrows, and the ternary operator.

Craig Oda

Five Practical Tips When Using React Hooks in Production

Tobias Deekens

🔧 Code and Tools

Evergreen: A React UI Framework — Polished React components from buttons and text inputs to menus, side sheets and tables. We first linked this back in 2018 but it has seen some updates this year.

Segment

Motion Layout: Create Immersive Animations using Shared Components — The idea is that you can link components together to animate them when changing views. GitHub repo.

Jefferson Licet

React Data Grid: An Excel-Like Data Grid Component — Efficient and performant through 'smart windowing' of data. You can view and edit cells using a wide range of formatters and editors. Full keyboard navigation support too. v7.0 is in alpha. GitHub repo.

Adazzle

Faster CI/CD for All Your Software Projects Using Buildkite

Buildkite sponsor

React Images 1.1: A Lightbox Component for Displaying Images

Joss Mackison

React-Mouse-Blur: A Component to Introduce Cursor Motion Blur — I'm scratching my head at the "why?" on this but.. maybe it's an effect you would desire for some reason.

Etesam Ansari

react-redux-firebase 3.3.0: Redux Bindings for Firebase — Supports Real Time Database, Firestore, and Storage.

Scott Prue

Комментарии

Отправить комментарий