Project WebApp

In this course you will realize your own web application.

It starts with the foundations like the necessary tooling needed for coding. And then over the different sessions a react.js based chat-app is built to show topics from styling over state-management to functional programming.

After finishing this course you should be able to build your own application running in the browser

Basics and Tools

10-04-2018
The first thing you have to know before you can develop a successful web application is the platform you are running on. The “Browser…

Functional programming with JavaScript

17-04-2018
As the name “functional programming” suggests, this lesson has a heavy focus on functions. In JavaScript, you can describe a function in…

From code to UI - Introduction to React.JS

24-04-2018
To use react we need two packages from npm, react itself and react-dom . React takes care of managing a virtual DOM representation and is…

How to style react

08-05-2018
The classic approach to styling in the browser is creating a CSS file and provide it with a <link /> tag. The tutorial from last session…

State management in a react app

15-05-2018
Handling the state of an application is one of the core features of most frameworks and even react ha a build in state API. Every class…

Taking control over state-changes

22-05-2018
As already said in last session, besides handling the state itself it is very important to take care of the state changes. An extremely…

Get firebase to sync your data

29-05-2018
Till now the chat app is quite boring, because you can only talk to yourself. But for synchronization of the message history with other…

React on the server and the JAMstack

05-06-2018
If you dig a bit deeper into the react-dom package you will find a sub folder called server and there is a function renderToString . As the…

Declarative animations with react-pose

12-06-2018
In general animating the view is hard, because suddenly the state is dependent on time. Views can exist longer than they existed before…