VOOZH about

URL: https://www.coursera.org/learn/packt-react-native-fundamentals-ui-design-gqmg9

⇱ React Native Fundamentals & UI Design | Coursera

React Native Fundamentals & UI Design

Ends soon! Keep adding new skills with 10,000+ programs for $239 (usually $399). Save now.

React Native Fundamentals & UI Design

Included with

Gain insight into a topic and learn the fundamentals.
Intermediate level

Recommended experience

1 week to complete
at 10 hours a week
Flexible schedule
Learn at your own pace
Gain insight into a topic and learn the fundamentals.
Intermediate level

Recommended experience

1 week to complete
at 10 hours a week
Flexible schedule
Learn at your own pace

What you'll learn

  • Master mobile UI design with React Native and ensure responsiveness across platforms.

  • Build interactive, user-friendly mobile apps with React Native components and APIs.

  • Implement advanced state management using Redux and Redux Toolkit for seamless app functionality.

  • Create dynamic apps that handle user inputs, API interactions, and navigation smoothly.

Details to know

Shareable certificate

Add to your LinkedIn profile

Recently updated!

May 2026

Assessments

7 assignments

Taught in English

Build your subject-matter expertise

This course is part of the The Complete React Native Bootcamp 2026 Specialization
When you enroll in this course, you'll also be enrolled in this Specialization.
  • Learn new concepts from industry experts
  • Gain a foundational understanding of a subject or tool
  • Develop job-relevant skills with hands-on projects
  • Earn a shareable career certificate

There are 6 modules in this course

This course features Coursera Coach!

A smarter way to learn with interactive, real-time conversations that help you test your knowledge, challenge assumptions, and deepen your understanding as you progress through the course. This course will guide you through the essentials of building mobile applications with React Native, including creating stunning UI designs, understanding core components, and integrating APIs. You will develop the skills to design functional, visually appealing applications that work across both iOS and Android platforms. With a combination of practical coding exercises and UI design techniques, you will be well-prepared to build your own apps with React Native. The course begins with an introduction to React Native, the prerequisites for success, and setting up your development environment, including Expo Snack. As you move through the course, you'll gain hands-on experience with React Native's UI components, such as SafeAreaView, Text, and Buttons. You'll dive into more advanced topics like building responsive UIs using Flexbox, animations, and integrating APIs to fetch data. You'll also explore using Redux for state management, ensuring a smooth and consistent app experience. Your journey will take you through designing custom UI components like headers, buttons, and user avatars, building effective navigation systems, and handling user interactions. You’ll also learn to manage real-world app data with the help of APIs, Axios, and Redux. You’ll tackle real-world development challenges, making your apps truly functional. By the end of the course, you will have built a fully functional React Native app that incorporates all the features you’ve learned. This course is perfect for anyone interested in mobile development, UI design, and building applications using React Native. Whether you are a beginner or someone familiar with programming, this course will help you enhance your skills and prepare you for the app development industry. By the end of the course, you will be able to design responsive UIs, build applications with React Native, integrate APIs, manage global state with Redux, and navigate through apps with ease. You will also gain expertise in debugging and optimizing apps for better performance.

In this module, we will introduce you to React Native, its key features, and guide you through the setup process. You will learn how to configure your development environment and create your very first React Native application, testing it on both simulators and real devices.

What's included

10 videos2 readings

10 videos•Total 39 minutes
  • Introduction to Specialization•2 minutes
  • Course Prerequisites•2 minutes
  • What Is React Native•1 minute
  • Introduction to Expo Snack•2 minutes
  • Set Up Environment•4 minutes
  • Create Your First App•2 minutes
  • iOS Simulator (MacOS)•3 minutes
  • Run App on Real Device•4 minutes
  • Android Emulator (MacOS)•11 minutes
  • Setup Environment Windows•8 minutes
2 readings•Total 20 minutes
  • Introduction to the Course 'React Native Fundamentals & UI Design'•10 minutes
  • Full Specialization Resource•10 minutes

In this module, we will cover the fundamental UI components and styling techniques in React Native. You will explore how to design interactive UIs using core components, handle user inputs, and build flexible, responsive layouts for different devices.

What's included

23 videos1 assignment

23 videos•Total 110 minutes
  • Explain Init Code•4 minutes
  • SafeAreaView•2 minutes
  • Text•6 minutes
  • StyleSheet•4 minutes
  • Images•6 minutes
  • Buttons & Pressable & Touchable•5 minutes
  • ScrollView•3 minutes
  • Platform•5 minutes
  • Loaders•2 minutes
  • Views•5 minutes
  • Margin & Padding•6 minutes
  • Flex•3 minutes
  • flex-direction•7 minutes
  • flexWrap•2 minutes
  • Positions•3 minutes
  • Dimensions•6 minutes
  • Responsive UI•5 minutes
  • useState Hook•7 minutes
  • Modal•6 minutes
  • Expo Icons•3 minutes
  • ImageBackground•4 minutes
  • TextInput•9 minutes
  • Create React Component•10 minutes
1 assignment•Total 15 minutes
  • UI & Core Components - Assessment•15 minutes

In this module, we will delve into advanced UI design techniques and how to translate Figma designs into functional React Native components. You will practice building complex layouts and enhance your app's interactivity with animations and dynamic content rendering.

What's included

22 videos1 assignment

22 videos•Total 139 minutes
  • UI Mastering Introduction•1 minute
  • Figma Design•3 minutes
  • PNG vs SVG•6 minutes
  • Intro Screen•4 minutes
  • User Avatar•6 minutes
  • Header Component•5 minutes
  • Social Section•11 minutes
  • Social Container•5 minutes
  • Finish Contact Us Screen•10 minutes
  • Home Screen Header•4 minutes
  • Top Tabs•12 minutes
  • Card Component with Dark Overlay•13 minutes
  • FlatList with 2 Rows•9 minutes
  • FlatList with Props•5 minutes
  • Payment Screen Header•4 minutes
  • Payment Method•5 minutes
  • Payment Method Selected•8 minutes
  • Payment List•9 minutes
  • Bank Card Box•6 minutes
  • Add Button•3 minutes
  • Adding Animations•5 minutes
  • Task Time•4 minutes
1 assignment•Total 15 minutes
  • UI Mastering Practice - Assessment•15 minutes

In this module, we will teach you how to implement navigation within your React Native app. You'll learn how to use stack and bottom tab navigation to provide an intuitive user experience and manage route parameters with the useRoute hook.

What's included

5 videos1 assignment

5 videos•Total 39 minutes
  • Builds Screens•3 minutes
  • Stack Navigation•10 minutes
  • Recap & Screen Options•9 minutes
  • useRoute•4 minutes
  • BottomTabs•13 minutes
1 assignment•Total 15 minutes
  • Navigation & Bottom Tabs - Assessment•15 minutes

In this module, we will focus on integrating APIs into your React Native app. You’ll learn how to make API requests, handle errors, and dynamically render fetched data within your app using components like FlatList and custom UI elements.

What's included

21 videos1 assignment

21 videos•Total 138 minutes
  • Create New App•2 minutes
  • Create Custom API (Mock API)•4 minutes
  • Axios•7 minutes
  • Get Request & FlatList•8 minutes
  • Get By Id Request•4 minutes
  • Try Catch•5 minutes
  • Delete Request•5 minutes
  • Post Request•9 minutes
  • Put Request•5 minutes
  • Refactor and Create Home Screen for New Project•4 minutes
  • Book Card•15 minutes
  • Props•7 minutes
  • APIs Functions•6 minutes
  • Render Data in FlatList•8 minutes
  • Delete Book•6 minutes
  • Add Button UI & Modal•9 minutes
  • CustomTextInput•10 minutes
  • Save Button•4 minutes
  • Create Book•8 minutes
  • Edit Book•13 minutes
  • Bug Fix•1 minute
1 assignment•Total 15 minutes
  • Working with APIs - Assessment•15 minutes

In this module, we will introduce you to Redux and its role in managing global application state. You will learn how to create actions, reducers, and utilize Redux Toolkit for a more streamlined and efficient state management experience in React Native applications.

What's included

11 videos1 reading3 assignments

11 videos•Total 57 minutes
  • Redux is not that hard•3 minutes
  • Why Redux is Useful•4 minutes
  • Reducer Explained•5 minutes
  • Create Store and Get Data From Global State•8 minutes
  • Actions & useDispatch•8 minutes
  • Payload•5 minutes
  • Combine Reducers•5 minutes
  • RootState•3 minutes
  • Recap Redux & Task•5 minutes
  • Redux Toolkit Store•3 minutes
  • Redux Toolkit Reducer & Actions•8 minutes
1 reading•Total 10 minutes
  • Conclusion to the Course 'React Native Fundamentals & UI Design'•10 minutes
3 assignments•Total 90 minutes
  • Full Course Practice Assessment•15 minutes
  • Redux & Redux Toolkit 0 - Assessment•15 minutes
  • Full Course Assessment•60 minutes

Earn a career certificate

Add this credential to your LinkedIn profile, resume, or CV. Share it on social media and in your performance review.

Instructor

Offered by

Explore more from Software Development

Why people choose Coursera for their career

👁 Image

Felipe M.

Learner since 2018
"To be able to take courses at my own pace and rhythm has been an amazing experience. I can learn whenever it fits my schedule and mood."
👁 Image

Jennifer J.

Learner since 2020
"I directly applied the concepts and skills I learned from my courses to an exciting new project at work."
👁 Image

Larry W.

Learner since 2021
"When I need courses on topics that my university doesn't offer, Coursera is one of the best places to go."
👁 Image

Chaitanya A.

"Learning isn't just about being better at your job: it's so much more than that. Coursera allows me to learn without limits."

Frequently asked questions

React Native is an open-source framework that allows developers to build mobile applications using JavaScript and React. It is highly relevant because it enables the development of cross-platform apps, meaning one codebase can work on both iOS and Android. This significantly reduces development time and effort while maintaining a high level of performance and user experience, making it a popular choice for mobile developers.

This course covers the fundamentals of React Native, focusing on building mobile applications using JavaScript and React. You’ll learn to work with core components, UI design, navigation, and how to integrate APIs. The course is structured to guide you through setting up your development environment, mastering UI design components, and even building real-world applications with Redux and API integration.

Upon completing the course, you will be proficient in using React Native to create cross-platform mobile apps. You will be able to design and implement responsive UIs, manage app state using Redux, integrate APIs, and handle app navigation. Additionally, you will have the knowledge to deploy your apps to real devices, test them, and troubleshoot common issues.

While no specific background is required, it is recommended that you have a basic understanding of JavaScript and React, as the course builds on these technologies. If you're new to React, some foundational knowledge of how React works, including components, props, and state, will help you get the most out of this course.

This course is designed for developers interested in building mobile applications using React Native. Whether you're a beginner in mobile app development or someone looking to expand your skills, this course will provide you with the tools and knowledge needed to create professional-quality apps. It’s also great for web developers familiar with React who want to transition into mobile development.

The course includes approximately 11 hours of video content. Depending on your pace, you can expect to complete it in a few days to a few weeks, especially if you spend additional time practicing and building your own projects alongside the lessons.

Yes, you can preview the first video and view the syllabus before you enroll. You must purchase the course to access content not included in the preview.

If you decide to enroll in the course before the session start date, you will have access to all of the lecture videos and readings for the course. You’ll be able to submit assignments once the session starts.

Once you enroll and your session begins, you will have access to all videos and other resources, including reading items and the course discussion forum. You’ll be able to view and submit practice assessments, and complete required graded assignments to earn a grade and a Course Certificate.

If you complete the course successfully, your electronic Course Certificate will be added to your Accomplishments page - from there, you can print your Course Certificate or add it to your LinkedIn profile.

This course is currently available only to learners who have paid or received financial aid, when available.

Yes. In select learning programs, you can apply for financial aid or a scholarship if you can’t afford the enrollment fee. If fin aid or scholarship is available for your learning program selection, you’ll find a link to apply on the description page.

Financial aid available,