Learning Resources

Getting Started

Looking to contribute but don't know much about React or Windows development? Start here.

React Native for Windows combines the React Native framework and native Windows platform (UWP/XAML). As a result familiarity with both is useful. Here are some steps you can take to get acquainted.

• The XAML Controls Gallery app is a great way to see what XAML can do. You can just download the app and play around.
• We've created a peer React Native Gallery app that will show similar controls built with React Native for Windows. Download that and contrast with the XAML Controls Gallery.
• The blog on our website that covers the work we’ve been doing over the past few years. Give it a look to see how this space is evolving.

Looking to learn by writing code? Here are some activities to introduce yourself to the space:

• Experiment with React.js
• Build a React Native app for your phone (Expo makes this very easy)
• Build a native UWP app for Windows (check out WinUI)
• Use the React Native for Windows tools to build a native Windows app (start here)

There are more detailed resources for all of this listed below.

React.js

• ReactJS Website & Documentation
• Using React in Visual Studio Code - Tutorial to build ReactJS web apps using VS Code
• React.js Getting Started (2020 Pluralsight Course) - Fantastic course for interactive learning about React.js
  Learn the React way to build rich interactive UIs using both class and function components with React Hooks, and build a game for kids with it.

React hooks

• Using React Hooks (2021 Pluralsight Course) - Good course for learning the basics of hooks: useState, useRef, useEffect, useContext, useReducer, useCallback, and useMemo
  React Hooks bring state and lifecycle events to React Functional Components as well as streamlining code that previously was coupled and complex. Learn techniques for using React Hooks including Redux-like state management with React Context.

React Native

• React Native Website & Documentation
• React Native for Windows Website & Documentation
• React Native Gallery - Gallery app which displays selection of React Native components with Windows support
• React Native Overview (2021) (2021 MSFT Internal) - Starting point for internal MSFT engineers exploring RNW
  The goal of this presentation is to get traditional Microsoft engineers up to speed with the core concepts and mechanics of React Native development.
• React Native: The Big Picture (2021 Pluralsight Course) - Fantastic course for getting a strong overview of the React Native space
  In this course, you will learn about React Native, it's core features, and why you should choose this technology for your mobile development. Explore the diverse React Native ecosystem and what it has to offer to build cross-platform native apps.
• React Native: Getting Started (2021 Pluralsight Course) - Fantastic course for interactive learning about React Native
  React Native allows JavaScript developers to leverage their skills to build mobile apps. This course will teach you to use the React Native features and tooling to build a mobile app.
• Brown Bag on node module and yarn workspaces (2020 MSFT Internal) - Gives an introduction into the infrastructure of dependency installation for React Native

React Native Community Modules

• Official RNW Native Module Documentation
• React Native Picker - Picker is fairly straight forward, useful to review and use as an example for UI community modules
• React Native Clipboard - Clipboard is fairly straight forward, useful to review and use as an example for non-UI community modules
• React Native Orientation Locker - Orientation Locker is useful to review and use as an example for instances of REACT_INIT, REACT_EVENT, and REACT_CONSTANT_PROVIDER
• React Native - Native Modules: WinDev Design Discussions (2020 MSFT Internal) - Gives an overview of how CM work
  A discussion about React Native for Windows' Native Modules. AKA how do you get from JavaScript to native C++/C# code when writing a React Native app.
• [RNSummit2021] End-to-end of building apps and modules with React Native on Windows (2021 MSFT Internal) - Shows the process of replacing a cross-platform JS UI component with a native WinUI one on Windows
  Recording of a session from React Native @ Microsoft Summit on April 6, 2021. Source @ https://github.com/jonthysell/ProgressBarApp

Testing Community Modules

• React Native WebView - Webview is a more complete CM with tests and CI checks
• Getting Started with UI Testing and Appium (2020 Pluralsight Course) - Learn how to add windows tests to a CM
  This course you will teach you how to write UI Test automation in the programming language you like for applications on iOS, Android, Mac, and Windows including UWP, WPF, and Windows Forms applications using the open source tool Appium.

UWP

• Windows 10 development for absolute beginners
• Hosting RNW in a WPF app

C++

• C++ Core Guidelines
• The C++ Resources Network - Resource for viewing syntax and documentation
• Effective Modern C++ by Scott Myers - For growing your C++ knowledge to Senior level
• Learn to Program with C++ (2020 Pluralsight Course)
  If you've never programmed before, and you think you'd like to learn C++, why not learn it first? This course covers what you need to start writing real applications in C++.