General info

This course is an introduction to modern web development with JavaScript. The main focus is on single-page applications implemented with React and supporting them with RESTful and GraphQL web services implemented with Node.js. The course also has parts on TypeScript, React Native, and Continuous integration.

Other topics include debugging applications, container technology, configuration, managing runtime environments, and databases.

The course is totally free of charge. You can get a certificate and even the University of Helsinki ECTS (European Credit Transfer and Accumulation System) credits for free.

Prerequisites

Participants are expected to have good programming skills, basic knowledge of web programming and databases, and know the basics of the Git version control system. You are also expected to have perseverance and a capacity for solving problems and seeking information independently.

Previous knowledge of JavaScript or other course topics is not required.

How much programming experience is needed? It is hard to say, but you should be pretty fluent in your language. This level of fluency takes usually at least 100-200 hours of practice to develop.

Course material

The course material is meant to be read one part at a time and in order.

The material contains exercises, which are placed so that the preceding material provides enough information for solving each exercise. You can do the exercises as you encounter them in the material, but it can also be beneficial to read all of the material in the part before starting with the exercises.

In many parts of the course, the exercises build one larger application one small piece at a time. Some of the exercise applications are developed through multiple parts.

The course material is based on incrementally expanding example applications, which change from part to part. It's best to follow the code along while making small modifications independently. The code of the example applications for each step of each part can be found on GitHub.

Taking the course

The course contains fourteen parts, the first of which is numbered 0 for consistency with past iterations. One part corresponds loosely to one week (averaging 15-20 hours) of studying, but the speed of completing the course is flexible.

Proceeding from part n to part n+1 is not sensible before enough know-how of the topics in part n has been achieved. In pedagogic terms, the course uses Mastery Learning, and you are only intended to proceed to the next part after doing enough of the exercises of the previous part.

In parts 1-4 you are expected to do at least all of the exercises that are not marked with an asterisk(*). Exercises marked with an asterisk count towards your final grade, but skipping them does not prevent you from doing the compulsory exercises in the next parts. Parts 5-13 do not have asterisk-marked exercises since there is no similar dependency on previous parts.

The speed of completing the course is flexible.

Exercise completion time statistics can be found via the submission system.

Course channel in Discord

You can discuss the course and related topics in our dedicated group on Discord https://study.cs.helsinki.fi/discord/join/fullstack. Discord has fullstack_general and part-specific (channel names with fullstack prefix) channels for course-related discussion. Note that Discord's chat channel is not suitable for course-related discussions. Please join the conversation!

How to get help in Discord

When you ask for help for a problem in the Discord group your question should be as informative and precise as possible. If your question looks like this

Adding a new person does not work, could you help me with that?

it is quite likely that nobody will respond. The bug can be anywhere.

A better question could be

• In exercise 2.15 when I try to add a new person to the app, the server responds with a 403, despite the request looking ok to me.

The code looks like this

  // the relevant part of code is pasted here
  // code should contain several console.log statements for helping the debugging

The following gets printed to the console

  // data printed to console

The network tab looks like the following*

[screenshot from the network console]

All the code can be found here (a link to GitHub)

Parts and completion

Full Stack studies consist of the core course and multiple extensions. You can complete the studies in the extent of 5 to 14 credits.

Parts 0-5 (core course) - Full Stack Web Development (5 cr, CSM141081)

The number of credits and the grade for the course are based on the total number of submitted exercises for parts 0-7 (including exercises marked with an asterisk).

Credits and grades are calculated as follows:

exercises	credits	grade
138	7	5
127	6	5
116	5	5
105	5	4
94	5	3
83	5	2
72	5	1

Once you have completed enough exercises for a passing grade, you can download the course certificate from the submission system.

If you wish to receive university credits, you must complete the course exam. The exam does not count toward your final grade, but you must pass it. More information about the exam here.

You can only take the exam after submitting enough exercises for five credits. It is not wise in practice to take the exam immediately after submitting the critical number of exercises. The exam is the same for 5-14 credits and does not count toward your grade.

You do not need to attend the course exam or register for the Open University course to obtain the course certificate.

Part 6 - Full Stack Web Development, extension 1 (1 cr, CSM141082)

By submitting at least 127 of the exercises for parts 0-7 while working on the core course, you can receive an additional credit through this extension.

• Submit at least 127 exercises for parts 0-7.
• Enroll in part 6 through the Open University.
• Request credits for part 6.

Part 7 - Full Stack Web Development, extension 2 (1 cr, CSM141083)

By submitting at least 138 of the exercises for parts 0-7 while working on the core course, you can receive an additional credit through this extension.

• Submit at least 138 exercises for parts 0-7.
• Enroll in part 7 through the Open University.
• Request credits for part 7.

Part 8 - Full Stack Web Development: GraphQL (1 cr, CSM14113)

By submitting at least 22/26 of the exercises for part 8 of the course, GraphQL, you can get one additional credit. Part 8 can be done any time after part 5 because its contents are independent of parts 6 and 7.

• Submit at least 22/26 exercises for part 8.
• Enroll in part 8 through the Open University.
• Request credits for part 8.

Part 9 - Full Stack Web Development: TypeScript (1 cr, CSM14110)

By submitting at least 24/30 of the exercises for part 9 of the course, TypeScript, you can get one additional credit. It is recommended that you complete parts 0-7 before taking part 9.

• Submit at least 24/30 exercises for part 9.
• Enroll in part 9 through the Open University.
• Request credits for part 9.

Part 10 - Full Stack Web Development: React Native (2 cr, CSM14111)

By submitting 25 exercises for part 10 of the course on React Native, you can earn two additional credits. More information about this part's prerequisites, exercise submission, and credits can be found in part 10.

• Submit at least 25 exercises for part 10.
• Enroll in part 10 through the Open University.
• Request credits for part 10.

Part 11 - Full Stack Web Development: Continuous Integration / Continuous Delivery (1 cr, CSM14112)

By submitting all exercises for part 11 of the course on Continuous Integration / Continuous Delivery, you can earn one additional credit. More information about this part's prerequisites and exercise submission can be found in part 11.

• Submit all exercises for part 11.
• Enroll in part 11 through the Open University.
• Request credits for part 11.

Part 12 - Full Stack Web Development: Containers (1 cr, CSM141084)

By submitting all exercises for part 12 of the course on Container technology, you can earn one additional credit. More information about this part's prerequisites and exercise submission can be found in part 12.

• Submit all exercises for part 12.
• Enroll in part 12 through the Open University.
• Request credits for part 12.

Part 13 - Full Stack Web Development: Relational databases (1 cr, CSM14114)

By submitting all exercises for part 13 of the course on Relational databases, you can earn one additional credit. More information about this part's prerequisites and exercise submission can be found in part 13.

• Submit all exercises for part 13.
• Enroll in part 13 through the Open University.
• Request credits for part 13.

Studying the course in a nutshell

How to study the course – instructions in a nutshell: 5 cr core course CSM141081

• Do the exercises. The exercises are submitted through GitHub and marking them as done on the submission system.

  • The course certificate will be available in the submission system.

• If you want to get University of Helsinki credits

  • Enroll in the course. You will get the enrollment link through the submission system once you have completed enough exercises. Read more here
  • Save your student number. After course enrollment, save your University of Helsinki student ID number in the submission system.
  • Do the online exam in the submission system. Read more here
  • Mark the course completed in the submission system. Read more here

Please note that if you do the "base course" with 6 or 7 credits, you need separate registrations for the extra credits, see Parts and completion for more.

How to study the course – instructions in a nutshell: other course parts

• Do the exercises. The exercises are submitted through GitHub and marking them is done on the submission system. Note that parts 8-13 have a separate instance in the submission system

  • The course certificate will be available in the submission system

• If you want to get University of Helsinki credits

  • Enroll in the course. You can enroll in each part through the link in the course material (Parts and completion). Enroll in each part separately.
• Mark the part completed in the submission system. Read more here

Submitting exercises

The exercises are submitted through GitHub and marked as done on the "my submissions" tab of the submission application.

If you are submitting exercises from different parts to the same repository, use an appropriate system for naming your directories. You can of course create a new repository for each part. If you are using a private repository, add mluukkai as a collaborator.

Exercises are submitted one part at a time. You will mark the number of exercises you have completed from that module. Once you have submitted exercises for a part, you can no longer submit any more exercises for that part.

A system for detecting plagiarism is used to check exercises submitted to GitHub. If code is found from model answers or multiple students hand in the same code, the situation is handled according to the policy on plagiarism of the University of Helsinki.

Many of the exercises build a larger application bit by bit. In these cases, submitting only the completed application is enough. You can make a commit after each exercise, but that is not compulsory.

The course exam

For the official university credits, you need to pass the course exam that covers parts 1-5 of the course

• If you fail the exam, it can be done again after one week
• You may continue with submissions after the exam

The exam is done in the exercise submission system. Follow the instructions below to complete the exam.

• Enroll in the course through Open University.
• You will get the enrollment link through the submission system once you have completed enough exercises.

After the course enrollment, save your University of Helsinki student number in the submission system:

See this for information on how to find your student number.

After these steps, you can do the course exam in the submission system:

You will have 120 minutes to complete the exam. If all goes well, you should see the following confirmation:

If you fail, you must wait for one week for trying the exam again.

If you passed the exam, and you are not going to complete more exercises, you can go back to the "my submissions" tab and ask for the credits:

Remember to press the big blue button to ask for the credits to be registered.

Note that you have to press the button twice:

When pressed twice you should see the following text

University credit registration in progress...

Note: if you have already done the course exam in Moodle contact matti.luukkainen@helsinki.fi or @mluukkai in Discord.

How to get your credits

If you want to receive University of Helsinki credits, save your University of Helsinki student number to the exercise submission system

If you are not a student at the University of Helsinki, you can get a student number by registering for the course through Open University, see this for more information.

You will receive your credits after you have submitted enough exercises for a passing grade, passed the exam and then letting us know through the exercise submission system that you have completed the course:

Remember to press the big blue button to ask for the credits to be registered.

Note that you have to press the button twice:

When pressed twice you should see the following text

University credit registration in progress...

Please note that to get university credits you need a registration for each completed part. Please see more information about registration.

You can view your grade in the University of Helsinki Sisu and Opintopolku approximately four weeks after notifying us.

When the registration is done, the following text appears in the submission system

University credits registered, see the course page for how to get a transcript if you need one

Where do I get my University of Helsinki Student number

When and if you enroll in a course for the first time through the Open University, a University of Helsinki student number will be automatically generated. *Please make sure you have enrolled in the course before you try to find out what your student number is. *

Note also that you do not need to enroll in Open University to get the course certificate!

You can find out what your student number is through one of the options below:

A) Sisu

If you have a University of Helsinki user account, you can find your student number from your profile in the University of Helsinki’s study information system Sisu:

• Log in to Sisu with your University of Helsinki username and password.
• Select: My profile
• Select: Personal information

B) Enrollment confirmation email

After course enrollment, you will receive a confirmation email to an email address you have entered on the enrollment form. This message either directly has your student number on it or includes a link that takes you to a page displaying your University of Helsinki student number. 

C) Contact Student Services

If you have trouble finding your student number through the means listed above, you can send an email to the University of Helsinki Student Services. Make sure you have enrolled in the course through the Open University before sending the email!

In your email, include the following information

• the name of the course that you have enrolled in,
• your name
• your date of birth.

Student Services email address: avoin-student@helsinki.fi

One more reminder: make sure you have enrolled in the course through the Open University before sending the email

Course certificate

Even if you do not register to Open University for the exam and the credits, you can still download the course certificate from the "My submissions" tab in the submission system once you have completed enough exercises for a passing grade.

There is one certificate for the base parts (0-7) of the course and after that a separate certificate for each course part.

Request a transcript of studies

You can request a verified transcript after your university credits have been registered. To request an official transcript, please contact avoin-student@helsinki.fi.

• When requesting an official transcript, remember to mention

  • the name of the course,
  • your full name,
  • your date of birth
  • the language of the transcript.

The transcript will be delivered to you electronically through email. Present this document at your institution to have the credits included in your degree. The decision to include the credits will be made by your home institution.

No more yearly versions

There are no more "yearly versions" of the course, the course is open all the time. Each part is updated once or twice per year. Updates are mostly minor: library versions are updated and text clarity is improved. However, there might also be some bigger changes.

Despite changes all the submitted exercises remain valid, and the course can be continued without being bothered about updates. Also, the policy for getting certificates, university credits etc. shall remain the same no matter what happens.

Recent major changes

• Part 9 (28th August, 2024): Zod library for validating request body type
• Part 3 (20th June, 2024): ESLint configurations updated
• Part 10 (21st March, 2024): Create React app replaced with Vite
• Parts 3-5 (February-March 2024): Libraries used for testing changed
• Part 10 (26th February, 2024): Library versions updated
• Part 11 (16th January 2024): Example project dependencies updated

Expanding on a previously completed course

If you have already taken the course either as a MOOC or as a university course, you can now expand on your course.

Expanding on Full stack open

You can just pick up where you left off! If you wish to resubmit a whole part, please contact the course personnel via email or Discord mluukkai, with your GitHub username and which parts you would like to have deleted from your submissions.

Expanding on the University of Helsinki instance of this course

That is also possible, just contact the course personnel via email or Discord mluukkai.

Full stack project

A full stack project worth 5, 7 or 10 credits will be available through Open University.

For the project, an application is implemented in React and/or Node, though implementing a mobile application in React Native is also possible.

The number of credits is based on hours of work done. One credit is approximately 17.5 hours of work. The work is graded pass/fail.

It is possible to complete the project as a pair or a group.

See more information on the project.

Interview promise

Our collaborators, Houston Inc., Terveystalo and Smartly.io, have given the promise of a job interview for everyone who completes the course and the project work with maximum credits (14 + 10).

This means that the student can, if they so choose to, sign up for a job interview with a collaborator who has given the promise. The teacher of the course, Matti Luukkainen, will send instructions to the student after the courses have been completed with maximum credits.

You need to be a resident of Finland to participate in these interviews.

Before you start

Using the Chrome browser is recommended for this course because it provides the best tools for web development. Another alternative is the Developer Edition of Firefox, which provides the same range of features.

The course exercises are submitted to GitHub, so Git must be installed and you should know how to use it. For instructions, see Git and GitHub tutorial for beginners.

Install a sensible text editor that supports web development. Visual Studio Code is highly recommended.

Don't code with nano, Notepad or Gedit. NetBeans isn't very good for web development either. It is also rather heavy in comparison to Visual Studio Code.

Also, install Node.js. The material has been done with version 18.13.0, so don't install any version older than that. See Node.js installation instructions.

Node package manager npm will be automatically installed with Node.js. We will be actively using npm throughout the course. Node also comes with npx, which we'll need a few times.

Typos in the material

If you find a typo in the material, or something has been expressed unclearly or is simply bad grammar, submit a pull request to the course material in the repository. For example, the markdown source code of this page can be found in the repository at https://github.com/fullstack-hy2020/fullstack-hy2020.github.io/edit/source/src/content/0/en/part0a.md

At the bottom of each part of the material is a link to propose changes to the material. You can edit the source code of the page by clicking on the link.

There are also lots of links in the material for many kinds of background material. If you notice that a link is broken (that happens too often...), propose a change or ping us in Discord if you do not find a replacement for the broken link.