Build Fullstack Mobile Apps using React Native and Node.js

Course overview - 113

• What is React Native?

• Installing React Native

• Setting up Android Emulator

• Setting up iOS Simulator

• Course Outline

• Section Introduction

• Structure of a React Native App

• React Native core components

• Styling React Native components

• Working with State

• Rendering Items

• Working with Props

• Section Introduction

• Layout with Flexbox

• Styling based on platform

• Creating the Card component

• Working with Images

• Using custom fonts

• Adding Icons

• Section Introduction

• Creating the required screens

• Setting up React Navigation

• Moving between screens

• Adding a tabs-bar navigation

• Working with drawer navigation

• Section Introduction

• What is Redux?

• Setting up Redux store

• Redux Reducers

• Redux Actions

• Making HTTP requests

• Dispatching Redux actions

• Displaying Items using FlatList

• Fixing the FlatList display

• React Native Debugger

• Add Items to favorites

• Dispatching Add to favorites action

• Toggling the Fav Icon

• Setting up the News Details screen

• Section Introduction

• Executing node scripts

• Node Module System

• Node File System

• Node Event module

• Creating a web server using the HTTP module

• Using NPM packages

• Section Introduction

• Building a web server using Express

• Using env variables

• Testing endpoints using Postman

• Route parameters

• Create a resource

• Update a resource

• Delete a resource

• Section Introduction

• Setting up MongoDB

• Connecting to MongoDB using mongoose

• MongoDB Compass

• Creating a schema

• Creating a model

• Creating a house listing data

• Adding validation

• Fetching data

• Updating data

• Deleting data

• Section Introduction

• Setting up the React Native app

• Setting up navigation

• Adding Tabs bar Icons

• Creating the card component

• Adding a floating action button

• Moving between screens

• Building out the Add Home screen

• Building out the home details screen

• Adding Redux to our app

• Adding Redux action and reducer

• Fetching the house listing data

• Displaying the data on the card

• Displaying the data on the homeDetails screen

• Create form using formik

• Adding validation using yup

• Create home action and reducer

• Dispatching the create home action

• Displaying a loading Icon

• Section Introduction

• Setting up the express app

• Adding a database system

• Registering a new user

• Adding validation

• Hashing password

• Login route

• Set up JWT

• Protecting a route

• Section Introduction

• Setting up the React Native App

• Adding navigation to the auth system

• Building out the login and register screens I

• Building out the Login and Register screens II

• Adding validation to the form

• Some changes on the backend

• Setup Redux

• Add actions and reducers

• Making a POST request to register a new user

• Making a POST request to login a user

• Displaying error messages from the backend

• Storing tokens using AsyncStorage

• Fetching tokens

• Decoding tokens using jwt-decode

• Section Introduction

• Preparing the backend for deployment

• Deploying the backend to Heroku

• Preparing the frontend for deployment

• Hints on deploying the React Native App