Learn React, Redux, Node.js, MongoDB, and GraphQL in one go! This course will introduce you to modern JavaScript-based web development. The main focus is on building single page applications with ReactJS that use REST APIs built with Node.js.

This course serves as an introduction to modern web application development with JavaScript. The main focus is on building single page applications with ReactJS that use REST APIs built with Node.js. The course also contains a section on GraphQL, a modern alternative to REST APIs.

The course covers testing, configuration and environment management, and the use of MongoDB for storing the application’s data.

The course is worth 3-8 credits, and the content is the same as in the Full stack course held at the Department of Computer Science at the University of Helsinki in Spring 2019. There is also an associated project work that is worth 1-10 credits.

Partners and affiliates of the course include Houston Inc, Terveystalo, Elisa, K-ryhmä, Unity Technologies ja Konecranes. See here for guest lectures on course-related topics given by various experts from our partners and affiliates.

Participants are expected to have good programming skills, basic knowledge of web - programming and databases, and to know the basics of working with the Git version-control system. You are also expected to have perseverance and the ability for independent problem solving and information seeking. Part 0 of the course material goes through the content and conduct of the course in more detail. Make sure to read the material and instructions thoroughly. Use the package manager pip to install foobar.

• General info
• Fundamentals of Web apps

• Introduction to React
• Javascript
• Component state, event handlers
• A more complex state, debugging React apps

• Rendering a collection, modules
• Forms
• Getting data from server
• Altering data in server
• Adding styles to React app

• Node.js and Express
• Deploying app to internet
• Saving data to MongoDB
• Validation and ESLint

• Structure of backend application, introduction to testing
• Testing the backend
• User administration
• Token authentication

• Login in frontend
• props.children and proptypes
• Testing React apps
• Custom hooks

• Flux-architecture and Redux
• Many reducers, connect
• Communicating with server in a redux application

• React-router
• More about styles
• Webpack
• Class components, E2E-testing
• Miscellaneous
• Exercises: extending the bloglist

• GraphQL-server
• React and GraphQL
• Database and user administration
• Login and updating the cache
• Fragments and subscriptions