In this lesson we'll show how to setup a nested validation structure using the
yup library. We'll then use the
yup.lazy method to evaluate the
value at runtime and adjust our validation schema. We'll make our nested validation optional only if our
optionalObject actually exists.
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.
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
bisectors are and how to use them.
Youtube has a unique video playing experience. It allows you to drag a video to the corner of the screen which continues to play. You can then navigate through the site and select other videos. Additionally if you want to drag it back up you can drag back to the video you were viewing.
We'll build out a map with
react-native-maps and custom animated map makers. We'll construct an a scroll view that when scrolled will animate the marker that it is associated with. Once scrolling has stopped we will animate the map region and focus on the marker we are looking at.
We'll use a single
Animated.Value and use and explain
interpolate in depth. We'll also show how to use
extrapolate: "clamp" to lock our
We'll show how to build a reusable
ScrollElement component without adding any additional DOM elements. We'll take advantage of
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.
We'll explore how to use various
Animated apis including
Animated.delay to build a notification that fades and slides in and out.
We'll learn about using a
ref and the
measure function to get the dimensions of a particular view. Additionally we'll show how to use the
measure function in conjunction with the
componentDidUpdate callback on
We'll explain using
translateY and to move views around performantly.
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.
The Yellow warning box in React Native can be both helpful and annoying. There are many errors that can be ignored but end up blocking necessary pieces of the application.The Yellow warning box in React Native can be both helpful and annoying. There are many errors that can be ignored but end up blocking necessary pieces of the application.
The iOS AsyncStorage implementation has an unlimited amount of space by default. This is not the case on Android, the default size of AsyncStorage is 6MB. This is generally enough for a casual application however there are many cases when you may need more, like when you are using PouchDB async adapter.