Welcome to building React Native apps for Mac

Welcome to Building React Native Apps for Mac

Introduction

Walkthrough

What is React Native? The Mac and Mobile Web App Framework

React Native Pros and Cons for Building macOS Apps

How to Setup a New React Native Mac App

Getting started

State Management in React Native for Mac With MobX Library

How to Solve JavaScript Module Resolution with File Structure

How to Fetch Data From a REST API in a React Native Mac App

How to Create an API Store in React Native with Axios

How to Add Tailwind CSS to a React Native Mac App

How to Use and Customize Tailwind CSS in React Native

Behavior Encapsulation and React Native Reusable Components

Add React Native Navigation on macOS with React Navigation

Building bones of the application

Add Conditional Styles to React Native With Classnames

Optimize React Native with FlatLists and Native Webview

Advanced JavaScript topics

How React and macOS Communicate with React Native Bridge

How to Add React Native Vector Icons and Custom Fonts

How to Build a macOS Menu Bar App With React Native

How to Store Data on macOS Keychain with React Native Bridge

How to Expose macOS Native Modules to React JavaScript

How to Quit a React Native App on macOS

How to Add Hover and Focus States to a React Native Mac App

Limitations of Building Mac Apps With React Native

Build and Publish a React Native App on the Mac App Store

MacOS specific functionality

Advanced macOS functionality

How to Support Multiple Windows in React Native

Auto Launch a React Native Mac App With Swift Dependencies

How to Send macOS Notifications From a React Native App

Add macOS Drag and Drop Support to a React Native App

How to Handle Events in a React Native Mac App

Advanced topics

Good bye

Links and further reading

Links and references

react-native

node.js

typescript

tailwind-rn

In this course we will explore react-native as a framework for building macOS applications. Unlike web based tools, react-native offers a lot of benefits when it comes to performance and the ability to leverage native functionality.

React-native is not without its difficulties and the jump to a desktop environment requires not only novel technical solutions but also a different way of dealing with APIs and UI patterns.

In 30 lessons we cover setting up a scalable application architecture, connecting with native macOS APIs and exploring some workarounds. The course comes with a lot of new techniques, code samples and detailed instructions to develop React Native apps that are truly equal to native alternatives.

Taught by Oscar Franco, who has worked in several companies as team lead and CTO, released a bunch of React Native apps and has contributed many of the newest latest techniques for react-native-macos.

In this course we will learn how to create modern macOS applications using react-native, take advantage of all the goodies react-native provides on the mac.

Building React Native Apps for Mac

How to set up a scalable architecture for your application

How to leverage native APIs with JavaScript

How to create great desktop native experiences

 course. We will learn how to build native macOS apps using 

 and a few other Swift and JavaScript libraries.

 and I'm the creator of this course. I'm a Software Engineer from Bolivia living in Germany. I have worked as a team lead for a bunch of companies. Over the years I have worked a lot with React Native on mobiles, but since Microsoft released their port of React Native for macOS I jumped on the bandwagon and created 

. The framework is so new that I've had to develop some new ideas and techniques, and together with 

 we decided it was a good idea to create a course for people interested in developing desktop apps for macOS.

CI Demon was my first react-native-macos app. It condenses all your CI information in the macOS status bar. It started as a native SwiftUI app, but developing an app with native technologies was slow and frustrating, switching to React Native not only allowed me to leverage all my experience with React, but to keep all the benefits of native technologies.

This course is meant for React Native developers who want to start developing macOS apps, and also for native developers who want to start developing in React Native. This means we have to maintain a certain balance and cannot delve too deeply into any aspect without leaving either group behind. 

We will take a high-level overview of React-Native-macOS: why you should choose it, its advantages and disadvantages, state of tooling and other high-level topics.

Here we will start writing some code. We'll start with a greenfield React Native app and start adding the libraries we need to develop a fully-fledged app, from state management to UI theming. We will also look at a nice way to organize your files and modules, to set you up for developing a real app.

---
title: Welcome to Building React Native Apps for Mac
description: Welcome to building React Native apps for Mac
role: "INTRODUCTION"
privateVideoUrl: https://fullstack.wistia.com/medias/c57r7q171j
---

Welcome to newline's **Building React Native apps for Mac** course. We will learn how to build native macOS apps using [React-Native-macOS](https://github.com/microsoft/react-native-macos), [Typescript](http://typescriptlang.org), [MobX](https://mobx.js.org/README.html), [Tailwind](https://tailwindcss.com) and a few other Swift and JavaScript libraries.

My name is **Oscar** and I'm the creator of this course. I'm a Software Engineer from Bolivia living in Germany. I have worked as a team lead for a bunch of companies. Over the years I have worked a lot with React Native on mobiles, but since Microsoft released their port of React Native for macOS I jumped on the bandwagon and created [CI Demon](https://apps.apple.com/de/app/ci-demon/id1560355863?l=en&mt=12). The framework is so new that I've had to develop some new ideas and techniques, and together with **newline** we decided it was a good idea to create a course for people interested in developing desktop apps for macOS.

![CI Demon](https://d2uusema5elisf.cloudfront.net/courses/building-react-native-apps-for-mac/module_00/lesson_01.01/public/ci_demon.png)

:::note
CI Demon was my first react-native-macos app. It condenses all your CI information in the macOS status bar. It started as a native SwiftUI app, but developing an app with native technologies was slow and frustrating, switching to React Native not only allowed me to leverage all my experience with React, but to keep all the benefits of native technologies.
:::

## Is this course for you?

This course is meant for React Native developers who want to start developing macOS apps, and also for native developers who want to start developing in React Native. This means we have to maintain a certain balance and cannot delve too deeply into any aspect without leaving either group behind. 

## Course summary

The course is divided into four modules.

### Module 1: Getting started

We will take a high-level overview of React-Native-macOS: why you should choose it, its advantages and disadvantages, state of tooling and other high-level topics.

### Module 2: Building the bones of our app

Here we will start writing some code. We'll start with a greenfield React Native app and start adding the libraries we need to develop a fully-fledged app, from state management to UI theming. We will also look at a nice way to organize your files and modules, to set you up for developing a real app.