Implementing Single-Page Web-Applications with React and Redux (3 ECTS)

Objective

This course provides a basic understanding for the implementation of Single-Page (Web) Applications (SPA) using React and Redux. It covers also the implementation of secure REST services for the back-end. The course comprises the following topics:

- Basic architectures for the implementation of web applications
- Common web stacks for the implementation of SPAs
- Implementing Rest services with node.js and express
- Securing Rest services with JWT and HTTPS
- Implementing the front-end with React
- State management in SPAs with Redux

In each session, the students will apply the covered topics by implementing their own SPA. Therefore, they will implement in teams of 2 persons both the back-end as well as the front-end of a simple SPA.

After the course, the students should understand all relevant aspects to develop professional Single-Page Applications on their own.

The course objectives are:
- Understand the implementation of a secure REST service back-end
- Understand the implementation of a web front-end with React
- Understand the concepts of Redux and its integration with a React application

Content

Session 1
Web Architectures
Web Stacks for SPAs
Implementing Rest-Services with Node.js and Express
Connecting REST services with MongoDB/ Mongoose
Securing REST services with JWT and HTTPS

Session 2
Basic concepts of React: Components (class and function), Props, States, etc.
Structuring React applications

Session 3
Concepts of Redux (Reducer, Actions, etc.)
Integrating Redux in the React application

Session 4
IT-Security aspects (Token-Management, Encryption, etc.)
Implementing a full-fledged application

Session 5
Presentation of the applications
Discussion of implementation approaches and software architecture aspects
Lessons learned

Further information

Students need to bring their own laptop.

Evaluation scale

Hyväksytty/Hylätty

Assessment criteria, approved/failed

Presence in the sessions is obligatory. The teams must implement a full-fledged web application integrating of aspects covered in the sessions. The students should understand all aspects of their implemented application.

Qualifications

All students should fulfill the following prerequisites:
- Basic knowledge of web technologies and web development
- Good programming skills in JavaScript

It is recommended, that the students bring along their own laptops. For the development, Visual Studio Code or an IntelliJ-based development environment is recommended. Prior installation of the following software would be helpful:
- Node.js
- MongoDB