Ingénierie du WebAdministration réseaux et système (STI)
Web Engineering
Séquencement
Learning objectives
The aim of this course is to provide students with the basic technical knowledge necessary for a modern web application, addressing its architecture, design and development. Particular attention will also be paid to the security of web applications, in order to raise students' awareness of the main vulnerabilities and associated protection mechanisms, including injections, XSS attacks, the Same-Origin Policy (SOP) security model, Resource Sharing between Origins (CORS) and Content Security Policy (CSP).
Prerequisites
| Module | Teaching unit | Semester |
|---|---|---|
| Introduction to Computer Networks | PO STI 1 | S3 |
| Introduction to Relational Databases | PO STI 2 | S4 |
| Algorithms and Programming 1 | Optional Constitutive Elements 1 | S1 |
Program
Course 1 — Discovering the Web: The Fundamentals Internet and Web: essential concepts Client/server architecture Browser, Web server, Web application URL, domain, DNS HTTP and HTTPS Request / HTTP response HTTP methods and response codes Cookies and sessions: introduction
Objective: Understand what happens when a user enters a URL in their browser
Course 2 — Building a Web Page: HTML and CSS Structure of an HTML page Elements and attributes HTML forms Semantic HTML CSS: selectors, properties and layout Flexbox / Grid Responsive design Good Organizational Practices HTML/CSS
Objective: Build a simple and properly structured web interface.
Course 3 — Program browser side: JavaScript Role of JavaScript Variables, functions, objects Events DOM Dynamic one-page handling Validation of forms Asynchronous programming: introduction fetch() : first approach
Purpose: To make a web page interactive.
Course 4 — Understanding the architecture of a Web application Architecture 2-third and 3-third Presentation layer Business logic layer Data layer Web server Application server Database server MVC architecture: introduction
Purpose: to move from "I know how to make a web page" to "I understand how a web application is organized."
Course 5 — Back-End Development with PHP Role of Back-End PHP and query processing Variables, functions and control structures Forms and user data Dynamic HTML Generation Sessions and cookies Organisation of a PHP application
Objective: to develop a first server-side processing.
Course 6 — Data Persistence: SQL Why a database? Relationship model Tables, keys and relationships SQL SELECT, INSERT, UPDATE, DELETE Joints PHP database ODP Prepared requests Making a CRUD
Objective: To develop an application that can store and manipulate data.
Course 7 — REST APIs and Architecture Why use an API? Front-End Architecture / Back-End REST and resources URI GET, POST, PUT/PATCH, DELETE HTTP codes JSON Develop a simple API in PHP Consume an API with JavaScript and fetish()
Objective: To understand the architecture of modern Web applications.
Course 8 — Web Security and Frameworks
Part 1: Security
Validation of entries SQL Injection XSS CSRF Authentication/authorisation Secure password storage HTTPS
Part 2: frameworks
Why use a framework? MVC Routing Controllers Models ORM Introduction to a Web framework
Objective: To understand why professional applications use frameworks and what problems they solve.
TP1 — 4 hours Development of a complete web application
I would give a subject simple enough to be feasible in four hours.
For example:
Student project management application
A student may:
Create an account; connect; consult projects; create a project; modify a project; delete a project; consult with project members.
TP2 — 4 hours Moving towards a modern web application
The application of TP1 is being started again.
Students must:
turning certain features into REST API; exchange data in JSON format; use fetch() side JavaScript ; set up authentication; correcting some vulnerabilities; structure the application according to a cleaner architecture; discover the organization of an MVC framework.
The goal is not to teach them a complete framework in 4 hours.
Rather, it is about making them understand:
"This is how we move from a simple PHP application to a structured web application like those you will encounter in a professional project. »
Assessment
MCQs and a partial
References
Develop a website in Php, Mysql and Javascript, Jquery, CSS3 and HTML5, Robin Nixon