Fundamentals of React Native Video

React Native Video is a community supported video element for React Native. It allows for remote loading of videos and also works with the React Native asset management system to load videos. Having a flexible video component is essential to developing and enhancing your application.

Like many React Native elements, the video element is very basic and doesn't ship with anything besides a flexible API. This allows you to develop the exact layout, controls, and custom overlays to match your application.

In this course we'll take a look at a basic setup. Then explore the different ways we can load and show videos. We'll show how to use a few of the custom callbacks to overlay errors and buffering elements. Because there are no controls shipped with react-native-video we'll show how to write custom video controls and animate them when the video has not been interacted with.

Finally we'll cover a few common paradigms found in the wild. Including repeating background cover videos, auto-playing videos when they scroll onto the screen and auto-stopping them when they are scrolled away from.

AuthorJason Brown
Start the Course
Fundamentals of React Native Video
8 Lessons
Setup React Native Video for iOS and Android
Use Local Files or Remote Video Files with React Native Video
Show An Error Message When A Video Fails to Load in React Native
Show an Animated Buffering Icon When Remote Videos are Loading in React Native
Create a Looping Background Video with React Native Video
Create a Video that Auto Plays when Scrolled into View in React Native
Create Custom Controls for React Native Video
Create Controls that Hide/Show When Video Is Interacted With in React Native