Online Environment Tools (Software Engineering)
| Structure Type: | Study unit |
|---|---|
| Code: | IT00BL21 |
| Curriculum: | IT 2024 |
| Level: | Bachelor of Engineering |
| Year of Study: | 2 (2025-2026) |
| Semester: | Spring |
| Credits: | 5 cr |
| Responsible Teacher: | Kankaanpää, Timo |
| Language of Instruction: | English |
Taking the course in advance? See the courses during the academic year 2024-2025.
Learning Outcomes
The student gains competence to develop modern web based user interface library (e.g. React) using strongly typed programming language (TypeScript). The main focus during the course is to understand the structure and main characteristics of the strongly typed language. This way the students learns how to develop applications for easy maintenance and improved performance.
The student also leans how to utilize various existing back end architectures (REST, GraphQL, SparQL or Solid). The
student gains understanding about the difference of synchronous and asynchronous functions while communicating between the components or the back end. The student can use in the future the modern functions and libraries to manipulate functions, objects and arrays (spread, rest, array functions, export/import, class, destructuring). Also the student gets familiar utilizing open source libraries (MUI, Apollo, Solid React). The student also knows the main user authentication and authorization methods (OpenID, IDP, OAuth, OAuth2, SSO, Shibboleth, LDAP). Student will be able to use various third party authentication methods (Google, Facebook, Linkedin Azure AD). Also the student knows how to debug and find errors and performance bottle necks in source code.
Student's Workload
135 h, of which 50 hours of scheduled contact teaching.
Prerequisites / Recommended Optional Courses
Introduction to programming, front-end development
Contents
Variable types. Type interface and interface types. Transpiling the source code for browser compatibility. Using generic and passing typed variable between the components. Storing the typed component to state (Context/Redux or Recoil). Fetching type data from server. Using authentication and authorization services from server.
Recommended or Required Reading and Other Learning Resources/Tools
TypeScript 4.5 (https://www.typescriptlang.org/docs/handbook/release-notes/overview.html). The TypeScript Handbook (https://www.typescriptlang.org/docs/handbook/intro.html). Theo Despoudis: TypeScript 4 Design Patterns and Best Practices(https://learning.oreilly.com/library/view/typescript-4-design/9781800563421/).
https://learning.oreilly.com/videos/react-the/9781801812603/9781801812603-video2_1/
An Illustrated Guide to OAuth and OpenID Connect (https://developer.okta.com/blog/2019/10/21/illustrated-guide-to-oauth-and-oidc)
https://betterprogramming.pub/7-must-know-typescript-transpiled-features-e2365cce17e2#:~:text=Typescript%20does%20transpile%20into%20Javascript,features%20out%20of%20the%20box.
Mode of Delivery / Planned Learning Activities and Teaching Methods
Weekly based small online tests about the concepts. Weekly based assignments. Pair work.
Assessment Criteria
Grade 5: The student is able design architecture and implement a TypeScript based React application using state management library
Grade 3: The student is able develop designed user interface components using Typescript language and fetch data from the back end
Grade 1: The student know the basic interfaces of TypeScript and is able to implement components based on given criteria
Assessment Methods
Weekly assignments 30%, weekly quizzes 30%, student pair based project work 40%.