Welcome to this two-day React training! It is very important that you read and follow these instructions before the actual training.
- You are a developer, devsigner or such with working professional knowledge on JavaScript, HTML and CSS. You don't have to be a guru, but the training is not suitable for total beginners.
- Learn the ES6 syntax (see below) beforehand so you don't have to spend time learning it in the training.
- We are going to show code examples and use TypeScript in our training so it will help you immensely to know the basics. However, you don't have to write TypeScript if you don't want to.
We are going to use the "new" ES6 syntax to write our JavaScript. Features / syntax you will definitely need to know are:
- Block scoped variables:
let
andconst
const foo = 'bar'
let quux = 123
- Modules and their
import
andexport
syntax
import React, { useState } from 'react'
export function App() {
...
}
- Arrow function syntax
const getStuff = (id) => { ... }
- Array / object destructing
const { persons } = props
const [person1, person2] = persons
Promise
s andasync
/await
syntax
async function getStuff() {
...
}
const stuff = await getStuff()
- MacOS and Linux will definitely work. Windows should probably work too, but please test it before hand!
- A recent version of Node.js. Node.js 10 or newer will likely work.
- The Yarn package manager is recommended. NPM will work too if you're old school.
- VSCode is the recommended editor and the project is preconfigured to work with it. Other editors / IDEs will of course work too but are not officially supported.
Install these Chrome extensions, or similar ones for your browser of choice.
Start by cloning this repository.
If you don't know how to use Git then please spend some time to learn the basics.
step0
is the branch that contains the starting point for our training.
git checkout step0
cd client
yarn
to install packagesyarn start
to start the client
Open browser and go to http://localhost:3000/. You should see a very simple welcoming page.
cd server
yarn
to install packagesyarn start
to start the server
Open browser and go to http://localhost:8889/persons and you should see big list of persons in JSON.
If you can open both the client and the server successfully in your browser then you are good to go!