Tehnologii Web

Săptămâna 1

• Prezentare generală

  administrative info, examination, rules, team

• Curs: World Wide Web – aspecte arhitecturale

  concepts, client/server model, hypertext, Web resource, URI, Web site, Web application

• Demo: The Mother of All Demos

• Resurse: The History of the Web

• Laborator: Limbajul de marcare HTML – de studiat HTML5 în XXX de minute

  • Resurse: HTML Tutorials (MDN), HTML5 Exercises

  • Instrumente: Command Line Interactions, Cu codul în "nori"; editare cod-sursă: Visual Studio Code + VS Code on Web + extensii + Programming Fonts – de interes: VS Code can do that?!; W3C Validator

Săptămâna 2

• Curs: Programare Web – protocolul HTTP + script-uri CGI

  Web server, HTTP, headers, message, media types, Web programming, CGI

• Demo: Warriors of the Net, Exemple de script-uri CGI (arhivă zip, 21K), How NASA Took Control of Its HTTPS Mission, HTTPS at Google

• Resurse: An overview of HTTP (MDN), The HTTP Series, HTTP (DevDocs), HTTP Status Codes, How HTTPS Works, HTTP/2 Explained, HTTP/3 Explained, HAR (HTTP Archive) Format, Arhitectura navigatorului Web

• Instrumente: clienţi HTTP: cURL, Wget, httpbin; performanţă Web (caching, load balancing, (reverse) proxy): Apache Traffic Server, HAProxy (de parcurs An Introduction to HAProxy and Load Balancing Concepts), Squid, Varnish, YARP; instrumente + extensii pentru clientul Web privind intimitatea/discreţia (privacy): Privacy Tools, Ghostery, uBlock Origin, Privacy Badger, DuckDuckGo App; HTTPS: Certbot, Moving to HTTPS Guide

• Laborator: Foi de stiluri în cascadă – CSS

Supliment Web

• Tutorial: Arhitectura serverului Web

  Web, HTTP, server, httpd, Apache, configuration, module, security, DevOps

• Resurse: What is DevOps? (GitHub), Apache Tutorials, Apache @ Digital Ocean, Apache + ModSecurity Tutorials, Apache vs Nginx: Practical Considerations

• Instrumente: servere Web: Apache HTTP Server (de interes: .htaccess Snippets + Apache Security Hardening Guide), Lighttpd, Microsoft IIS, Nginx

Săptămâna 3

• Curs: Programare Web – cookie-uri + sesiuni Web

  Web programming, Web server, Web client, HTTP, cookie, stateless, Web session

• Resurse: Using HTTP Cookies (MDN), Cookiepedia, Session Management Cheat Sheet, Do Not Track

• Curs: Programare Web – Inginerie Web. MVC

  Web programming, Web application, Web engineering, MVC, management

• Demo: Web Skills, Ten Years Ago, Software Engineering at Google, Killed by Google, The Google Cemetery

• Resurse: Dezvoltator Web?!, Software Architecture Guide, How To Be A Programmer, Getting Real (Basecamp), Software Architecture Playbook, aim42, The 12-Factor App, MVC and Its Alternatives, Web Development Reading List

• Instrumente: Online Tools for Web Developers, Web Developer Checklist, Free for Devs, GitHub Collections, Search Awesome Lists

• Laborator: Foi de stiluri în cascadă – CSS (continuare) + Design (Web) responsiv

Săptămâna 4

• Curs: Programare Web – Arhitectura aplicaţiilor Web. Servere de aplicaţii Web. PHP

  Web, software architecture, programming, development, application server, PHP, tools, examples

• Demo: arhitecturi Web: Building a Photo Sharing Website, Magento Architecture, GitLab Architecture, Stack Overflow, Tech Stacks, Real Life Architectures; programare Web: Exemple de programe PHP (arhivă zip, 45K)

• Resurse: PHP Tutorial, PHP: The Right Way, PHP Manual, PHP Best Practices, PHP Weekly, Best Gitter channels: PHP

• Instrumente: RealWorld – "The Mother of All Demo Apps", Awesome PHP

• Laborator: Design & interacţiune Web + discuţii privind proiectele

Săptămâna 5

• Curs: Programare Web – Dezvoltarea aplicaţiilor Web în PHP (continuare)

  Web, programming, development, application server, PHP, tools, examples

• Demo: Exemple de programe PHP (arhivă zip, 45K)

• Resurse: Design Patterns in PHP, PDO Tutorial

• Instrumente: Awesome PHP, HHVM

• Laborator: Programare Web în PHP – tutoriale video: PHP Front To Back, PHP Tutorial: PHP Full Course

  • Resurse: HTML Forms Guide (MDN), Learn PHP, PHP Tutorial for Beginners, PHP Exercises, Redirect After Post, Clean Code PHP

  • Instrumente: Replit, AMPPS, XAMPP (portable version), WinNMP, Code Beautify, Open Source Libraries

Săptămâna 6

• Curs: Programare Web – Dezvoltarea aplicaţiilor Web în PHP (continuare)

  Web, programming, development, application server, PHP, tools, examples

• Demo: Exemple de programe PHP (arhivă zip, 45K)

• Resurse: Modern PHP without a Framework, PHP Framework Interop Group, PHP—The Wrong Way, The Definitive PHP 7.x and 8.x Benchmarks (2023)

• Curs: Modelarea datelor. Familia XML. SVG

  data, modeling, semi-structure, XML, examples

• Demo: Exemple de documente XML (arhivă zip, 19K)

• Resurse: Tehnologii XML, XML News & Articles, Stop Comparing JSON and XML

• Instrumente: Comparison of XML editors

• Laborator: Programare Web în PHP

  • Resurse: PHP Database Extensions, Awesome SQLite, SQLite3 PHP Tutorial, Awesome MySQL, Awesome PostgreSQL, Awesome NoSQL Guides, MongoDB PHP Tutorial, Using Neo4j from PHP, DB Weekly

  • Instrumente: Adminer, phpMyAdmin, phpLiteAdmin

Săptămâna 7

• Curs: Modelarea datelor. Familia XML. SVG (continuare)

  data, modeling, XML, namespace, SVG, examples

• Demo: SVG: Grafică vectorială (arhivă zip, 4K) – SVG în HTML, Animaţii simple cu SVG, Un traseu (marcaje + căi SVG), Un document SVG de sine-stătător, SVG + CSS = ✭

• Studii de caz: Really Simple Syndication, Scalable Vector Graphics (MDN), Sitemaps XML Format, Keyhole Markup Language (Google), XML Periodic Table

• Instrumente: Awesome SVG

• Curs: Procesarea datelor XML & HTML. Document Object Model

  XML, processing, DOM, interface, WebIDL, XPath, events, Web programming, examples

• Demo: Procesări XML şi HTML folosind DOM (arhivă zip, 22.5K)

• Resurse: Document Object Model (MDN), DOM Enlightenment, DOM @ DevDocs.io, Information contained in a WebIDL file (MDN)

• Instrumente: Live DOM Viewer; programare: DOM în PHP, Java API for XML Processing (Oracle), jsdom, Happy DOM, System.Xml (Microsoft), Expat, libxml; la nivel de browser Web: How to manage HTML DOM, You Don't Need jQuery, Can I use DOM?; pentru aplicaţii mobile: DOM for Android (Google), XML Processing in Swift (Apple)

• Laborator: Programare Web în PHP

  • Resurse: Interactive Application Architecture Patterns, Build a PHP MVC Application, PHP Templating, Unit Testing with PHPUnit

  • Instrumente: PHP on AWS, PHP on Azure, PHP on Heroku

Săptămâna 8

• Livrarea resurselor obligatorii pentru evaluarea componentei I a proiectului

Săptămâna 9

• Curs: Procesarea datelor XML & HTML. Document Object Model (continuare)

  XML, DOM, asynchronous data transfer, Ajax, Fetch API, examples

• Demo: Generarea unui formular Web, Interacţiune Web via Ajax (arhivă zip, 9K), RandomAjax, RandomAjax (Fetch), Fetch API Examples (MDN)

• Resurse: Tehnologii XML, Ajax (MDN), XMLHttpRequest vs the Fetch API

• Laborator: Programare Web în PHP – procesarea şi generarea datelor XML/HTML

Supliment Web

• Tutorial: Dezvoltarea de aplicaţii Web cu Node.js

  Web, development, server, Node.js, JavaScript, programming, npm

• Demo: Exemple de programe Node.js (arhivă zip, 22K); studii de caz: #nodejs stories (Hacker Noon)

• Resurse: Limbajul JavaScript. Aspecte esenţiale, Limbajul JavaScript. Aspecte moderne, Ingineria dezvoltării aplicaţiilor JavaScript, NodeSchool, Tao of Node, Best Practices for Node.js Development (Heroku), Node.js Style Guide, Node.js Best Practices List, Express Web Framework Tutorial (MDN), The MERN Stack, Node Weekly, Awesome Developers Who Stream

• Instrumente: Replit, Awesome Node.js, Node.js in Visual Studio Code, AWS SDK for JavaScript (Amazon), Azure for JavaScript & Node.js Developers (Microsoft), Node.js on Google Cloud, Node.js on Heroku, Deno, Bun

Săptămâna 10

• Curs: Servicii Web. Arhitecturi bazate pe servicii. Paradigma REST

  Web service, architecture, SOA, REST, transfer, state, representation, implementation, examples

• Demo: Invocarea de servicii Web REST (arhivă zip, 3K) + studii de caz: HTTP Cats, PokéAPI, Star Trek API, APIfootball, Open Banking Tracker

• Resurse: The Annotated SOA Manifesto, Service-Oriented Architecture (IBM), SOA (InfoQ), Principles of Service Orientation, Learn REST: A RESTful Tutorial, REST for an Hour, Designing a True REST State Machine, Q&As regarding REST, API Technical and Data Standards (gov.uk), REST API Guidelines (Microsoft), A Comparison of Serialization Formats

• Instrumente: Awesome REST, Client URL Library for PHP, The Open Guide to Amazon Web Services

• Laborator: Programare Web în PHP – transferuri asincrone de date via Ajax

Săptămâna 11

• Curs: Servicii Web. Micro-servicii. Serverless. Specificarea API-urilor. GraphQL

  Web service, architecture, microservice, serverless, OpenAPI, OAuth, GraphQL, examples

• Demo: Todo-Backend; micro-servicii: Microservices with PHP, Sock Shop. A Microservices Demo Application, Microservices Architecture at Netflix, Modern Banking in 1500 Microservices; serverless: OpenFaaS Architecture, Exploring Serverless Use-Cases; GraphQL: Rapid Development with GraphQL Microservices (Netflix), GitHub GraphQL API, PizzaQL

• Resurse: proiectarea API-urilor REST: API Stylebook, Web APIs: From Start to Finish; micro-servicii: Dezvoltarea de aplicaţii Web bazate pe micro-servicii, How to break a Monolith into Microservices, Microservice Architecture, Micro Frontends; serverless: Aspecte arhitecturale vizând dezvoltarea de aplicaţii serverless, Serverless Architectures, Serverless Status; specificarea API-urilor REST: OpenAPI Initiative, OpenAPI-Driven API Design (Swagger); autorizare & autentificare: An OAuth 2.0 Introduction for Beginners, OAuth 2 Simplified; GraphQL: GraphQL – A Query Language for Your API, The Fullstack Tutorial for GraphQL, GraphQL Blog

• Instrumente: HTTPie, Insomnia, Postman, REST APIs Collection, Awesome Microservices, Awesome Serverless, OpenAPI Tools, JSON Web Tokens, OAuth Libraries, Certified OpenID Connect Implementations, Awesome GraphQL, GraphQL APIs

• Laborator: Implementarea şi invocarea serviciilor Web – de experimentat DBnomics API, Hacker News API, Hyrule Compendium API şi/sau NASA Open APIs

Săptămâna 12

• Curs: Servicii Web. Alte arhitecturi de aplicaţii Web: SPA, PWA, mash-up-uri. JAMstack

  Web service, architecturi, SPA, PWA, mash-up, CORS, JAMstack, examples

• Demo: Humans & Dogs Web Mash-up

• Resurse: Single Page Application, Progressive Web Apps (MDN), Cross-Origin Resource Sharing (MDN), CORS Tutorial (Auth0), New to JAMstack? (Snipcart), JAMstack, JAMstacked

• Instrumente: Public APIs, Free and Open Public APIs, SPA Open Source Projects, Awesome JAMstack, The New Dynamic

• Laborator: Implementarea şi invocarea serviciilor Web – de experimentat Random User API, Joke API, IP Address Location API

Săptămâna 13

• Curs: Securitatea aplicaţiilor Web. Aspecte esenţiale

  Web security, vulnerability, risk, attack, prevention, guidelines, examples

• Demo: HTTPS on Stack Overflow, Website Malware Infections, Phishing with Unicode Domains, The Inception Bar: A New Phishing Method , Pizza & Payments, Owning a Webcam, Reverse engineering the Facebook Messenger API, Hacking Facebook accounts using CSRF in Oculus-Facebook integration

• Resurse: An Introduction to Information Security, The Basics of Web Application Security, OWASP, Hacker 101, PHP Security, Awesome Web Security, Modern Web Security, Search Engine for Security Intelligence

• Laborator: Implementarea şi invocarea serviciilor Web

Săptămâna 14

• Curs: Securitatea aplicaţiilor Web. Aspecte esenţiale (continuare)

  Web security, vulnerability, risk, attack, prevention, guidelines, examples

• Demo: Parsing JSON is a Minefield, An Exploration of JSON Interoperability Vulnerabilities, GraphQL Batching Attack, OAuth 2.0 Authentication Vulnerabilities, SAML XML Injection, 3.6 Million Websites Taken Offline after Fire

• Resurse: OWASP Cheat Sheet Series, Social Engineering, SQL Injection, SSRF, CPDoS: Cache Poisoned Denial of Service, ReDoS: Regular Expression Denial of Service, XML Security, HTTP Security Headers, Hardening HTTP Security Headers, Mobile API Security Techniques, Web Security Articles (DZone), The Internet Bug Bounty, Site Reliability Engineering Books

• Instrumente: Awesome Security, Awesome PHP Security, Exploit Database, Awesome Cryptography, PHP Cryptography Extensions, XSStrike, XSS Game, DVWA, DVGA, Post-mortems, BeEF, Hack This Site, KONTRA's OWASP Top 10 for API, CryptoHack

• Laborator: Lucru la proiect

Remarci

• Pentru vizualizarea prezentărilor se poate folosi un program capabil să proceseze documentele PDF.

• Conţinutul acestei pagini poate fi oricând alterat, fără o notificare prealabilă, trebuind considerat drept work in progress.

• Simbolul indică o resursă suplimentară – de interes mai ales pentru avansaţi.