React and React Native 2 in 1 Build Websites Mobile Apps

React and React Native 2 in 1 – Build Websites & Mobile Apps, available at $59.99, has an average rating of 4.15, with 115 lectures, based on 22 reviews, and has 369 subscribers.

You will learn about Learn to build web apps with react Learn to build mobile apps with react-native Learn to build API with NodeJs Learn react router v6 Learn to use SockerIO for building realtime apps Learn to build login/register/forgot and reset password system Learn Mongo database Learn to send emails using sendgrid Learn state management using react context Components based react project architecture Learn to use react hooks and create custom hooks Learn CRUD (create, read, update and delete) Learn to use responsive masonary layout Learn to use local storage Learn to write middlewares and protect routes Learn to secure pages from unauthorized users Learn to add searching/filtering Learn to add load more feature Learn to use expo to build react native apps Learn to see react native app preview in your phone and simulators Learn about react native components Learn to make HTTP (GET, POST, PUT, DELETE) requests to your own API Learn to use icons in react native Learn to use react navigation in react native apps Learn to protect screens from unauthorized users Learnt o use footer tab navigation Learn to add hundreds of real world features in react, react-native and NodeJs apps This course is ideal for individuals who are JavaScript developers looking to build web and mobile apps or JavaScript developers looking to build their own NodeJs API or JavaScript developers looking to learn how to integrate web and mobile apps with one API or JavaScript developers looking to gain more practical/coding knowledge in react, react-native and NodeJs It is particularly useful for JavaScript developers looking to build web and mobile apps or JavaScript developers looking to build their own NodeJs API or JavaScript developers looking to learn how to integrate web and mobile apps with one API or JavaScript developers looking to gain more practical/coding knowledge in react, react-native and NodeJs.

Enroll now: React and React Native 2 in 1 – Build Websites & Mobile Apps

Summary

Title: React and React Native 2 in 1 – Build Websites & Mobile Apps

Price: $59.99

Average Rating: 4.15

Number of Lectures: 115

Number of Published Lectures: 114

Number of Curriculum Items: 115

Number of Published Curriculum Objects: 114

Original Price: $199.99

Quality Status: approved

Status: Live

What You Will Learn

Learn to build web apps with react

Learn to build mobile apps with react-native

Learn to build API with NodeJs

Learn react router v6

Learn to use SockerIO for building realtime apps

Learn to build login/register/forgot and reset password system

Learn Mongo database

Learn to send emails using sendgrid

Learn state management using react context

Components based react project architecture

Learn to use react hooks and create custom hooks

Learn CRUD (create, read, update and delete)

Learn to use responsive masonary layout

Learn to use local storage

Learn to write middlewares and protect routes

Learn to secure pages from unauthorized users

Learn to add searching/filtering

Learn to add load more feature

Learn to use expo to build react native apps

Learn to see react native app preview in your phone and simulators

Learn about react native components

Learn to make HTTP (GET, POST, PUT, DELETE) requests to your own API

Learn to use icons in react native

Learn to use react navigation in react native apps

Learn to protect screens from unauthorized users

Learnt o use footer tab navigation

Learn to add hundreds of real world features in react, react-native and NodeJs apps

Who Should Attend

JavaScript developers looking to build web and mobile apps

JavaScript developers looking to build their own NodeJs API

JavaScript developers looking to learn how to integrate web and mobile apps with one API

JavaScript developers looking to gain more practical/coding knowledge in react, react-native and NodeJs

Target Audiences

JavaScript developers looking to build web and mobile apps

JavaScript developers looking to build their own NodeJs API

JavaScript developers looking to learn how to integrate web and mobile apps with one API

JavaScript developers looking to gain more practical/coding knowledge in react, react-native and NodeJs

In this course, you will learn to use React and React Native with NodeJs and MongoDB API to build applications for web browsers and native mobile apps for IOS and Android devices.

You will learn to build fully functioning app for web using react, react router v6, react hooks, react context and many other useful libraries from npm. You will also learn to build a complete login and registration system including password forgot and reset. You will learn to send emails, protect the pages from not logged in users and even learn to use SocketIo to make your application realtime.

You will also learn to build your own API (backend) using NodeJs and MongoDB. You will be able to save your users in the database, save the content they create in mongo database and also issue json web tokens to authenticate your users.

Finally you will learn to build a mobile app using react native, which will be able to run in both platforms, IOS and Android.

This course is your gateway to become a truly Fullstack Javascript developer. You will learn to use single backend to power multiple apps for the web browsers and mobile devices. The course is geared towards beginners so you can easily follow along with me. Every line of code is explained and the source code is provided for almost all lectures. Building a Fullstack project is more than coding. It’s a thought process. It’s the art of architecting a system that works seamlessly with all the moving parts that makes up a fully functioning project.

Take this course and turn yourself to an ultimate Javascript developer by mastering react, react native, NodeJs, MongoDB and the entire modern Javascript eco-system.

Course Curriculum

Chapter 1: Introduction

Lecture 1: Course introduction

Lecture 2: Are you ready for this course

Lecture 3: Download Source Code from Github

Chapter 2: React project with react router 6 and bootstrap

Lecture 1: Creating a new react project

Lecture 2: Creating pages and using bootstrap css

Lecture 3: Routing with react router v6

Lecture 4: Using bootstrap navigation with react router

Lecture 5: Creating a form and using vscode plugins

Chapter 3: Working with react hooks, components and creating pages for login/registration

Lecture 1: Using useState hook to add state to react components

Lecture 2: Reusable component and tabnine plugin

Lecture 3: Additional form fields and disabled button

Lecture 4: Confirming password and toast notifications

Lecture 5: Making HTTP request using axios

Chapter 4: Generate authentication server

Lecture 1: Auto generate NodeJs API with full authentication

Lecture 2: Server files and folders overview

Chapter 5: Mongo atlas, sendgrid, env and gitignore

Lecture 1: Signup to mongo atlas and get connection string

Lecture 2: Signup to Sendgrid, verify sender and get API key

Lecture 3: Env file, gitignore file and signup response

Chapter 6: State management, local storage, login response and navigation

Lecture 1: Global state management using context in react

Lecture 2: Adding register response to context

Lecture 3: Save and get data from local storage then redirect user with delay

Lecture 4: Creating signin page for users to login

Lecture 5: Reusable button component

Lecture 6: Showing loading image until response is received

Lecture 7: Conditional rendering of login and logout links

Lecture 8: Using bootstrap dropdown menu

Chapter 7: Forgot password, reset password

Lecture 1: Password forgot and reset explained

Lecture 2: Forgot password request and sending reset code to users email

Lecture 3: Allow user to reset password and using toaster component globally

Chapter 8: Protecting pages, routes, middlewares and axios configuration

Lecture 1: Protecting pages with react router private route

Lecture 2: Delay the redirect using setInterval

Lecture 3: Securing client routes by sending token in headers to server

Lecture 4: Auth check middleware to protect routes

Lecture 5: RequireSignin middleware

Lecture 6: Axios configuration and handling of auth error response

Lecture 7: Toaster config options and additional nav dropdown link

Chapter 9: Create task route, controllers, form, context and rendering tasks

Lecture 1: Task route, controller, schema and model

Lecture 2: Tasks page for creating new tasks

Lecture 3: Textarea for creating task and submitting to backend

Lecture 4: Saving task to database and populating response with user info

Lecture 5: Fetching all tasks from backend

Lecture 6: Create task context and move local state to context

Lecture 7: Code refactoring – Moving create task

Lecture 8: Creating task list component to render all tasks

Lecture 9: Date formatting with dayjs and styling task list

Chapter 10: Update and delete tasks and can update delete middleware

Lecture 1: Installing ant design and working on updating task

Lecture 2: Toggle the visibility of modal component

Lecture 3: Update form in modal component

Lecture 4: Showing logged-in users tasks differently than others

Lecture 5: Conditional update and delete buttons

Lecture 6: Task update and delete requests from client

Lecture 7: Can update and delete middleware in server

Lecture 8: Update and delete controller functions and trying them in client

Lecture 9: Number of tasks and some styling

Chapter 11: Load more, searching, custom hook and masonary layout style

Lecture 1: Tasks count and updating tasks controller to implement load more feature

Lecture 2: Trying load more function from client

Lecture 3: Continue working in load more button

Lecture 4: Custom styling textarea

Lecture 5: Tasks searching and filtering

Lecture 6: useSearch custom hook

Chapter 12: Realtime tasks using socketio

Lecture 1: SockerIO server setup

Lecture 2: Server client socket connection

Lecture 3: Emit socket event while creating a new task

Lecture 4: Realtime tasks using socket client and server

Lecture 5: Show task created minutes in realtime

Lecture 6: Code refactoring by using search bar component

Chapter 13: Starting with react native, expo, app preview and simulators

Lecture 1: Using masonary layout to display tasks

Lecture 2: Styling

Lecture 3: React native mobile apps

Lecture 4: A bit more talk on react native development

Lecture 5: Create react native project using expo

Lecture 6: IOS and android simulators

Lecture 7: How to preview your project in actual phone

Chapter 14: Native components, flexbox styling, webview and images

Lecture 1: Using native components

Lecture 2: Using flexbox for positioning elements on the screen

Lecture 3: React native components and props

Lecture 4: Using your own logo as splash screen

Lecture 5: Using webview to show existing web pages in app

Lecture 6: Signup screen and text styling

Lecture 7: Register screen with background image

Chapter 15: Native text input, scroll view and touchable opacity

Lecture 1: Using text input to receive user input

Lecture 2: Creating reusable input component

Lecture 3: Using keyboard aware scroll view

Lecture 4: Creating reusable button using touchable opacity

Lecture 5: Using state for storing user input

Instructors

Ryan Dhungel
Web Developer

Rating Distribution

1 stars: 2 votes

2 stars: 1 votes

3 stars: 2 votes

4 stars: 6 votes

5 stars: 11 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!