CF

React Native Styling Basics

1h 18m 28s
English
Paid

React Native Styling Basics is a 16-lesson 1 hour 18 minutes self-paced course by Simon Grimm. Styling in React Native works differently from web CSS, and this 16-lesson course from Simon Grimm is built around that gap — getting comfortable with the StyleSheet API instead of fighting it.

Course facts

Lessons
16
Duration
1 hour 18 minutes
Level
All levels
Language
English
Updated
Instructor
Simon Grimm
Price
Premium

Styling in React Native works differently from web CSS, and this 16-lesson course from Simon Grimm is built around that gap — getting comfortable with the StyleSheet API instead of fighting it.

What's covered

  • How the StyleSheet API differs from CSS, and ways to keep styles organized as a project grows
  • Building responsive layouts with Flexbox that adapt across screen sizes and orientations
  • Creating platform-specific components so an app looks right on both iOS and Android
  • Adding theming and dark mode support

The course also covers a handful of practical habits around using StyleSheet efficiently and working with the Expo Router, aimed at developers who want their React Native interfaces to look polished without a lot of trial and error.

Who teaches React Native Styling Basics? Simon Grimm

Simon Grimm thumbnail

Simon Grimm is a German developer and educator behind the Galaxies.dev teaching platform, focused entirely on cross-platform mobile development with Ionic, Capacitor, React Native, and Flutter. He is one of the longest-running independent instructors on the Ionic / Capacitor stack and a frequent speaker at the framework's official events.

His CourseFlix listing carries over twenty Galaxies.dev courses covering Ionic Angular, Ionic React, Capacitor native plugin development, React Native, and Flutter — plus the surrounding ecosystem (auth, push notifications, in-app purchases, Stripe integration). Material is paid and aimed at developers building production mobile apps with web technologies rather than going down the native Swift / Kotlin track.

What lessons are included in React Native Styling Basics?

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 16 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: Course Overview
All Course Lessons (16)
#Lesson TitleDurationAccess
1
Course Overview Demo
02:39
2
Expo App Setup
03:55
3
Using the StyleSheet API
06:18
4
Height, Width and Position
07:27
5
Positioning with Flexbox
09:06
6
Conditional Styling
05:19
7
Handling Images
03:49
8
StyleSheet Functions
05:59
9
Platform Specific Styling
05:55
10
Platform Specific Components
03:38
11
Respecting Safe Areas
05:15
12
Creating a dark mode
05:04
13
Customising Navigation Elements
02:13
14
Using CSS with Expo
04:33
15
Platform Specific Layout Files
02:50
16
Styling Alternatives
04:28
Unlock unlimited learning

Get instant access to all 15 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

What courses are similar to React Native Styling Basics?

More courses by Simon Grimm

Frequently asked questions

What prior knowledge is required before enrolling in this course?
Prospective students should have a basic understanding of JavaScript and familiarity with React. While the course focuses on styling in React Native, knowledge of how React operates will be beneficial. Familiarity with mobile app development concepts is also helpful but not strictly necessary.
What projects or applications will I build in this course?
The course involves creating visually appealing and responsive mobile interfaces using React Native. You will work on developing custom, platform-specific components and implementing features like dark mode, which will enhance your understanding of styling principles in mobile applications.
Who is the target audience for this course?
This course is designed for developers who want to enhance their skills in mobile application styling using React Native. It's ideal for those who aim to build responsive and visually appealing apps that work across different platforms, such as iOS and Android.
How does this course's depth and scope compare to other React Native courses?
This course specifically focuses on the styling aspects of React Native, covering the StyleSheet API, Flexbox for responsive design, and platform-specific components. It provides in-depth knowledge in these areas, which is more specialized than general React Native courses that cover broader development topics.
What tools or platforms will I learn to use?
You will learn to use the StyleSheet API for styling, Flexbox for responsive layouts, and the Expo Router for navigation. The course also covers platform-specific styling and components for both iOS and Android, ensuring your applications are visually consistent across devices.
What topics are not covered in this course?
The course does not cover the basics of React Native app development, such as state management with Redux or other JavaScript frameworks. It focuses exclusively on styling aspects, so students looking for comprehensive development knowledge might need additional resources.
How much time should I expect to commit to this course?
The course consists of 16 lessons, covering various aspects of styling in React Native. While the total runtime is not specified, students should allocate time for both watching the lessons and practicing the hands-on exercises to fully grasp the material.