• Post category:StudyBullet-3
  • Reading time:8 mins read


Learn to build cross platform mobile applications with React Native CLI, React Hooks and Functional Components

What you will learn

React Native CLI

Build Cross Platform Mobile Applications

React methodology

Get and manage data from external API

Build a fully working iOS and Android Application

Use external packages like Video Player

Description

React Native is growing at a fast pace, while more and more companies of any size are adopting it to build cross platform applications with a single code base.

In this course we aim to teach React Native flow and its secrets by building a real world project where we aim to have a solid foundation into React Native framework as well React Hooks and Functional Components.

You will build a mobile application targeted for both iOS and Android environment while you learn the responsiveness of the style, navigation between screens and get and manage data from an external API.

In this course you will learn:

– Set up your machine environment for React Native CLI development

– Build cross platform applications with React Native CLI

– Navigate between screens

– Navigate to screens dynamically

– Use of The Movie Database API

– Add custom styles

– Component base development

– React Hooks

– Functional Components

– Get Movies by genre

– Lists

– Search Movie Method


Get Instant Notification of New Courses on our Telegram channel.


– Image Galleries

– Video Player and its commands

After this course you will be able to:

– Set up the system correctly

– Manage Errors a Debug React Native CLI applications

– Build applications from scratch

– Understand good architecture flow for an application

– Get data from the server using Axios

– Handle Data

– Display and render custom Lists

– Implement search methods

– Add external packages

– Tap in the native code of a iOS and Android application

We can’t wait to have you in board with us.

See you there!

English
language

Content

Getting Started
Introduction
Course Requirements
How to Use this Course
What is React Native?
Expo CLI or React Native CLI?
Installing Node – Version 12 and Above
Setting Up the Development Environment
Setting Up – Android
Setting Up – IOS
Code Editor
Installing Extensions for Rapid Coding
Create React Native Project
Running on iOS Simulator
Running on Android Emulator
Running on Your Mobile Device Using Vysor
Hello World App and Logging
Debugging with Chrome Browser
Debugging with VSCode
Start Building Our Movie APP
Getting Movies Data : API Overview
Creating Movies App Project
Create Movies Data Service
Display Movie Data
Important: Using Effects + Checking Performance
Services Error Handling
Refactoring
Section Code
Movies App Home
Creating Home Screen Component
Latest Movies Images Slider
Styling Movies Images Slider
Working with Movies Lists – Carousels
Create List Component
Create Card Component
Image Placeholder in Card Component
Type checking in React Native
Adding Scroll View to Scroll the Home Screen
Popular TV Shows – Family Movies – Documentaries
Refactoring
Add Loading Spinner
Add Error Component
Section Code
Movies App Navigation
Installing React Native Navigation
Creating a Stack Navigator
Navigate to Movies Detail Component
Section Code
Movie Detail
Movie Detail Overview
Pass Selected Movie Data to Detail Component
Movie Detail Service
Movie Title and Genres
Movie Star-Rating Component
Using Icons in React Native
If You Still Getting Error with Icon Fonts
Movie Description and Release Date
Movie Play Button
Video Player Modal
Play a Movie Within the Modal
Modal Closing Logic
Section Code
Navigation Bar
Add Navigation Bar in SafeAreaView
Home Screen Navigation
Refactoring
Section Code
Search Movie
Search Movies and TV’s Services
Search Movie Screen
Search Form
Search Results
Merging Movies and TV Search Results
Section Code
Final Touches
App Theming
Fix Styling
Section Code
Bonus
Bonus Lecture