Mobile and Web Development with React and React Native

Oak Academy

• Let`s Start to Learn React JS 1:12:35

  • 1: Project Files and Course Documents 01:00
  • 2: Your First App Overview 11:06
  • 3: Frequently Asked Questions 09:19
  • 4: Let, Const and Var in 3 minutes 03:53
  • 5: Install Node JS 05:26
  • 6: Create Your React App 05:36
  • 7: Why You Will Need To Create a React App_ 06:27
  • 8: Start Creating React App 06:24
  • 9: Do You Want to Learn How To Stop React App_ 05:18
  • 10: Important Functional Components 15:06
  • 11: FAQ about Full Stack Web Development with React, React native, Angular 03:00

• What is this JSX? 30:40

  • 12: Converting HTML JSX 06:02
  • 13: Inline Styling with JSX in React JS 10:54
  • 14: JavaScript Variable in JSX 12:44
  • 15: quiz 01:00

• React with Props 1:10:08

  • 16: Three Tenets of Components 03:34
  • 17: Simple App with React 02:55
  • 18: Styling App with Semantic UI 08:35
  • 19: Building Component 03:57
  • 20: Specifying The Image in React JS 03:19
  • 21: Duplicating The Single Component 01:59
  • 22: Component Nesting 12:06
  • 23: Props System 04:11
  • 24: Passing Props to Child 13:03
  • 25: Reusable Component Overview 02:47
  • 26: Props Children 12:42
  • 27: Quiz 01:00

• Class-Based Components 30:58

  • 28: Class-Based Components and Functional Component 05:49
  • 29: New App Overview 08:43
  • 30: Getting Users Physical Location 07:58
  • 31: Handling Async Operation in React 03:35
  • 32: Transformation Functional Component to Class Based Component 04:53

• State in React 35:53

  • 33: State Rules 04:19
  • 34: Initializing State In Constructor 13:49
  • 35: Lifecycle Method Overview 12:26
  • 36: Conditional Rendering 05:19

• Lifecycle Methods 53:49

  • 37: Get to Know Lifecycle Method 12:55
  • 38: Refactoring App with Lifecycle Method 03:08
  • 39: Passing State As Props 04:27
  • 40: Ternary Expressions in JSX 05:49
  • 41: Showing Picture 06:34
  • 42: Styling The App 10:12
  • 43: Free React Developer Tools 03:49
  • 44: General App Review 06:55

• User Inputs, Forms and Events in React JS 54:07

  • 45: App Overview 02:43
  • 46: Component Design 03:03
  • 47: Handling Forms 08:31
  • 48: Styling The App 03:22
  • 49: Creating Event Handlers 06:16
  • 50: Controlled vs Uncontrolled Elements 04:41
  • 51: Why Controlled Elements 07:40
  • 52: Understanding ‘this’ Key Word In JS 10:06
  • 53: Communicating Child to Parent 03:02
  • 54: Invoking Callbacks in Children 04:43

• API Request with React 35:00

  • 55: Fetching Data 03:50
  • 56: Axios vs Fetch 03:45
  • 57: Async Await Function 10:07
  • 58: Setting The State 03:23
  • 59: Rendering A List of Components 05:15
  • 60: Implementing The Key Values In List 04:35
  • 61: What We Have Learned From The App 04:05

• Navigation with React Router 56:50

  • 62: Initializing The Project 03:13
  • 63: The React Router 21:09
  • 64: Link and Nav Links 06:06
  • 65: Programmatic Redirects 07:21
  • 66: Route Parameters 15:07
  • 67: React Router Switch Tag 03:54

• React Portals 23:20

  • 68: Why React Portals_ 08:49
  • 69: How To Create A Modal_ 07:38
  • 70: Creating a React Portals 06:53

• Let's meet Hooks and Context 03:23

  • 71: Context and Hooks 03:23

• Create Application 1:02:40

  • 72: Let's Start Building Application 11:30
  • 73: Why Context API 06:40
  • 74: Context Provider 08:06
  • 75: Context Provider-2 06:06
  • 76: Lets Reach Out The Context State 10:21
  • 77: Consuming Data in TodoList Component 05:30
  • 78: Context Consumer 07:22
  • 79: Update The Context Data 07:05

• Multiple Context Usage 18:26

  • 80: Create Multiple Context 09:26
  • 81: Use Multiple Context Inside One Component 09:00

• Introduction to React Hooks 04:01

  • 82: Hooks 04:01

• Create Application 1:00:45

  • 83: Let's Start Creating The App 03:51
  • 84: UseState Hook 13:25
  • 85: UseState With Forms 13:28
  • 86: useEffect hook 09:36
  • 87: useContext hook 08:50
  • 88: Create multiple context with useContext 05:51
  • 89: Create context with functional component 05:44

• Hooks & Context 34:13

  • 90: Hooks and Context 10:22
  • 91: Let's add new todo with Hooks and Context 14:28
  • 92: Let's remove todo from context 09:23

• Get to Know the UseReducer Hook 24:21

  • 93: useReducer hook 06:07
  • 94: Let's implement useReducer 13:13
  • 95: Reducer component structure 05:01

• React native, React js, React, Mobile and web development with react js, angular 28:32

  • 96: Free Tools For Windows 07:25
  • 97: Windows Setup for React Native 05:33
  • 98: How To Start Emulator in Android Studio 15:34

• Setup For OSX 12:46

  • 99: Free Tools for IOS 04:47
  • 100: OSX Setup for React Native 04:46
  • 101: Start The Emulator 03:13

• React Native and JSX 1:03:05

  • 102: How To Create An App 02:51
  • 103: See Content On Emulator 03:52
  • 104: Why Do We Need React and React-Native 03:50
  • 105: Es6 Syntax ( Let, Const, Var) 05:34
  • 106: First Component 08:41
  • 107: How To Show Component On Device 10:26
  • 108: How to Build Our First App 06:46
  • 109: How to Connect a Component To The Root Component 12:08
  • 110: Import a Component to Another Component 08:57

• Styling For React Native 45:13

  • 111: Styling with JSX 13:44
  • 112: Displaying Views 10:45
  • 113: Header Component’s Styling 04:18
  • 114: React Props 07:55
  • 115: How to Reuse Code With Props System 08:31

• API Request With React Native 26:17

  • 116: How To Show a List To The User 06:59
  • 117: The List Component 08:34
  • 118: Func Component vs Class Based Component 10:44

• LifeCycle Methods in React js and react native 26:00

  • 119: When Do We Need Lifecycle Methods 09:32
  • 120: Lifecycle Methods 06:33
  • 121: Making Request With Axios 09:55

• State In React Native 1:23:38

  • 122: What Is State and How To Initial State 08:44
  • 123: Using of State 10:33
  • 124: A Component’s Lifecycle With State 05:01
  • 125: List Component 08:24
  • 126: List Item Component 10:14
  • 127: Reusable Components 06:28
  • 128: Styled Component for List Items 05:19
  • 129: Usage of Props.Children 05:46
  • 130: Item Section 09:18
  • 131: Introduction to the Flexbox 06:47
  • 132: Section Header Component 06:04
  • 133: quiz 01:00

• Layout With Flexbox 45:49

  • 134: How to Show An Image 12:46
  • 135: Scrollable Content 05:23
  • 136: User Interaction with ReactNative 09:44
  • 137: Event Handlers 13:13
  • 138: How to Open Another App (Browser) 04:43

• React Native and Expo 09:04

  • 139: React Native on Mobile Device 02:18
  • 140: Expo CLI project 06:46

• Router Expo CLI Project 22:31

  • 141: Router Expo CLI Project 02:50
  • 142: See The Content On A Device or Emulator 05:12
  • 143: What Is Router And Installation 04:38
  • 144: Setting up a Router in Project 09:51

• Flatlist in React Native 36:47

  • 145: Flatlist 06:12
  • 146: Rendering A List With FlatList 08:09
  • 147: How Does FlatList Work 06:21
  • 148: Giving the Key Prop 08:42
  • 149: FlatList Props 07:23

• Route Different Screens in React Native 36:59

  • 150: Book Detail Screen 06:21
  • 151: Navigate Between Screens 12:13
  • 152: Navigating from a Child Component 05:26
  • 153: Navigation Function 05:46
  • 154: Data Transfer Between Screens 07:13

Welcome to Mobile and Web Development with React and React Native!

This course is your complete guide to building modern web applications and mobile apps using React JS, React Native, React Router, Hooks, and Context API. Whether you’re starting from scratch or looking to level up your development skills, this course will take you step by step from beginner to advanced, with hands-on projects that mirror real-world applications.

Why This Course Stands Out:

• Learn React and React Native together—build websites and mobile apps using the same framework.

• Master modern React features like Hooks and Context API for efficient state management.

• Build reusable components and responsive interfaces for web and mobile platforms.

• Gain practical experience with React Router, navigation, and API integration.

• Use free tools and platforms, including Expo, to run your apps on simulators or real devices.

What You’ll Learn:

• The fundamentals of React: JSX, components, props, and state.

• How to navigate your apps with React Router and React Navigation.

• Creating reusable UI components for multiple projects.

• Managing state efficiently using Hooks (useState, useEffect, useReducer, useContext).

• Using Context API to handle global app state without extra libraries.

• Sending HTTP requests to fetch or post data to APIs.

• Building fully functional mobile apps with React Native.

Hands-On Projects Include:

1. First React App – Set up your environment and create your first interactive app.

2. Navigation Project – Implement routing and screen transitions like a pro.

3. Hooks & Context App – Learn advanced state management techniques.

4. Full Mobile App – Build a complete mobile app using both react-native-cli and expo-cli.

By the end of this course, you’ll have the confidence and skills to create modern web applications, cross-platform mobile apps, and reusable components, and you’ll understand how to leverage Hooks and Context API to simplify your development workflow.

• Beginner who wants to be React developer
• Anyone who has basic HTML, CSS and JavaScript knowledge and wants to learn how to create complex applications
• Anyone planning a job transformation and wants to become a React developer
• Anyone who wants to build amazing React single page web applications
• Anyone who wants to create mobile applications for both Android and IOS
• People who are planning a career in the application world
• Developers who have researched React but have had trouble mastering some concepts
• Anyone who want to start from scratch and to move more advanced level
• People who to become web developer
• People who to become mobile developer
• People who to become front end web developer
• People who to become backend web developer
• People who to become full stack web developer
• People who to become web developement with react, react native
• People who to learn full stack web development
• People who to learn full stack web development or mobile app development

• No prior knowledge is required! about react, react native web development or mobile development
• A Windows PC, Mac or Linux Computer
• JavaScript + HTML + CSS fundamentals are absolutely required but you don’t need to be an expert
• Desire to learn React
• Nothing else! It’s just you, your computer and your ambition to get started today
• Desire to learn React or React JS
• Desire to learn web development with react, or react js
• Desire to learn mobile development with react native, redux, hooks and context
• Desire to learn full stack web development with react, react native
• Desire to learn React js
• Desire to learn React js, typescript

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