Jump into React-
Native 1/6
Waqqas Jabbar
25th June 2018
Course Completion Criteria
At the end of the course
1. Complete the TODO App with all the functionality (Atleast one platform)
2. Pass the test at the end of the course
Ask questions any time
Workshop style - Do actual work here
Why React-Native?
TODO App - Features
1. Register a new user
2. See a list of tasks
3. Add a new task
4. Mark the task as completed
5. Delete a task
6. Update user’s settings
Patterns
● Directory Structure
● Authentication
● Redux, Redux-Sagas
TODO App - Screens
● Splash Screen
● Register Screen
● Task List Screen
● Add Task Screen
● Task Detail Screen
● Settings Screen
What we will learn today
1. Setting up the development environment
2. Create a new project
3. Run the project
4. Add project in Git
5. Basics of React.js and React-Native
1- Development Environment Setup
- Windows 10
- Ubuntu 18.04
- MAC High Sierra
2- Project Creation and Walkthrough
JavaScript ES6
Flow
Searching packages
Adding a package
React-Native init
Add to Git
Directory walkthrough, bundler
File walkthrough
Debugging
React.js Basics
React.js Basic
https://reactjs.org/
● States
● Props
● JSX
Reading
Git
● https://git-scm.com/book/en/v2/Getting-Started-Git-Basics
● https://datasift.github.io/gitflow/IntroducingGitFlow.html
React.js
1. https://reactjs.org/docs/hello-world.html Go through “Main Concepts” section
Reference
Introduction to React-Native
https://www.slideshare.net/waqqasjabbar/introduction-to-react-native-97361657
Finding packages: https://js.coach/

Jump into React-Native (Class 1)