This is a fast-paced course to get you started building mobile applications for Android and iOS using React Native.
Introduction
- Introduce React Native/s Architecture
- Understand key inner workings
- Discuss Native Modules and View Managers
- Understand implications on threading
- Setting up projects using React Native CLI
- Understand the role of Metro
- Setting up projects using Expo
- Developing Using Emulators/Simulators and real devices
- Debugging expo Applications (including react native debugger)
Core Components
- Understand the relation between React components and native views
- Introduce View components
- Understand styling in React Native (and the differences with CSS)
- Appreciate and use the flex-layout
- Building responsive UIs (Detecting and adapting to dimensions, orientation, device type/model etc.)
- Best practices for working with colours and themes (including dark settings)
- Working with safe areas
- Working with Images (sources, resizing, caching, optimisation)
- Adding and styling Text
- Accepting touch gestures using Touchable components
- Introduce the Pressable API
- Using scrollable and list components (e.g., FlatList, SectionList)
- Using list component features (separators, headers/footers, refreshing, infinite scroll, …)
- Use and explore other Core components
Animations
- Understand the core Animated architecture
- Using native animations
- Using animatable components
- Discuss animation best practices
- Understand and configure different types of animations (e.g., timed, spring, …)
- Use easing functions
- Composing animations
- Appreciate and apply Interpolation and Extrapolation
- Using Events with animations
Gestures
- Discuss various gestures types (e.g, tap, pan, pinch)
- Understand and use React Native Gesture Responder System
- Introduce the react-native-gesture-handler library
- Discuss the different gesture handlers
- Using the PanGestureHandler
- List and use various gesture components (e.g, Swipeable, FlatList, …)
Navigation
- Introduce the react-navigation library
- Discuss and use various navigation techniques (stack, tabs, drawer, …)
- Using react-navigation with TypeScript
- Nesting navigators
- Configure navigators and screens
- Tune tab navigation layout (icons, headers, buttons, etc.)
- Using the Imperative navigation API
- Using Params
Accessing back-end services
- Recap using Axios and Apisauce to access backends
- Authentication and Authorisation (using JWT)
- Offline authentication
Local Storage and caching
- Changing application behaviour based on network status
- Discuss storage techniques
- Using the key-value AsyncStorage
- Accessing the file system to store/cache files
- Downloading/uploading files
