TutorialsScreensCourses

Filter

Jason Brown
How to use a setState Updater Function with a Reducer Pattern

In this lesson we'll show how to create an updater function. We'll also dive into how to separate your state management logic into a separate reducer function much like how Redux operates. It will receive an action with a type, and any data and update state accordingly.

ReactRead more ⇨
Jason Brown
How to use a setState Updater Function with a Reducer Pattern

In this lesson we'll show how to create an updater function. We'll also dive into how to separate your state management logic into a separate reducer function much like how Redux operates. It will receive an action with a type, and any data and update state accordingly.

Jason Brown
Make a Beautiful Interactive Bitcoin Price Chart with React, D3, and VX

In this lesson we'll walk through building an interactive bitcoin price chart. We'll use React combined with VX to render our chart and tooltips. D3 will power all of the data processing to ensure everything is rendered where it should be. We'll also walk through explaining what scales, ranges, domains and bisectors are and how to use them.

Jason Brown
Make a Beautiful Interactive Bitcoin Price Chart with React, D3, and VX

In this lesson we'll walk through building an interactive bitcoin price chart. We'll use React combined with VX to render our chart and tooltips. D3 will power all of the data processing to ensure everything is rendered where it should be. We'll also walk through explaining what scales, ranges, domains and bisectors are and how to use them.

Jason Brown
Understanding setState in componentDidMount to Measure Elements Without Transient UI State

In this lesson we'll explore using setState to synchronously update in componentDidMount. This allows for us to use getBoundingClientRect or other synchronous UI calls and make changes to the UI without a transient UI state.

Jason Brown
Use Yarn Workspaces to Share Code with a create-react-app and create-react-native-app in a Monorepo

In this lesson we'll use yarn and yarn workspaces to create a monorepo that includes a web creat-react-app, a react-native app, and shared code. We'll use react-app-rewired and react-app-rewire-babel-loader to rewire the create-react-app configuration to allow babel to process the shared code from workspace. We'll also use crna-make-symlinks-for-yarn-workspaces and metro-bundler-config-yarn-workspaces to configure the react-native app to be able to find the shared code in the workspaces.

Jason Brown
Build a Reusable Scroll View Component with Animated scrollTo Abilities in React

We'll show how to build a reusable ScrollView and ScrollElement component without adding any additional DOM elements. We'll take advantage of React.cloneElement, React.Children.only,findDOMNode, and context to build a registry of scrollable elements in the list. Then we'll use ref on the ScrollView to expose a way to animate to any item at any scroll position in the list.

Jason Brown
Build a Reusable Scroll List Component with Animated scrollTo in React

We'll show how to build a reusable ScrollView and ScrollElement component without adding any additional DOM elements. We'll take advantage of React.cloneElement, React.Children.only,findDOMNode, and context to build a registry of scrollable elements in the list. Then we'll use ref on the ScrollView to expose a way to animate to any item at any scroll position in the list.

Jason Brown
Using Functions as Children and Render Props in React Components

We'll explore the concept behind child function components and how to add dynamic return values and hiding state management inside the component. Then we'll explore how to setup functional render props that allow for complex components with simple APIs. Finally we'll show how these 2 concepts can compose together like any other React component.

Jason Brown
Add Additional Properties to React Children Using React.cloneElement

We'll show how to modify the children prop with React.cloneElement. We'll add additional properties, and modify existing properties to enhance an element.

« Previous
3 of 4
Home