Full Stack Open by The University of Helsinki
Parts 0-7 Full Stack Web Development
Deep Dive Into Modern Web Development
Creating comprehensive applications, complete with features such as an administration panel, users and products, requires us to operate as full-stack developers. I had always wanted to create such an application myself, and actively participating in this course allowed me to do just that. It wasn't easy, and it wasn't enough to build my first eCommerce platform, but it was a significant milestone in achieving that goal.
The Prerequisites
The Full Stack Open requires us to have good programming skills, a basic knowledge of web programming and databases, and familiarity with the basics of the Git version control system. Additionally, perseverance and the ability to solve problems and seek information independently are expected. That's why I highly recommend completing The Odin Project course before starting FSO, unless you already possess such skills, in which case you can begin with FSO directly.
The course content
The course content is exceptionally comprehensive and well-structured. It provides a robust foundation for web development. Though the journey is not a walk in the woods, the knowledge gained is undoubtedly worth the effort.
- PART 0 - Fundamentals of Web apps (a. General Info, b. Fundamentals of Web apps)
- PART 1 - Introduction to React (a. Introduction to React, b. JavaScript, c. Component state, event handlers, d. A more complex state, debugging React apps)
- PART 2 - Communicating with server (a. Rendering a collection, modules, b. Forms, c. Getting data from server, d. Altering data in server, e. Adding styles to React app)
- PART 3 - Programming a server with NodeJS and Express (a. Node.js and Express, b. Deploying app to the internet, c. Saving data to MongoDB, d. Validation and ESLint)
- PART 4 - Testing Express servers, user administration (a. Structure of backend application, introduction to testing, b. Testing the backend, c. User administration, d. Token authentication)
- PART 5 - Testing React apps (a. Login in frontend, b. props.children and PropTypes, c. Testing React apps, d. End-to-end testing)
- PART 6 - Advanced state management (a. Flux architecture and Redux, b. Many reducers, c. Communicating with the server in a Redux application, d. React Query, useReducer, and the context)
- PART 7 - React router, custom hooks, styling app with CSS and webpack (a. React Router, b. Custom hooks, c. More about styles, d. Webpack, e. Class components, Miscellaneous, f. Exercises: extending the bloglist)
The exercises
Each part of the course includes approximately 20 exercises (except for Part 0, which has only 6), which we solve in real-time. It's not a scenario where we read the theory and do exercises only at the end. Here, we solve exercises literally every few paragraphs. This approach allows us to reinforce the knowledge we acquire while reading by immediately applying it through exercises. The difficulty of the exercises is remarkably well-balanced; they are neither too easy nor too challenging. This balance is beneficial as it keeps us motivated without causing discouragement. The exercises differ sufficiently from the examples provided in the source material, requiring effort and allowing for better retention of knowledge. Some exercises are marked with an asterisk, indicating that they are optional. However, I recommend completing all of them.
The submission system
To submit exercise solutions, follow the specified process and submit them to a GitHub repository. After completing a specific number of exercises, mark your progress in the submission system, and remember, you can do this only once for each part. Be sure to use an appropriate naming system for directories when submitting exercises from different parts to the same repository. Plagiarism is monitored, and the University of Helsinki's policy on plagiarism is enforced if violations are detected
Quick Summary
The course doesn't particularly emphasize styling applications. The majority of time is dedicated to programming both the frontend and backend, as well as testing our code. It's not a drawback but an advantage. Contemporary CSS frameworks are introduced in a sufficient manner. However, if someone masters the main programming aspects of the course, they can refine styling on their own. If I could change something in the Core Course, I would prefer to learn SQL + PostgreSQL, instead of MongoDB. I would place MongoDB in the supplementary course. However, from a teaching perspective, using MongoDB in the Core Course was probably justified due to its ease of use. In that case, maybe it should stay that way.
As I mentioned at the beginning of this short review, the course is just great. It is probably the best online source for learning full-stack development. And if that wasn't enough, it is officially conducted by the University of Helsinki, it's free, and you receive ECTS points. Additionally, upon completion of each exercise, you will receive an accessible online certificate!
The Practice
The crucial step after completing the course is to apply the newly acquired knowledge by building a real-world project. No course can fully prepare us for solving real-world problems independently, navigating through package documentations, exploring MDN docs, or seeking solutions on Stack Overflow. I took that step and built a full-stack eCommerce platform using the MERN stack + TypeScript (I took a supplementary TypeScript course)
It took me about three months, and this was another milestone in my journey to becoming a full-stack developer. You can read about the project or check it live with the links below.
This is not the end
Completing the Core Course (Parts 0-7) is just the beginning of what Helsinki's Full Stack Open has to offer. Participants can also take part in many excellent supplementary courses, including:
- PART 8 - GraphQL (a. GraphQL-server, b. React and GraphQL, c. Database and user administration, d. Login and updating the cache, e. Fragments and subscriptions)
- PART 9 - TypeScript (a. Background and introduction, b. First steps with TypeScript, c. Typing an Express app, d. React with types, e. Grande finale: Patientor)
- PART 10 - React Native (a. Introduction to React Native, b. React Native basics, c. Communicating with server, d. Testing and extending our application)
- PART 11 - CI/CD (a. Introduction to CI/CD, b. Getting started with GitHub Actions, c. Deployment, d. Keeping green, e. Expanding Further)
- PART 12 - Containers (a. Introduction to Containers, b. Building and configuring environments, c. Basics of Orchestration)
- PART 13 - Using relational databases (a. Using relational databases with Sequelize, b. Join tables and queries, c. Migrations, many-to-many relationships)
I've completed two of them so far: PART 9 - TypeScript and PART 13 - Using relational databases. I'll share my experiences with them next time :)