Welcome to the React Native Essentials workshop! This hands-on workshop will go through the fundamentals of React Native from “init-ing” our application to getting our app to looking good to digging into native libraries. It will wrap up with a discussion on more “intermediate” topics and address any questions the class may have. The objective of this workshop is to help React developers take the plunge into mobile and show the similarities between the two platforms.
Table of contents (subject to change):
- Getting Started
- Setting up the Environment
- Working with dependencies
- Application Architecture
- Looking Under the Hood
- Making Stuff Look Good (custom components, styling, and layout)
- Navigating the App
- Filling in the List (working with lists and api data)
- Responding to Touches (pressables and inputs)
- Wrap-up & Q&A
Table of Contents
- React Native Essentials
For the full instructions on how to setup your environment for React Native development, head on over to our React Native Essentials Starter Pack Environment Setup doc (be sure to also set up either your iOS Simulator and/or Android Emulator).
- Run the project setup script:
yarn setup- Start the metro bundler:
yarn start- Build in dev mode:
-
Android: by typing
ain metro, or in a new shell instance:yarn android
-
iOS: by typing
iin metro, or in a new shell instance:yarn ios
- Build for your device:
If you can't get this to work, see the Troubleshooting page.
To learn more about React Native, take a look at the following resources:
- React Native Website - learn more about React Native.
- Getting Started - an overview of React Native and how setup your environment.
- Learn the Basics - a guided tour of the React Native basics.
- Blog - read the latest official React Native Blog posts.
@facebook/react-native- the Open Source; GitHub repository for React Native.