Try your hand at developing mobile apps with React Native!

" No to app programming that just starts and never finishes!!
I'm now an app developer with React Native !!!"

■ Lecture Introduction

● Section 0: Introduction to React Native and Setting Up a Development Environment

This section will introduce React Native and explain how to set up a development environment . React Native, a cross-platform framework for mobile apps, is designed to help you understand React Native in general, including how a single codebase can run apps on iOS and Android, and the prerequisite knowledge required for React Native development. We will also explain how to install programs and tools for React Native development . Setting up an environment for React Native development can be tricky. Since the versions of each program and tool are specified, you don't have to worry about compatibility issues. This section is designed to lower the hurdles for setting up the environment by installing them one by one.

● Section 1: Running the Simulator

This section explains how to run your development code on the Android Emulator and iOS Simulator . While React Native is a cross-platform framework, there are some differences in the style and characteristics of native components offered by iOS and Android. This section is designed to allow you to check the output screen rendered on various devices by running each simulator.

● Section 2: ECMAScript 6 (ES6)

This section will cover the basic grammar of ECMAScript 6 (ES6), the prerequisite knowledge for React Native development . This section focuses on the core concepts primarily used in React Native development, minimizing unnecessary learning and ensuring efficient prerequisite knowledge acquisition .

● Section 3: React

This course will cover the basic React grammar, essential for React Native development . This course will utilize React Native code to provide explanations, allowing you to become familiar with the language. Furthermore, this section focuses on the most essential aspects of React Native development, ensuring efficient learning .

● Section 4: React Native Component

This course will cover the fundamentals of React Native grammar . Learn the basics of using the various components that make up an app screen (View, Text, Button, Image, TextInput, etc.) and delve deeper into advanced screen rendering using combinations of these components . This section is designed to help you learn the basic grammar and advanced content needed to build a single screen.

● Section 5: React Navigation Ver. 5

This section will explain the basic syntax of React Navigation, a 3rd party library that helps with screen transitions . It will cover the most recent updated version 5, and you can learn about Stack Navigator (screen transition using buttons), Drawer Navigator (new windows that open on the left and right sides of the screen), Tab Navigator (screen transition using the Tab button), and Vector Icon (using various convenient pictograms). In addition, this section is designed to allow you to learn various and abundant screen transition methods through designing a screen tree structure (nesting navigator) through a combination of each navigator .

● Section 6: Phone Resource Utilization

This section explains how to utilize smartphone resources . To access device resources like contacts, camera, and gallery in an app, installation of additional third-party libraries is essential, and access permissions must be determined first. This section explores authorization methods for utilizing device resources based on iOS and Android security policies , and provides practical guidance on how to use smartphone resources through actual development .

● Section 7: Animation

This section explains how to add animation effects to shapes and text . React Native supports animation effects. This section covers not only effects like color, transparency, rotation, and movement , but also how to create diverse and rich visual effects through combinations of animation effects (interpolation, sequence, parallel) .

● Section 8: Good To Know Things

This course covers the advanced skills required for React Native development . Beginning with an introduction to the Debugger, essential for advanced coding, you'll learn how to create and use reusable components, and how to output different results for different platforms. This section aims to provide more advanced learning and acquire practical skills for real-world use .

● Section 9: Concluding the Lecture

We'll explain the journey after completing this course . This course covers the basics of React Native, but understanding the concepts of Redux and the backend is essential for actual app development and collaborative work in the field. A follow-up course is now open , where you'll learn Redux and develop an actual app through advanced coding! If you'd like to learn advanced topics like implementing a login process and receiving and outputting data from the server, please take the next course.

Are you curious about the knowledge sharer's follow-up lecture (advanced course)?

Practical React Native for iOS/Android App Development - Intermediate
Try your hand at mobile app development with React Native!

■ Course Features

● All the necessary prerequisite knowledge for React Native development is included in one lecture.

React Native development requires knowledge of ECMAScript 6 (ES6) and React , but only a small portion of that knowledge is actually utilized in React Native development. Studying everything without knowing what to learn is highly inefficient . Therefore, this course focuses on the core elements of React Native development . We hope you enjoy learning the fundamentals of React Native in a single lecture.

● Covers the basics of React Native

This course aims to teach you the fundamentals of React Native for mobile app front-end development . It provides detailed explanations to solidify your foundational knowledge , and includes supplementary explanations for any concepts that may be difficult to understand, even if they aren't React Native-specific. Even beginners to React Native will find it easy to understand.

● Covers React Navigation Ver. 5

This course covers the latest version of React Navigation, Version 5. Significant changes have occurred since the update from Version 4. This course is designed to help you learn the latest version of React Navigation by covering topics difficult to grasp through actual coding and reviewing the official documentation .

● Even non-majors can easily follow along

This course is designed to be easily followed by non-majors . Not only does it use a scripting language and API with a low barrier to entry, but it also carefully adjusts the difficulty and tempo of the coding process and explanations to ensure easy learning. We hope that even non-experts taking their first steps into the world of app development will find success as app developers through this course.

■ Note

● This course uses a Mac . Please set up a Mac environment.

● This course uses the React Native CLI . Expo CLI, an alternative to React Native CLI, may be easier for beginners, but it offers significantly less freedom in terms of development. Learn how to use React Native CLI to overcome its limitations.

(※ Please understand that responses to this lecture may be delayed due to circumstances of the knowledge sharer.)