Join this weekly and get a Jexia invitation


| React Ninjas Newsletter - weekly newsletter for ReactJS engineers.

 

React Ninjas Newsletter

React Ninjas Newsletter

Weekly newsletter for ReactJS pros. Carefully curated by Astha from Jexia.


Fundamentals

What React does (and doesn't do)

6 minutes - React doesn’t do a whole lot.

React, Redux and the strategy pattern
Using the Strategy design pattern with maps instead of switch/case statements improves readability and modularity for your Redux reducers.

Accessible links and buttons with React

10 minutes - An age old problem of the web platform when it comes to accessibility has been to confuse links and buttons.

Beyond onClick: handling events in React

9 minutes - React makes handling events in a cross-browser compatible way easy by abstracting the underlying DOM mechanisms into a consistent framework API.

TDD in React: Red-Green-Refactor in no time
This post will guide you through TDD, discuss some of its benefits, and show you how to test-drive a React app in no time.

More fundamentals:

Real-world reports

How I write testable code

9 minutes - The single biggest thing that improved the quality of my designs was understanding how dependencies influence my ability to write tests.

Using PropTypes outside of React

4 minutes - In template literal components.

Apollo GraphQL without JavaScript

The N26 web platform is built on top of GraphQL. Our Express server exposes a GraphQL API that proxies internal REST endpoints.

ESLint configuration and best practices

11 minutes - How I setup ESLint in different scenarios. We'll start with a simple plain JavaScript project and then we'll deal with TypeScript, and also React.

Controlling Lottie Animation through gestures

7 minutes - As a developer, you have always been smitten by the beautiful animation concepts which designers put on their Dribble accounts for mobile apps and websites.

Why the TypeScript team uses Gatsby for its website

6 minutes - Discover why the TypeScript team uses Gatsby, and what constraints they use to make it work for their team.

More real-world reports:

Tutorials

Build a sticky navigation bar with React

6 minutes - It's a common animation that we see on a lot of websites: when the user scrolls, the navigation bar moves down with a cool animation effect.

Restorable randomness in a Redux app - Part 1

4 minutes - With restorable randomness in a Redux app, both the seed and the state of a pseudo-random number generator are saved and restored.

Create procedural clouds using Three.js sprites

5 minutes - Learn how to simulate a cloud on a Three.js Sprite using React-Three-Fiber.

'Render as you fetch' pattern in React with SWR

6 minutes - Start fetch the data you need, at the same time you start rendering the component using that data. This way you don't need to wait to render in the loading state to start fetching, called Fetch on Render, neither wait for fetching to finish to start rendering, called Fetch Then Render.

Building a component library with Docz and Lerna

10 minutes - Component libraries are all the rage these days, with many companies rolling out their own solutions or sticking to a bunch of open source alternatives.

'Build a QR-code block' series – Part 7: placeholder

7 minutes - In this seventh part, I do away with screencasting and work on improving the editor interaction with the QRCode block. Specifically, showing in the editor how the QRCode will look when published.

More tutorials:

Tools

Introducing Yarn 2

15 minutes - After exactly 365 days of very intensive development, I'm extremely happy to unveil the first stable release of Yarn 2.

Introducing Next.js 9.2

6 minutes - Next.js 9.2 introduces native support for CSS, aggressive code-splitting, catch-all dynamic routes, and more.

useTracker —React hooks for Meteor

5 minutes - There are exciting changes happening in React, and we wanted to update Meteor’s React integration to match that excitement.

DIY React popups with Popper.js 2

3 minutes - There is no contender when it comes to DOM positioning libraries — yet Popper.js 2 is relatively new and as of recent only available as a release candidate.

react-simple-infinite-loading v1 is out

4 minutes - react-simple-infinite-loading is a component that handles code complexity for you. It is a wrapper around three libraries from Brian Vaughn

More tooling:

Perspectives

Types can be like tests

2 minutes - This is sure to upset some people, but here goes: writing types can fulfill the same role as writing tests. Particularly tests in test-driven development. Let me explain.

Redux is half of a pattern (1/2)

15 minutes - Learn how state management libraries have one thing in common - they are all partial implementations of state machines.

React + Redux: performance considerations

3 minutes - When dispatching multiple actions.

Promise Lifting: A new async coding technique

6 minutes - Promise Lifting is an alternative technique to async/await.

Domain Modeling w/ tagged unions in GraphQL, ReasonML

A lot of value proposition arguments around GraphQL have been about over/under fetching, getting the data shape you ask for, etc. But I think GraphQL provides us more than that

Presentations

How to NOT render something in React

Duration: 20 minutes

About me and our project

I’m Andrés, a Mexican moved to the Netherlands to help building Jexia, a cloud hub providing a full-service serverless architecture.

With Jexia, a developer pays zero to eight euros per month to craft fully equipped applications. It would be awesome if you are able to test it yourself!

Product Pricing