Mobile App Development
Mobile App Development with React Native
Build high-performance iOS and Android apps using JavaScript and React! This hands-on, project-based course by Madras Academy is designed to help developers master React Native—Facebook’s powerful cross-platform mobile framework. From beginners to experienced React developers, this course empowers you to create scalable, production-ready apps using the latest tools, best practices, and real-world projects.
Shreelakshmi
- (4.8)
- 15
- 1 hour per day
- 25
This professional training program helps web developers and tech teams transition into mobile development using React Native. The course is structured around weekly modules with real-world apps and a final capstone project for hands-on experience.
You’ll explore everything from React Native fundamentals to advanced integrations with Firebase and native device APIs. With strong TypeScript support, modern navigation patterns, Redux Toolkit for state management, and performance optimizations, you’ll gain end-to-end experience building mobile applications that are fast, flexible, and user-friendly.
What Will You Learn?
The course covers core React Native fundamentals, TypeScript integration, modern navigation patterns, and multi-screen workflows. You’ll also learn state management using Redux Toolkit, Firebase features like Auth, Firestore, and Push Notifications, along with performance optimization techniques, native device access, and debugging.
Requirements
This course is for developers with a foundational understanding of JavaScript looking to expand into mobile app development. Whether you’re a web developer exploring cross-platform capabilities or a React developer aiming to build apps for iOS and Android, this course provides the structured learning path and real-world experience needed to succeed. No prior mobile experience is required.
Week 1: React Native Fundamentals
What is React Native? Benefits & limitations, setting up the development environment using Expo CLI & Bare Workflow, understanding components, JSX, and styling, layout with Flexbox, using ScrollView and FlatList, creating custom UI, and learning State and Props. Mini project: “To-Do App”.
Week 2: Navigation & Hooks
Implement navigation using React Navigation v6+, including Stack, Tab, and Drawer navigators. Learn about deep linking, passing parameters, screen lifecycle, and core React Hooks like useState, useEffect, useRef, and useCallback. Mini project: “Multi-screen Quiz App”.
Week 3: TypeScript in React Native
Understand the benefits of TypeScript, how to set it up in React Native, and how to type components, hooks, props, and navigation. Learn to work with APIs and manage async data. Refactor previous app to TypeScript.
Week 4: Styled Components & Custom UI
Explore the basics of styled-components, using ThemeProvider for theming, implementing responsive design and conditional styling, and building a reusable design system. Project: “Styled Product Catalogue”.
Week 5: State Management with Redux Toolkit
Learn Redux concepts like Store, Actions, Reducers, and Middleware. Dive into Redux Toolkit using createSlice and configureStore. Handle API calls using async thunks, and integrate Redux with Hooks and TypeScript. Project: “Expense Tracker with Redux Toolkit”.
Week 6: Firebase Integration
Set up Firebase Authentication (email/password and Google), perform Firestore CRUD operations, use Firebase Storage for files and images, and implement push notifications using Expo and Firebase Messaging. Project: “Social Feed App with Firebase”.
Week 7: Advanced Concepts
Compare Context API vs Redux, set up deep linking and dynamic routes, implement code splitting and lazy loading, build offline-first experiences using AsyncStorage and SQLite, and handle forms with Formik and Yup. Upgrade the social feed app with offline support.
Week 8: Performance Optimization & Debugging
Debug React Native apps using Flipper, React DevTools, and Chrome. Identify and fix performance bottlenecks like unnecessary re-renders, optimize FlatList usage, and use performance hooks like useMemo, useCallback, and memo. Learn image optimization, code splitting, and the Hermes engine. Audit and optimize previous projects.
Capstone Project (Week 9–10): “Team Collaboration App”
Build a team collaboration app featuring multi-auth login (email and Google), real-time chat with Firestore, a task board with drag-and-drop using Reanimated, Redux Toolkit with TypeScript integration, styled UI with Styled Components, and performance monitoring with offline mode support.