Developing TV Apps with React-TV

TVs usually have limited graphics acceleration, single core CPUs and high memory usage for a common TV App. These restrictions make super responsive 60fps experiences especially tricky. React-TV is an ecosystem for React Applications on TVs. Includes a Renderer and a CLI tool for building applications. Focused on be a better tool for building and …

Learn React Fundamentals and Advanced Patterns

Kent C. Dodds – whom you should follow on Twitter – has released two massive video courses on Egghead. Course one touches React Fundamentals: This course is for React newbies and those looking to get a better understanding of React fundamentals. With a focus on React fundamentals, you’ll come out of this course knowing what …

React Pattern: Centralized PropTypes

Cory House: In real apps with large objects, using PropTypes quickly leads to a lot of code. That’s a problem, because in React, you’ll often pass the same object to multiple components. Repeating these details in multiple component files breaks the DRY principle (don’t repeat yourself). Repeating yourself creates a maintenance problem. The solution? Centralize …

Easier imports with Webpack’s resolve.alias

One of the things I find annoying when using import in my JS code is the fact that you need to refer to other local files using (relative) paths. Like so: // Without resolve.alias 😭 import Modal from ‘../../../components/objects/modal/modal’; Having a background in PHP – where you have include paths and autoloaders – I essentially …

Inspecting Redux Stores in Production, without the Redux Devtools

Checking out the Redux Store of Soundcloud Redux Back in the day I learnt a lot by hitting CTRL+U (View Source) on websites. Nowadays I still check the source code of some apps, yet it’s become a tad more difficult for some specific things. When it comes to React apps that use Redux I like …

Optimize React Performance

Good advice every React dev should be aware of: React is known to be blazingly fast with its Virtual DOM implementation. However, even with React’s built-in performance, there are instances when the UI can begin to feel sluggish. The primary culprit for poor performance is generating too many renders and reconciliations. We’ll cover 4 techniques …

Never Write Another HOC, use a render Prop

Michael Jackson on stepping away from HOCs, and using a render Prop instead. instead of “mixing in” or decorating a component to share behavior, just render a regular component with a function prop that it can use to share some state with you. He start with this HOC: import React from 'react' import ReactDOM from …

Leveraging New Features of React 16

Earlier this week React 16 got released … yay! 🎉 To explain all the new features, Nik Graf has posted a short series on React 16 over at Egghead. The videos are free to watch and only take up 17 minutes of your time. Next to things like Fiber, Error Boundaries, and Returning arrays from …

Playing with React VR

The folks at Hashrocket have a nice introductory writeup on getting started with the aforementioned React VR. So if you’ve been doing React or React Native for the past months, you’ll see that React VR is super simple to get started and will let you build exciting 360 experiences. Starting from the default React VR …