Web Development (10 cr)

Objective

After completing the course, the student
• knows the principles of building full stack web applications
• knows client and server side technologies and understands how communication between client and server sides is implemented
• understands how to test a web application.

Content

Front end side / client side programming
• HTML, CSS
• JavaScript
• DOM
• Asynchronous communication
• Client side application frameworks (e.g. Vue.js, React.js)

Communication and data transfer
• HTTP
• REST
• JSON

Back end side / server side programming
• JavaScript, Node.js
• Server side application frameworks (Express)
• Use of databases (SQL and NoSQL)

Testing of full stack applications

Materials

Course materials will be provided in advance, enabling you to come prepared for each session and group work.
You'll receive clear guidelines on when and how to utilize ChatGPT effectively.
There is no required textbook for the course; all necessary materials will be furnished by the instructor.

Teaching methods

The course will be conducted using a blended approach.

The first and final classes will be held on campus, while the remaining sessions will take place virtually on Zoom.

The teaching strategy used in this course follows a MODIFIED version of team-based learning.

Student workload

This course is worth 10 ECTS. The workload is 27 hours per credit, ensuring a comprehensive learning journey. In addition to the scheduled sessions, you should allocate time each week for self-study and group work.

Content scheduling

This course is structured into two distinct parts: Backend Web Development and Frontend Web Development.

Part A: Backend Web Development

Module 1/3: Introduction to Backend Development
Browser Engines vs. JavaScript Engines
V8 JavaScript Engine
Node.js Fundamentals
Introduction to Express.js Framework

Module 2/3: Building with Express.js
Express.js Routers
Express.js Middleware
Express.js Controllers
Working with MongoDB and Mongoose
Authentication
Authorization and Roles
API Documentation and Best Practices

Module 3/3: Advanced Concepts and Deployment
Node Modules: Import vs. CommonJS Require
Error Handling and Logging
Where to Go Next in BackendDevelopment

Part B: Frontend Web Development

Module 1/3: Introduction to Frontend Development
Single Page Applications (SPAs)
Introduction to Ajax
DOM vs. Virtual DOM
Introduction to React.js

Module 2/3: Building with React.js
React Components and Component Structure
React JSX: Syntax and Benefits
Styling React Components
Passing Data with React Props
Working with Lists in React
State Management with useState Hook
Side Effects and Lifecycle with useEffect Hook
Context API with useContext Hook
State Management with useReducer Hook
React Router
Custom Hooks

Module 3/3: Advanced Topics and Integration
React Authentication Techniques
User Administration and CRUD Operations
Where to Go Next in Frontend Development

Further information

This course (Web Development TX00EY23-3001) runs in parallel with the "Web Project" course, forming a comprehensive curriculum. These two courses equip you with key programming skills in both front-end and back-end technologies. As the digital landscape evolves, the ability to create dynamic and interactive web applications is more valuable than ever. Throughout this journey, you'll learn to develop and deploy real-world full stack applications, secure them, and deploy them effectively.

This course starts with fundamental concepts of web development. As you progress you will be introduced to additional theory, web technologies, tools and libraries.

In addition, you'll gain collaborative experiences through group activities. You will team up with your peers and you will be introduced to soft skills such as, problem solving, discipline, lifelong learning and communication.

By the end of the course, you will be equipped with enough knowledge to put together multiple technologies. Not only you will learn how to code, but also how to think and act like a programmer.

Evaluation scale

0-5

Assessment criteria, satisfactory (1)

The student
• has achieved the objectives of the course to a satisfactory level
• is able to identify and define the concepts, models and in the subject area of the course
• has completed the learning tasks required for the course to the minimum standard.

Assessment criteria, good (3)

The student
• has achieved the objectives of the course well
• is able to identify, define and use the concepts, models and tools in the subject area of the course
• has completed the learning tasks of the course at a good level.

Assessment criteria, excellent (5)

The student
• has achieved the objectives of the course with excellent marks
• is able to identify, define and use and apply the concepts and models in the subject area of the course in a variety of ways
• has completed the learning tasks of the course at an excellent level and has put considerable own effort into their solutions.

Assessment criteria, approved/failed

The student
• has achieved the objectives of the course
• is able to identify and define concepts and models in the subject area of the course
• has completed the learning tasks required for the course.

Assessment methods and criteria

The grading structure is designed to reflect your understanding of both backend and frontend concepts, as well as your ability to integrate them effectively.

The assessment considers in-class activities, peer assessment and Exam.
The course is designed to enable every student to succeed, with three grading levels: Level 1 (Grade 1), Level 2 (Grades 2-3), and Level 3 (Grades 4-5).
The potential to achieve the highest grade is available to every student, reflecting the effort and dedication invested in the course.

Your grade will be determined based on the following components:

In-Class Activities (30%)
Individual homework (20%)
Feedback (5%)
Exam (45%)

Qualifications

1st year studies (Orientation to Information Technology 60 ECTS) of the Information Technology Degree Programme.