Course Registration

• Please register regularly for the course via TUMonline, later on all information will be provided via Moodle.
• The registration on TUMonline will be open from 03.03. until 18.04. There is no FCFS.
• Course allocations will be announced until 18.04.
• Deadline for team registrations is the 04. of Mai (see Organization of the Module below).
• Information Systems M.Sc. students receive a gurranteed place. Students from all other study programs will receive the remaining places (if there are any).
  In the past years only a tiny percentage of non Information Systems M.Sc. students received a place!
• If you've just finished your bachelor degree and about to start your Information Systems, M.Sc. but are not officially enrolled yet on TUMonline, please send an email to seba-master.sebis(at)tum.de with your letter of admission.

Organization of the Module

The lectures will be held onsite in Garching. The interactive central exercises (optional) will be held online via Zoom.

Assignments will be distributed via Moodle and must be handed in at the respective deadlines via GitLab.

The graded presentations will be held onsite in Garching.

This module is declared as project work and consists of a lecture and a practical part. The practical part (project) is conducted through multiple assignments where students come up with a business idea and develop a web application using the MERN stack thereby applying the concepts presented in the lecture and central exercise.

The project will be done in teams consisting of exactly four students. In general, registered students are randomly assigned teams. However, students will also be able to form a team.

Due to capacity constraints regarding supervision the amount of total places is limited to 160 (40 teams). Since this module is mandatory for students of Information Systems (M.Sc.), they are given precedence.

Over the course of the semester, we will have 3 presentation blocks. Each presentation block lasts 3-4 days and has approx. 12 slots in total (~3-4 slots per day). We will assign each student team to one of these 12 slots for each presentation block. Each team must be present only in its assigned slot. In each slot there will be 4 student teams, each of them having max 20 min for presentation and discussion.

Content

The master course SEBA Master: Web Application Engineering provides the necessary theoretical foundations to design and develop state-of-the art web applications. Next to the technical aspects to develop applications for the web, business aspects are covered with the most common business models and explained with real-world examples.

The students learn how to design web sites from the scratch including patterns for recurring problems. Technical aspects for the development of web applications are presented along with generic platforms and architectures. Students participating in the exercise apply this knowledge in individual projects that cover all aspects from the lecture with the design and development of a web application.  

1. Web Site Genres
   • Business Models on the Web
2. Web Site Design Process & Patterns
   • Key Issues of Customer-Centered Web Design
   • Knowing Your Customers
   • Involving Customers with Iterative Design
   • Additional Viewpoints and Aspects
   • An Overview of Web Design Patterns
3. Developing Single-Page Web Applications
   • HTML & CSS Concepts
   • JavaScript Basics
   • Web Components
   • Single-Page Applications
4. Developing Single-Page Web Applications with React
   • Web Application Framework Comparison
   • Basic Concepts of the Chosen Framework
   • State Management
   • Navigation and Routing
   • Client-Server Communication
   • Consuming RESTful Services
5. Building REST-enabled Backend Services
   • Target architecture and development environment
   • Event-driven architecture and asynchronous I/O operations with node.js
   • Creating REST interfaces using Express
   • Using document oriented database storage: MongoDB example
   • Enabling user authentication on the web service using JSON web token (JWT)
6. Advanced Topics in Web Application Engineering
   • Real-time Web Applications
   • Hybrid Web Applications  
7. High Performance Web Applications
   • Database options for web applications
   • Scaling web applications 

Lecture and exercise dates

Assessment Method / Grading

The student's performance is primarily assessed on the basis of presentations and deliverables in the context of a project work assignment consisting of three milestones.

The individual milestones are defined as follows:

1. Business Idea and Business Model (10%)
   Contents of the assessment:
   • Identifying, explaining and developing business models in the web
   • Develop your business model with BMC and describe your product's value proposition
   • Presentation of your specific business model
2. Customer Journey, Personas, Mockups, Data Model (15%)
   Contents of the assessment:
   • Selecting and applying patterns for web application design
   • Explaining a user-centered, iterative development process and applying it in a team
   • Create your software architecture by using UML standards
   • Explaining and selecting state-of-the-art technologies for the implementation of web applications
     (This encompasses both client- and server-side aspects)
   • Explain the main features of your web application by creating a customer journey
   • Create mockups which cover your customer journey
3. Final Prototype (75%)
   Contents of the assessment:
   • Quality and complexity of your developed web application
   • Explaining web-based integration techniques
   • Presenting scientific topics to an audience
   • Presentation of the final prototype of your web application

Additional skills: Presentation, rhetoric, team communication, project work

Each team presents the results of each assignment in a 10-minute (20 for final) presentation, followed up by a 10-minute discussion.

Prerequisites

Knowledge and skills at the bachelor's level (Informatics/Business Informatics) in software engineering, programming and databases.

Intended Learning Outcomes

At the end of the module students understand successful patterns of customer-centric web sites, and they are able to explain their business and social impacts. They understand the technological challenges that arise in the implementation of industrial strength web applications. They are able to address purposefully these technological challenges using commercial and open source systems and technologies as well as proven technical architectures. At the end of the lecture they have sufficient knowledge to contribute to scientific and development projects in this area.

References

“Exploring ES6” – Axel Rauschmayer, Ecmanauten, http://exploringjs.com/es6/

“Business model generation: A Handbook for Visionaries, Game Changes, and Challenges” - Alexander Osterwalder, Yves Pigneur, John Wiley & Sons, 2010

“Don't make me think! Web Usability: Das intuitive Web” - Steve Krug, New Riders Press; 2 edition, 2005

“Designing the Obvious. A Commonsense Approach to Web Application Design” - Robert Hoekman, New Riders Press; 1 edition, 2006

JavaScript Tutorial - https://javascript.info/

„Express – Web Framework for Node.js“ – http://expressjs.com/

„Official React Tutorial “ – react.dev, https://react.dev/learn