Skip to content

Instantly share code, notes, and snippets.

@jevakallio
Last active July 24, 2022 02:37
Show Gist options
  • Save jevakallio/2112301e111f26896ffa21326a04ba00 to your computer and use it in GitHub Desktop.
Save jevakallio/2112301e111f26896ffa21326a04ba00 to your computer and use it in GitHub Desktop.
React Native For Beginners

Introduction

React Native makes it possible to make native iOS and Android mobile apps without needing to know any iOS or Android programming - just JavaScript!

In this course, we'll write a simple mobile app that you can run on your own phone and share with your friends!

Prerequisites

In order to take advantage this course, you should have the following experience.

  • JavaScript - Some previous JavaScript programming knowledge is required, since we won't have time to start learning programming from scratch.
  • HTML/CSS - Basic understanding of how to make a web page. React Native doesn't actually use HTML or CSS, but the concepts are very similar to how React Native works, and having some experience with these will make the course a lot more rewarding.

Tools

For this course, you'll need

  • A Macbook OR a Windows or Linux laptop.
  • An iPhone OR an Android smartphone

Before the course, please make sure you have the following software installed on your computer:

  • Node.js 6.x or later
    • Make sure you know how to open your "Command Line" or "Terminal" and type node -v. You should see the your Node.js version printed in the terminal.
  • A text editor that can be used to edit JavaScript, for example Atom, VS Code, Sublime Text
    • If you don't have a preference, I recommend Atom, but any text editor will do!

You should also install the Expo app on your phone (iOS App Store | Android Play Store)

Optionally, you can install the following on your laptop:

  • Create React Native App (with npm install -g create-react-native-app)

Optional reading

The following topics will help you on this course, but are not mandatory. The React Native Express tutorial is great for studying all of these topics. Read as much or as little of it as you'd like, but don't worry if it doesn't all make sense to you.

  • ES6 - React Native applications are written in the new ES6 version of JavaScript. We will only use the most basic features, but familiarity with the following language features will be helpful:
    • Modules (import and export keywords)
    • Arrow functions (the => syntax)
    • Classes (the class keyword)
    • Block-scoped variables (the const and let keywords)
    • Study materials: ES6 chapter of React Native Express
  • JSX - React Native uses a JavaScript language extension called JSX that allows us to define HTML-like elements inside our code. Learning JSX is easy, but the syntax might look strange at first. Getting used to seeing JSX will help on the course.
  • React - React Native uses the same components as React for the web. Some knowledge of React will be helpful, but not necessary, as we will cover all required features on the course

Basically, if you can understand what each of the keywords and syntax in this example does, you'll be in great shape!

import React from 'react'

class App extends React.Component {
  render() {
    const message = 'Hello world!';
    return (
      <Button onPress={() => console.log(message)}>
        Press me!
      </Button>
    )
  }
}
@delanick
Copy link

delanick commented Aug 1, 2017

Hi, where is this course hosted?

@dodicandra
Copy link

The course is no sequel?

@rahulgbgautam
Copy link

where is the course

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment