# vczero/react-native-lesson

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/vczero-react-native-lesson).**

4,049 stars · 870 forks · HTML · MIT

## Links

- GitHub: https://github.com/vczero/react-native-lesson
- awesome-repositories: https://awesome-repositories.com/repository/vczero-react-native-lesson.md

## Description

This project is a cross-platform mobile framework tutorial and JavaScript mobile app curriculum designed to teach the development of iOS and Android applications. It provides a structured educational guide and a set of lessons covering project bootstrapping, state management, and declarative user interface structures.

The curriculum includes specific guides on mobile native bridge integration, providing tutorials on how to connect custom platform code to a cross-platform framework to access device-specific system APIs and hardware.

The course covers the implementation of responsive mobile user interfaces using a component-based architecture and the Flexbox layout model. It includes practical lessons on building common mobile UI patterns such as grid layouts and sliding carousels.

## Tags

### Education & Learning Resources

- [Cross-Platform Mobile App Tutorials](https://awesome-repositories.com/f/education-learning-resources/cross-platform-mobile-app-tutorials.md) — Provides a structured educational guide for building applications that target multiple mobile platforms using a JavaScript framework. ([source](https://github.com/vczero/react-native-lesson#readme))
- [Mobile Development Curricula](https://awesome-repositories.com/f/education-learning-resources/educational-apps/mobile-development-curricula.md) — Offers a structured curriculum for learning mobile app creation, including UI and state management.
- [Mobile UI Design Courses](https://awesome-repositories.com/f/education-learning-resources/mobile-development-courses/mobile-ui-design-courses.md) — Provides structured learning paths focused on creating responsive layouts and component-based user interfaces for mobile devices.

### Mobile Development

- [Cross-Platform Mobile Applications](https://awesome-repositories.com/f/mobile-development/cross-platform-mobile-applications.md) — Guides the development of cross-platform mobile applications using a single shared codebase.
- [Native API Bridges](https://awesome-repositories.com/f/mobile-development/android-ecosystem/android-platform-integrations/native-platform-access/native-api-bridges.md) — Explains the architecture for bridging shared codebases to platform-specific features.
- [Cross-Platform App Development](https://awesome-repositories.com/f/mobile-development/cross-platform-app-development.md) — Covers the domain of developing applications for mobile platforms from a single codebase.
- [Platform API Integrations](https://awesome-repositories.com/f/mobile-development/cross-platform-frameworks/flutter/native-integrations/platform-api-integrations.md) — Teaches how to connect custom platform code to the main application for system-level feature access. ([source](https://github.com/vczero/react-native-lesson#readme))
- [Curricula](https://awesome-repositories.com/f/mobile-development/mobile-project-bootstrapping/curricula.md) — Offers a comprehensive collection of lessons and code samples covering state management and declarative UI structures.
- [React Native Components](https://awesome-repositories.com/f/mobile-development/react-native-ecosystem/react-native-components.md) — Teaches the development of reusable UI elements specifically for the React Native ecosystem.

### Part of an Awesome List

- [Native Module Bridges](https://awesome-repositories.com/f/awesome-lists/devtools/native-integration/native-module-bridges.md) — Provides tutorials on bridging custom platform code to access system-level APIs and device hardware.
- [Learning Resources](https://awesome-repositories.com/f/awesome-lists/devtools/learning-resources.md) — Introductory lessons for getting started with the framework.

### Software Engineering & Architecture

- [Cross-Platform Abstraction Layers](https://awesome-repositories.com/f/software-engineering-architecture/cross-platform-abstraction-layers.md) — Provides an abstraction layer allowing a single JavaScript source to target multiple mobile operating systems.

### Web Development

- [UI Component Patterns](https://awesome-repositories.com/f/web-development/component-based-architectures/component-based-architectures/mobile-component-architectures/ui-component-patterns.md) — Teaches the organization of user interfaces into reusable building blocks that manage internal state and logic.
- [Declarative UI Composition](https://awesome-repositories.com/f/web-development/declarative-ui-composition.md) — Teaches the definition of user interfaces as a tree of components that update automatically based on state.

### User Interface & Experience

- [Flexbox Layout Engines](https://awesome-repositories.com/f/user-interface-experience/flexbox-layout-engines.md) — Utilizes a Flexbox layout engine to calculate element positions and sizes for responsive interfaces.
- [Flexbox Layout Models](https://awesome-repositories.com/f/user-interface-experience/flexbox-layout-models.md) — Demonstrates how to arrange components using a flexible box model for consistent spacing and alignment. ([source](http://vczero.github.io/react_native/%E7%AC%AC2%E7%AF%87%E8%AE%A4%E8%AF%86%E4%BB%A3%E7%A0%81%E7%BB%93%E6%9E%84.html))
- [Flexbox Layouts](https://awesome-repositories.com/f/user-interface-experience/flexbox-layouts.md) — Implements flexible container layouts to ensure interfaces adapt to varying screen dimensions.
- [Responsive Mobile Layouts](https://awesome-repositories.com/f/user-interface-experience/interface-consistency-utilities/native-mobile-design-systems/responsive-mobile-layouts.md) — Teaches design techniques for creating mobile user interfaces that adapt to various screen sizes. ([source](https://github.com/vczero/react-native-lesson#readme))
- [Mobile Interface Layouts](https://awesome-repositories.com/f/user-interface-experience/mobile-interface-layouts.md) — Teaches standard patterns and components for constructing user interfaces optimized for mobile screens.
- [JSON Message Bus Bridges](https://awesome-repositories.com/f/user-interface-experience/native-rendering-bridges/json-message-bus-bridges.md) — Explains how UI updates are serialized over a JSON message bus to a native host for rendering.
