a
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. New for this year's course are parts on TypeScript, React Native and Continuous integration.
Other topics include debugging applications, configuration, managing runtime environments and NoSQL databases.
Prerequisites
Participants are expected to have good programming skills, basic knowledge of web programming and databases, and mastery of basic use of the Git version management 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.
Course material
The course material is meant to be read one part at a time, reading each part all the way through before moving on to the next one.
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 probably 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 nine parts, the first of which is numbered 0 for historical reasons. A part loosely corresponds to one week of studying. The parts are published in a faster phase, however, and the speed of completing the course is quite flexible.
Proceeding from part n to part n+1 is not sensible before good enough know-how of the topics of part n has been achieved. In pedagogic terms, the course uses mastery learning, and the intent is for you to proceed to the next part only after doing enough of the exercises of the previous part.
You are expected to do at least all of the exercises that are not marked with a star(*). Exercises marked with a star count towards your final grade, but skipping them does not prevent you from doing the compulsory exercises in the next part.
The part deadlines are at Mondays 23:59.
osa | deadline |
---|---|
parts 0 and 1 | Monday 30.1. |
part 2 | Monday 6.2. |
part 3 | Monday 13.2. |
part 4 | Monday 20.2. |
part 5 | Monday 27.2. |
parts 6 and 7 | Monday 13.3. |
Statistics on the time used for exercises which have already been submitted on different parts of this course can be found from submission sytem.
Help for the exercises
You can discuss the course and related topics in our dedicated group on Discord https://study.cs.helsinki.fi/discord/join/fullstack and on Telegram https://t.me/fullstackcourse. Please join the conversation!
How to ask help in Discord/Telegam
When you ask for help for a problem in the Discord/Telegram group your question should be as informative and precise as possible. If your question look like this
Adding a new person does not work, could you help me with that?
it is quite likely that nobody will not bother to answer to you. The bug can be anywhere.
A better question could be
In the exercise 2.15 when I try to add a new person to the app, server responds to 403, despite the request looks 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 debuging
The following gets printed to the console
// data printed to console
The network tab looks like the following
[screen shot from the network console]
All the code can be found here (a link to GitHub)
Grading
Course is worth 5-7 credits depending on the number of submitted exercises. The grade and number of credits are determined by the number of submitted exercises, so also the exercises without stars count towards your final grade.
Course has also exam that you must pass for a accepted grade. The exam does not count towards your grade. The exam is in Moodle between 10th and 12th March. The exam time is 2 hours from the moment you start the exam.
Credits and grades are calculated as follows:
excercises | credits | grade |
---|---|---|
138 | 7 | 5 |
127 | 6 | 5 |
116 | 5 | 5 |
105 | 5 | 4 |
94 | 5 | 3 |
83 | 5 | 2 |
72 | 5 | 1 |
Note that for an accepted grade you must pass the exam.
Extending your course in Open University
You can extend your course in the Open university that does not have any deadlines. The open version contains some more parts and it is worth 5 to 14 credits.
Submitting exercises
The exercises are submitted through GitHub and marking them as done on the submission system.
If you are submitting exercises from different parts to the same repository, use some sensible 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. 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.
Full stack project
A full stack project worth 5, 7, 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.
For more information, see the Open University page.
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. Instructions for Git can be found in this tutorial.
Install some 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. The examples in the material will work quite likely also with earlier versions, but if you want to play safe, install the same verion. Installation instructions are here.
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, do 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-HY/FullStack-Hy.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 material. You can edit the source code of the page by clicking on the link.