Skip to content

React Native From Scratch with Hooks and Context

Learn React Native with Hooks and Context and leverage your existing web skills. Build user-friendly web apps with React


Oak Academy

Summary

Price
£18 inc VAT
Study method
Online, On Demand What's this?
Duration
10.3 hours · Self-paced
Qualification
No formal qualification
Certificates
  • Reed courses certificate of completion - Free

Overview

Hello there,

Welcome to React Native From Scratch with Hooks and Context course.
Learn React Native with Hooks and Context and leverage your existing web skills. Build user-friendly web apps with React

  • Do you wanna learn coding techniques to make efficient development with React?

  • Do you want to learn to build fast, user-friendly web apps with React? Then you are at the right place.

React-Native is a library developed by the react native team and it is widely used to create mobile applications for both Android and IOS. You do not need to learn Java, Android, Swift, Objective-C, or anything of that. React is all you need to create awesome mobile apps that work on both Android and iOS.
React Native enables programmers to write true native apps in JavaScript across multiple platforms at once, eliminating the need to code for iOS and Android separately. React Native also includes features like “hot reloading,” which have made the framework a favorite among efficiency-minded developers.

In the react native from scratch course, we are going to tell you what dependencies you need to install and how in detail, to be able to create mobile apps on both MAC and Windows. We are going to use free tools and platforms so you don't have to buy any tool or app. You are going to learn how to run an Android and IOS simulator on your MAC or Windows computer.

Later on the react native app course, we are going to learn the basics of React and React Navigation. JSX, 'props system' and 'state system' are going to be crystal clear for you at the end of the course. You are going to learn the latest React features "Hooks and Context" system.

We are going to create two nice looking app, will guide you to learn "Hooks and Context" in a very detailed way. You are going to learn how to use "state" in functional components with the "Hooks" system and with "Context API" you won't need any third-party package to manage the Application state.

We tried to tell all complex topics in very detail on the react hooks course. We used some diagrams to tell some important topics and created a nice-looking mobile application. expo

At the end of the course;

  • Basics of React, React-Native, React-Navigation libraries

  • How to send an HTTP request from a mobile application

  • How to use flex-box system

  • How to create reusable components

  • To reach another app on the device from our app

  • Creating your own mobile app both with react-native-cli and expo-cli

  • Creating Context with Class Based and Functional Components

  • How to Consume Context in Class Based and Functional Components

  • How to Use Multiple Context in one single component

  • Hooks Functions(useState, useEffect, useReducer, useContext...)

  • Creating Reducer and

  • Using Reducer is going to be clear for you.

  • react native hooks

  • react native web

  • react native expo

  • react native context

  • learn react native from scratch

  • react native redux

  • react native for web

  • "react native"

  • reactnative cli

  • react native with hooks

  • react hook

  • react native hook

  • react native hooks and context

  • react native web app

  • react and react native

  • react native typescript

  • react context

  • react native scratch

  • react native native

  • react native firebase

  • react and reactnative

  • react mobile

  • reactive native

  • react.js

  • reactnative codepush

  • mobile react native

  • react hooks postgresql

  • reaxt native

  • redux toolkit

It doesn't need any prior knowledge to learn it and the React is easy to understand for the beginners.

This course starts with very basics. First, you will learn how to install the tools, some terminology. Then the show will start and you will learn everything with hands-on practices. I'll also teach you the best practices and shortcuts.

Step-by-Step Way, Simple and Easy With Exercises

By the end of the course, you’ll have a firm understanding of the React and valuable insights on how things work under the hood and you'll also be very confident in the basics of coding and game development, and hungry to learn more. The good news is since the Free and popular tools are used you don’t need to buy any tool or application.

Video and Audio Production Quality

All our videos are created/produced as high-quality video and audio to provide you the best learning experience.

You will be,

  • Seeing clearly

  • Hearing clearly

  • Moving through the course without distractions

You'll also get:

Lifetime Access to The Course

Fast & Friendly Support in the Q&A section

Dive in now to our React Native From Scratch with Hooks and Context course

We offer full support, answering any questions.

See you in the React Native From Scratch with Hooks and Context course!

Curriculum

20
sections
89
lectures
10h 19m
total
    • 1: How Will We Progress in This React Native Course 04:42
    • 2: Got Any Questions 01:43
    • 3: Tools We Need for ReactNative CLI 07:25
    • 4: Windows Setup for React Native 05:33
    • 5: How to Start Emulator in Android Studio 15:34
    • 6: Tools We Need for ReactNative CLI 04:47
    • 7: OSX Setup of React Native 04:46
    • 8: Start The Emulator 03:13
    • 9: React Native on Mobile Device 02:18
    • 10: Expo CLI project 06:46
    • 11: How To Create an App 02:51
    • 12: See Content on Emulator 03:52
    • 13: Why Do We Need React and React-Native 03:50
    • 14: ES6 Syntax ( Let, Const, Var ) 05:34
    • 15: First Component 08:41
    • 16: How to Show Component on Device 10:26
    • 17: How to Build Our First App 06:46
    • 18: How to Connect a Component to the Root Component 12:08
    • 19: Import a Component to Another Component 08:57
    • 20: quiz 01:00
    • 21: Styling with JSX 13:44
    • 22: Displaying of Views 10:45
    • 23: Header Component’s Styling 04:18
    • 24: React Props 07:55
    • 25: How to Reuse Code with Props System 08:31
    • 26: quiz 01:00
    • 27: How to Show a List to the User 06:59
    • 28: The List Component 08:34
    • 29: Func Component vs Class Based Component 10:44
    • 30: When Do We Need Lifecycle Methods 09:59
    • 31: Lifecycle Methods 08:12
    • 32: Making Request With Axios 09:55
    • 33: quiz 01:00
    • 34: What Is State and How To Initial State 08:44
    • 35: Using of State 11:07
    • 36: A Component’s Lifecycle with State 04:58
    • 37: List Component 08:23
    • 38: ListItem Component 10:14
    • 39: Reusable Components 06:28
    • 40: Styled Component for ListItems 05:19
    • 41: Usage of Props.children 05:46
    • 42: ItemSection 09:18
    • 43: quiz 01:00
    • 44: Introduction to the Flexbox 06:47
    • 45: Section Header Component 06:04
    • 46: How to Show an Image 12:46
    • 47: Scrollable Content 05:23
    • 48: User Interaction with React Native 09:44
    • 49: Event Handlers 13:13
    • 50: How to Open Another App (Browser) 04:43
    • 51: quiz 01:00
    • 52: Let's See What We Will Cover in Hooks and Context 02:35
    • 53: Intro to Hooks and Context 03:45
    • 54: Let's Create First Application 14:43
    • 55: What Is Context API and Why We Use It 06:07
    • 56: Context and Provider 08:36
    • 57: Context Provider 05:21
    • 58: Accessing Context 11:43
    • 59: Let's Access Context Data from TodoList Component 05:23
    • 60: Accessing Context with Context Consumer 07:25
    • 61: quiz 01:00
    • 62: Updating Context Data 08:32
    • 63: Creating Multiple Contexts 09:11
    • 64: quiz 01:00
    • 65: Consume Multiple Context 10:06
    • 66: quiz 01:00
    • 67: Intro to Hooks 04:00
    • 68: Let's Setup Hooks Project 04:38
    • 69: Flatlist 03:54
    • 70: Rendering a List with Flatlist 08:53
    • 71: How Does Flatlist Work 06:14
    • 72: Giving the Key Props 08:07
    • 73: quiz 01:00
    • 74: useState Hooks 13:35
    • 75: useState with Forms 15:38
    • 76: useEffect Hook 10:43
    • 77: Hooks with Context 08:57
    • 78: Consuming Multiple Context with useContext 05:52
    • 79: quiz 01:00
    • 80: Creating Context with Functional Components 05:48
    • 81: Hooks and Context 12:51
    • 82: Adding New Todo with Hooks and Context 15:53
    • 83: quiz 01:00
    • 84: Remove Todo 09:16
    • 85: useReducers 06:12
    • 86: Adding a Reducer 13:17
    • 87: Move useReducer Into Its Own File 04:48
    • 88: quiz 01:00
    • 89: What We Have Learnt in React Native From Scratch with Hooks and Context Cou 05:54

Course media

Description

Hello there,

Welcome to React Native From Scratch with Hooks and Context course.
Learn React Native with Hooks and Context and leverage your existing web skills. Build user-friendly web apps with React

  • Do you wanna learn coding techniques to make efficient development with React?

  • Do you want to learn to build fast, user-friendly web apps with React? Then you are at the right place.

React-Native is a library developed by the react native team and it is widely used to create mobile applications for both Android and IOS. You do not need to learn Java, Android, Swift, Objective-C, or anything of that. React is all you need to create awesome mobile apps that work on both Android and iOS.
React Native enables programmers to write true native apps in JavaScript across multiple platforms at once, eliminating the need to code for iOS and Android separately. React Native also includes features like “hot reloading,” which have made the framework a favorite among efficiency-minded developers.

This reactnative course is for all levels. To be able to take this course, all you need is a basic understanding of JavaScript.

In the react native from scratch course, we are going to tell you what dependencies you need to install and how in detail, to be able to create mobile apps on both MAC and Windows. We are going to use free tools and platforms so you don't have to buy any tool or app. You are going to learn how to run an Android and IOS simulator on your MAC or Windows computer.

Later on the react native app course, we are going to learn the basics of React and React Navigation. JSX, 'props system' and 'state system' are going to be crystal clear for you at the end of the course. You are going to learn the latest React features "Hooks and Context" system.

We are going to create two nice looking app, will guide you to learn "Hooks and Context" in a very detailed way. You are going to learn how to use "state" in functional components with the "Hooks" system and with "Context API" you won't need any third-party package to manage the Application state.

We tried to tell all complex topics in very detail on the react hooks course. We used some diagrams to tell some important topics and created a nice-looking mobile application. expo

At the end of the course;

  • Basics of React, React-Native, React-Navigation libraries

  • How to send an HTTP request from a mobile application

  • How to use flex-box system

  • How to create reusable components

  • To reach another app on the device from our app

  • Creating your own mobile app both with react-native-cli and expo-cli

  • Creating Context with Class Based and Functional Components

  • How to Consume Context in Class Based and Functional Components

  • How to Use Multiple Context in one single component

  • Hooks Functions(useState, useEffect, useReducer, useContext...)

  • Creating Reducer and

  • Using Reducer is going to be clear for you.

  • react native hooks

  • react native web

  • react native expo

  • react native context

  • learn react native from scratch

  • react native redux

  • react native for web

  • "react native"

  • reactnative cli

  • react native with hooks

  • react hook

  • react native hook

  • react native hooks and context

  • react native web app

  • react and react native

  • react native typescript

  • react context

  • react native scratch

  • react native native

  • react native firebase

  • react and reactnative

  • react mobile

  • reactive native

  • react.js

  • reactnative codepush

  • mobile react native

  • react hooks postgresql

  • reaxt native

  • redux toolkit

    What is React Native?

    Created by Facebook, React Native is an open-source-based mobile application framework that uses only JavaScript, making it capable of supporting both Android and iOS platforms. React, also known as React.js, saves time and effort for developers since they only need one programming language. The Native element allows developers to create JavaScript components to design software programs that run on various devices and platforms, such as smartphones, smart TVs, and laptops. With React Native, developers use the same concepts used in the original React framework to design a rich mobile user interface (UI) for various environments from existing components.

    What is React?

    React is a front-end library in Javascript that was developed by Facebook. The simplest definition of React is that it is a user interface library used for building UI components for the web. But if that was all React did, it would be little more than a template library. Developers define components in React by using an HTML-like syntax called JSX. These encapsulated components manage their own state, making it simple to pass rich data to a component and keep the state of the application and its components out of the Document Object Model (DOM). These features give React components the ability to react dynamically and efficiently to changes in their state. A set of simple components in React can be composed into either simple single-page applications or large, complex web applications.

    What careers use React Native?

    Businesses that want to create mobile apps for iOS and Android simultaneously to ensure a seamless rollout need developers with a background in React Native. Careers in mobile app development that rely on React Native can count on professionals who can design and build stunning UIs in multiple platforms since it works hand-in-hand with platforms like Windows and tvOS. React Native developers are also vital to helping iOS, and Android companies update and otherwise modernize their apps with features like push notifications and animation for better effectiveness for mobile app subscribers. Developers with a background in React Native might work in full-stack development, designing and refining web-based games, websites, mobile apps, and more.

    What is the difference between React Native and Google Flutter?

    Google Flutter offers developers a UI toolkit that has some similarities to React Native. Flutter also has a native component and compiles web, mobile, and desktop applications from a single collection of source codes. Relying on existing code, Flutter is also a free and open-source framework for developers. Until this point, the two frameworks might sound similar. However, React Native is based on and only uses JavaScript, while Flutter only has a loose connection to the language. Google Flutter primarily uses a new language called Dart. Other differences between the two involve sourcing the tool itself and the installation process, setup and configuration, UI component and development, and community support.

Video and Audio Production Quality

All our videos are created/produced as high-quality video and audio to provide you the best learning experience.

You will be,

  • Seeing clearly

  • Hearing clearly

  • Moving through the course without distractions

You'll also get:

Lifetime Access to The Course

Fast & Friendly Support in the Q&A section

Dive in now to our React Native From Scratch with Hooks and Context course

We offer full support, answering any questions.

See you in the React Native From Scratch with Hooks and Context course!

Who is this course for?

  • Programmers who want to learn React, React-Native and Hooks and Context
  • Someone who has basic HTML, CSS and JavaScript knowledge and wants to learn how to create complex applications
  • Anyone who wants to create mobile applications for both Android and IOS
  • Anyone who wants to create mobile applications with both react-native-cli and Expo-cli
  • Anyone who wants to learn latest React features "Hooks and Context" system
  • Anyone who wants to learn React Hooks & Class-based Components
  • Anyone who wants to create mobile applications with both react-native-cli and expo-cli
  • People who are planning a career in the react native application world
  • Anyone planning a job transformation and wants to become a React developer
  • Anyone who want to take their web development skills to the next level and learn a future-proof technology
  • Developers with a background in React Native might work in full-stack development, designing and refining web-based games, websites, mobile apps, and more.

Requirements

  • No prior React and React-Native knowledge, you learn complete react native
  • JavaScript + HTML + CSS fundamentals are absolutely required but you don't need to be an expert
  • Basic ES6 knowledge would be beneficial but not required
  • A computer with access to the internet
  • Nothing else! It’s just you, your computer and your ambition to get started today,
  • Desire to learn React Native
  • Desire to learn mobile development with full React Native course
  • Desire to learn react native hooks, react native context, react native cli, react native expo
  • Desire to learn mobile app development

Questions and answers

Currently there are no Q&As for this course. Be the first to ask a question.

Certificates

Reed courses certificate of completion

Digital certificate - Included

Will be downloadable when all lectures have been completed

Reviews

Currently there are no reviews for this course. Be the first to leave a review.

FAQs

Study method describes the format in which the course will be delivered. At Reed Courses, courses are delivered in a number of ways, including online courses, where the course content can be accessed online remotely, and classroom courses, where courses are delivered in person at a classroom venue.

CPD stands for Continuing Professional Development. If you work in certain professions or for certain companies, your employer may require you to complete a number of CPD hours or points, per year. You can find a range of CPD courses on Reed Courses, many of which can be completed online.

A regulated qualification is delivered by a learning institution which is regulated by a government body. In England, the government body which regulates courses is Ofqual. Ofqual regulated qualifications sit on the Regulated Qualifications Framework (RQF), which can help students understand how different qualifications in different fields compare to each other. The framework also helps students to understand what qualifications they need to progress towards a higher learning goal, such as a university degree or equivalent higher education award.

An endorsed course is a skills based course which has been checked over and approved by an independent awarding body. Endorsed courses are not regulated so do not result in a qualification - however, the student can usually purchase a certificate showing the awarding body's logo if they wish. Certain awarding bodies - such as Quality Licence Scheme and TQUK - have developed endorsement schemes as a way to help students select the best skills based courses for them.