Web Programming

Course Title: Web Programming

Course No: ENCT 330

Nature of the Course: Theory + Lab

Semester: 5

Full Marks: 60 + 40 + 25

Pass Marks: 24 + 16 + 8

Credit Hours: 3

Course Description

This course focuses on the fundamental concepts of web technologies, spanning client-side and server-side web programming. It systematically examines JavaScript and modern front-end frameworks, moves through backend frameworks and database integration into web services and APIs, and progresses into web application security, concluding in deployment practices and modern trends in web development.

Course Objectives

The objective of this course is to provide comprehensive understanding of web technologies for developing responsive and interactive web applications. The course emphasizes the use of modern front-end frameworks and tools, as well as techniques for integrating front-end interfaces with back-end APIs and databases. By the end of the course, students will be able to design, implement and evaluate contemporary applications while exploring current trends and future directions in web development.

Course Contents

1. Introduction

6 hrs8 marks

1.1. Overview of web applications and evolution of web architecture

1.2. Client-server architecture, HTTP, HTTPS, URLs, DNS, web browsers

1.3. Html basics: Syntax, tags, attributes, forms and inputs, tables, lists, multimedia, semantic HTML5 elements

1.4. CSS basics: Selectors, properties, values, box model

1.5. CSS framework: Bootstrap

2. JavaScript and Client-Side Programming

12 hrs16 marks

2.1. JavaScript essentials

Data types, variables, control structures, functions

Dom manipulation, events, and form validation

Local storage and session storage

GUI interactions

JavaScript library: jQuery

2.2. Modern JavaScript (ES6+)

Arrow functions, destructuring, spread/rest operators

Callbacks, promises, async/await

Modules and imports

2.3. Client-side applications

Client-side web application development using React JS library

Traditional multi-page apps vs. single-page apps (SPAs)

Component-based UI and props

State management and data flow

Client-side routing and navigation without reloads

Fetch API: Fetching, displaying data, handling errors and loading states

Comparison of modern JavaScript libraries: React, Angular, Vue

3. Server-Side Web Programming

9 hrs12 marks

3.1. MVC architecture in web development

3.2. Role of backend in web applications

3.3. Backend web framework: Django

3.4. Handling requests and responses

3.5. Form data handling and sessions

3.6. Routing, middleware, templating concepts

3.7. Overview and comparison of backend frameworks: Django, flask, fastapi, dot NET MVC framework, ruby on rails, java spring boot, node.js

3.8. Database integration: Relational versus NoSQL, CRUD operations, ORM concept

3.9. Authentication and authorization: Cookies, sessions, JWT

3.10. Middleware for logging, error handling, and security

4. Web Services and APIs

7 hrs9 marks

4.1. API basics: Role in web applications

4.2. REST principles and design, RESTful APIs

4.3. JSON versus XML data exchange

4.4. Data validation and serialization

4.5. Microservices

5. Web Application Security

6 hrs8 marks

5.1. Common vulnerabilities: XSS, SQL injection, CSRF

5.2. Security best practices: Input validation, sanitization, https, secure cookies, env variables

5.3. Authentication practices and token handling

5.4. Security in full-stack apps: CORS, safe sessions

6. Web Application Deployment and Modern Trends

5 hrs7 marks

6.1. Full-stack development

6.2. Testing and QA

6.3. DevOps, continuous integration (CI) and continuous delivery (CD)

6.4. Progressive web apps (PWAs), responsive design and usability

Laboratory Works

(15 hours)

1.Build a responsive personal portfolio page using semantic HTML5, CSS grid/flexbox, and media queries
2.Create a dynamic to-do list app with DOM events, local storage, and JavaScript event handling (using jQuery)
3.Develop a CRUD application (e.g., library system) using a server-side framework (Django/Flask/FastAPI)
4.Create a frontend in React that fetches data from your backend API and displays it dynamically.
5.Extend the CRUD app with user authentication (Login/logout), form validation, and secure token/session handling

Reference Books

1.Copes, F. (2019). The JavaScript Handbook. (https://flaviocopes.com/the-javascript-handbook-2019-edition/)
2.Nixon, R. (2025). Learning PHP, MySQL & JavaScript: A Step-by-Step Guide to Creating Dynamic Websites. O'Reilly Media.
3.Vincent, W. S. (2025). Django for Beginners: Build websites with Python and Django.
4.Richardson, L., & Amundsen, M. (2013). RESTful Web APIs: Services for a Changing World. O'Reilly Media.
5.Hoffman, A. (2024). Web Application Security: Exploitation and Countermeasures for Modern Web Applications (2nd ed.). O'Reilly Media.

Notes:

This syllabus follows the official BEI curriculum of Tribhuvan University. In case of any doubt or revision, the university’s published syllabus shall be considered authoritative. https://ioe.tu.edu.np/pages/electronics-engineering-curriculum-structure-2660

Web Application Programming