O prelegere din cadrul materiei "aplicaţiilor Web la nivel de client" (CLIW), fondată și predată de Sabin Buraga la Facultatea de Informatică a Universității "Alexandru Ioan Cuza" din Iași.
Detalii la https://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
Prelegere din cadrul materiei "Dezvoltarea aplicaţiilor Web cu JavaScript" (Full-Stack Web Development) predată de Dr. Sabin Buraga (oct.2019–feb.2020).
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/staw/web-film.html
Diverse aspecte privind ingineria dezvoltării aplicaţiilor JavaScript, inclusiv utilizarea instrumentelor software specifice. Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2015-2016 (6/13) (Re)găsirea resurselor Web. De la motoare de căutare și...Sabin Buraga
Detalii privind căutarea resurselor Web. De la motoare de căutare și SEO la date structurate (microformate + scheme de date HTML5). Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2017-2018 (12/12) Performanţa aplicaţiilor Web la nivel de clientSabin Buraga
O prelegere din cadrul materiei "aplicaţiilor Web la nivel de client" (CLIW), fondată și predată de Sabin Buraga la Facultatea de Informatică a Universității "Alexandru Ioan Cuza" din Iași.
Detalii la https://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
Considerații vizând proiectarea siturilor Web, inclusiv detalii despre design vizual (layout, tipografie, cromatică etc.) și design Web responsiv. Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
Detalii despre cele mai importante API-uri JavaScript standardizate specifice HTML5 pe care le oferă navigatoarele Web actuale, inclusiv diverse exemple. Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
Diverse aspecte de interes privind ingineria dezvoltării aplicațiilor JavaScript, inclusiv utilizarea instrumentelor software specifice. Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
Prelegere din cadrul materiei "Dezvoltarea aplicaţiilor Web cu JavaScript" (Full-Stack Web Development) predată de Dr. Sabin Buraga (oct.2019–feb.2020).
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/staw/web-film.html
Diverse aspecte privind ingineria dezvoltării aplicaţiilor JavaScript, inclusiv utilizarea instrumentelor software specifice. Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2015-2016 (6/13) (Re)găsirea resurselor Web. De la motoare de căutare și...Sabin Buraga
Detalii privind căutarea resurselor Web. De la motoare de căutare și SEO la date structurate (microformate + scheme de date HTML5). Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2017-2018 (12/12) Performanţa aplicaţiilor Web la nivel de clientSabin Buraga
O prelegere din cadrul materiei "aplicaţiilor Web la nivel de client" (CLIW), fondată și predată de Sabin Buraga la Facultatea de Informatică a Universității "Alexandru Ioan Cuza" din Iași.
Detalii la https://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
Considerații vizând proiectarea siturilor Web, inclusiv detalii despre design vizual (layout, tipografie, cromatică etc.) și design Web responsiv. Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
Detalii despre cele mai importante API-uri JavaScript standardizate specifice HTML5 pe care le oferă navigatoarele Web actuale, inclusiv diverse exemple. Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
Diverse aspecte de interes privind ingineria dezvoltării aplicațiilor JavaScript, inclusiv utilizarea instrumentelor software specifice. Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
Prelegere din cadrul materiei "Dezvoltarea aplicaţiilor Web cu JavaScript" (Full-Stack Web Development) predată de Dr. Sabin Buraga (oct.2019–feb.2020).
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/staw/web-film.html
Informații referitoare la arhitectura generală a unui navigator Web, inclusiv exemple specifice fiecărui browser în parte. Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2017-2018 (1/12) Interacţiune Web: de la concepte & utilizabilitate la d...Sabin Buraga
O prelegere din cadrul materiei "aplicaţiilor Web la nivel de client" (CLIW), fondată și predată de Sabin Buraga la Facultatea de Informatică a Universității "Alexandru Ioan Cuza" din Iași.
Detalii la https://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
O prelegere din cadrul materiei "aplicaţiilor Web la nivel de client" (CLIW), fondată și predată de Sabin Buraga la Facultatea de Informatică a Universității "Alexandru Ioan Cuza" din Iași.
Detalii la https://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2017-2018 (3/12) (Re)găsirea resurselor Web. De la motoare de căutare şi...Sabin Buraga
O prelegere din cadrul materiei "aplicaţiilor Web la nivel de client" (CLIW), fondată și predată de Sabin Buraga la Facultatea de Informatică a Universității "Alexandru Ioan Cuza" din Iași.
Detalii la https://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2015-2016 (12/13) Performanța aplicaţiilor Web la nivel de clientSabin Buraga
O privire generală privind performanța aplicațiilor Web la nivel de client (tehnici, strategii, exemple reale și altele). Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2015-2016 (1/13) Interacțiune Web: concepte, context, studii de cazSabin Buraga
Interacțiune Web: noțiuni de bază precum interacțiune om-calculator (HCI), interfață cu utilizatorul (UI), experiența utilizatorului (UX) și altele. Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2017-2018 (4/12) Vizualizarea datelor – o privire de ansambluSabin Buraga
O prelegere din cadrul materiei "aplicaţiilor Web la nivel de client" (CLIW), fondată și predată de Sabin Buraga la Facultatea de Informatică a Universității "Alexandru Ioan Cuza" din Iași.
Detalii la https://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2015-2016 (10/13) Programare Web. Suita de tehnologii HTML5Sabin Buraga
O viziune de ansamblu asupra suitei de tehnologii HTML5, plus exemple referitoare la generarea de conținut multimedia via SVG sau via elementul canvas. Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2015-2016 (7/13) Limbajul de programare JavaScriptSabin Buraga
Aspecte esențiale referitoare la limbajul de programare JavaScript (de la sintaxa de bază la obiecte & date JSON). Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
STAW 11/12: Performanţa aplicaţiilor Web la nivel de clientSabin Buraga
Prelegere din cadrul materiei "Dezvoltarea aplicaţiilor Web cu JavaScript" (Full-Stack Web Development) predată de Dr. Sabin Buraga (oct.2019–feb.2020).
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/staw/web-film.html
STAW 06/12: JavaScript în navigatorul Web. De la DOM la Ajax şi mash-up-uriSabin Buraga
Prelegere din cadrul materiei "Dezvoltarea aplicaţiilor Web cu JavaScript" (Full-Stack Web Development) predată de Dr. Sabin Buraga (oct.2019–feb.2020).
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/staw/web-film.html
An overview of HTML5.
O prezentare generală referitoare la suita de tehnologii HTML5, incluzând aspecte legate de grafică vectorială (SVG) și raster (via <canvas> și JavaScript), plus informații despre microdatele HTML5 pe baza modelelor schema.org.
Web 2016 (03/13) Programare Web – Servere de aplicații. Arhitectura aplicații...Sabin Buraga
Tehnologii Web (prezentările aferente disciplinei predate de Sabin Buraga la Facultatea de Informatică, Universitatea A.I. Cuza din Iași) – detalii la http://profs.info.uaic.ro/~busaco/teach/courses/web/web-film.html
O prelegere din cadrul materiei "aplicaţiilor Web la nivel de client" (CLIW), fondată și predată de Sabin Buraga la Facultatea de Informatică a Universității "Alexandru Ioan Cuza" din Iași.
Detalii la https://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
Web 2020 03/12: Programare Web – Arhitectura aplicaţiilor Web. Inginerie WebSabin Buraga
Prelegere din cadrul materiei "Tehnologii Web" predată de Dr. Sabin Buraga.
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/web/web-film.html
CLIW 2017-2018 (7/12) JavaScript în navigatorul Web. De la DOM la Ajax şi mas...Sabin Buraga
O prelegere din cadrul materiei "aplicaţiilor Web la nivel de client" (CLIW), fondată și predată de Sabin Buraga la Facultatea de Informatică a Universității "Alexandru Ioan Cuza" din Iași.
Detalii la https://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
Prelegere din cadrul materiei "Dezvoltarea aplicaţiilor Web cu JavaScript" (Full-Stack Web Development) predată de Dr. Sabin Buraga (oct.2019–feb.2020).
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/staw/web-film.html
Informații referitoare la arhitectura generală a unui navigator Web, inclusiv exemple specifice fiecărui browser în parte. Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2017-2018 (1/12) Interacţiune Web: de la concepte & utilizabilitate la d...Sabin Buraga
O prelegere din cadrul materiei "aplicaţiilor Web la nivel de client" (CLIW), fondată și predată de Sabin Buraga la Facultatea de Informatică a Universității "Alexandru Ioan Cuza" din Iași.
Detalii la https://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
O prelegere din cadrul materiei "aplicaţiilor Web la nivel de client" (CLIW), fondată și predată de Sabin Buraga la Facultatea de Informatică a Universității "Alexandru Ioan Cuza" din Iași.
Detalii la https://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2017-2018 (3/12) (Re)găsirea resurselor Web. De la motoare de căutare şi...Sabin Buraga
O prelegere din cadrul materiei "aplicaţiilor Web la nivel de client" (CLIW), fondată și predată de Sabin Buraga la Facultatea de Informatică a Universității "Alexandru Ioan Cuza" din Iași.
Detalii la https://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2015-2016 (12/13) Performanța aplicaţiilor Web la nivel de clientSabin Buraga
O privire generală privind performanța aplicațiilor Web la nivel de client (tehnici, strategii, exemple reale și altele). Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2015-2016 (1/13) Interacțiune Web: concepte, context, studii de cazSabin Buraga
Interacțiune Web: noțiuni de bază precum interacțiune om-calculator (HCI), interfață cu utilizatorul (UI), experiența utilizatorului (UX) și altele. Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2017-2018 (4/12) Vizualizarea datelor – o privire de ansambluSabin Buraga
O prelegere din cadrul materiei "aplicaţiilor Web la nivel de client" (CLIW), fondată și predată de Sabin Buraga la Facultatea de Informatică a Universității "Alexandru Ioan Cuza" din Iași.
Detalii la https://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2015-2016 (10/13) Programare Web. Suita de tehnologii HTML5Sabin Buraga
O viziune de ansamblu asupra suitei de tehnologii HTML5, plus exemple referitoare la generarea de conținut multimedia via SVG sau via elementul canvas. Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2015-2016 (7/13) Limbajul de programare JavaScriptSabin Buraga
Aspecte esențiale referitoare la limbajul de programare JavaScript (de la sintaxa de bază la obiecte & date JSON). Detalii la http://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
STAW 11/12: Performanţa aplicaţiilor Web la nivel de clientSabin Buraga
Prelegere din cadrul materiei "Dezvoltarea aplicaţiilor Web cu JavaScript" (Full-Stack Web Development) predată de Dr. Sabin Buraga (oct.2019–feb.2020).
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/staw/web-film.html
STAW 06/12: JavaScript în navigatorul Web. De la DOM la Ajax şi mash-up-uriSabin Buraga
Prelegere din cadrul materiei "Dezvoltarea aplicaţiilor Web cu JavaScript" (Full-Stack Web Development) predată de Dr. Sabin Buraga (oct.2019–feb.2020).
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/staw/web-film.html
An overview of HTML5.
O prezentare generală referitoare la suita de tehnologii HTML5, incluzând aspecte legate de grafică vectorială (SVG) și raster (via <canvas> și JavaScript), plus informații despre microdatele HTML5 pe baza modelelor schema.org.
Web 2016 (03/13) Programare Web – Servere de aplicații. Arhitectura aplicații...Sabin Buraga
Tehnologii Web (prezentările aferente disciplinei predate de Sabin Buraga la Facultatea de Informatică, Universitatea A.I. Cuza din Iași) – detalii la http://profs.info.uaic.ro/~busaco/teach/courses/web/web-film.html
O prelegere din cadrul materiei "aplicaţiilor Web la nivel de client" (CLIW), fondată și predată de Sabin Buraga la Facultatea de Informatică a Universității "Alexandru Ioan Cuza" din Iași.
Detalii la https://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
Web 2020 03/12: Programare Web – Arhitectura aplicaţiilor Web. Inginerie WebSabin Buraga
Prelegere din cadrul materiei "Tehnologii Web" predată de Dr. Sabin Buraga.
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/web/web-film.html
CLIW 2017-2018 (7/12) JavaScript în navigatorul Web. De la DOM la Ajax şi mas...Sabin Buraga
O prelegere din cadrul materiei "aplicaţiilor Web la nivel de client" (CLIW), fondată și predată de Sabin Buraga la Facultatea de Informatică a Universității "Alexandru Ioan Cuza" din Iași.
Detalii la https://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
CLIW 2017-2018 (5/12) Limbajul de programare JavaScript. Aspecte esenţialeSabin Buraga
O prelegere din cadrul materiei "aplicaţiilor Web la nivel de client" (CLIW), fondată și predată de Sabin Buraga la Facultatea de Informatică a Universității "Alexandru Ioan Cuza" din Iași.
Detalii la https://profs.info.uaic.ro/~busaco/teach/courses/cliw/web-film.html
Prelegere din cadrul materiei "Dezvoltarea aplicaţiilor Web cu JavaScript" (Full-Stack Web Development) predată de Dr. Sabin Buraga (oct.2019–feb.2020).
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/staw/web-film.html
Dezvoltarea aplicatiilor orientate spre servicii Web. De la REST la mash-up-u...Sabin Buraga
A presentation (available in Romanian language) about RESTful Web service development, including several considerations regarding mash-ups & APIs.
For other details, visit http://profs.info.uaic.ro/~busaco/teach/courses/wade/web-film.html
Prelegere din cadrul materiei "Dezvoltarea aplicaţiilor Web cu JavaScript" (Full-Stack Web Development) predată de Dr. Sabin Buraga (oct.2019–feb.2020).
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/staw/web-film.html
Web 2020 12/12: Securitatea aplicaţiilor Web. Aspecte esenţialeSabin Buraga
Prelegere din cadrul materiei "Tehnologii Web" predată de Dr. Sabin Buraga.
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/web/web-film.html
Prelegere din cadrul materiei "Dezvoltarea aplicaţiilor Web cu JavaScript" (Full-Stack Web Development) predată de Dr. Sabin Buraga (oct.2019–feb.2020).
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/staw/web-film.html
Similar to CLIW 2017-2018 (11/12) Programare Web. API-uri JavaScript în contextul HTML5 (II) (20)
Web 2020 01/12: World Wide Web – aspecte arhitecturaleSabin Buraga
Prelegere din cadrul materiei "Tehnologii Web" predată de Dr. Sabin Buraga.
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/web/web-film.html
Web 2020 02/12: Programare Web – HTTP. Cookie-uri. Sesiuni WebSabin Buraga
Prelegere din cadrul materiei "Tehnologii Web" predată de Dr. Sabin Buraga.
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/web/web-film.html
Web 2020 04/12: Programare Web – Dezvoltarea aplicaţiilor Web în PHP Sabin Buraga
Prelegere din cadrul materiei "Tehnologii Web" predată de Dr. Sabin Buraga.
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/web/web-film.html
Web 2020 05/12: Modelarea datelor. Familia XML. Extragerea datelor cu XPath. ...Sabin Buraga
Prelegere din cadrul materiei "Tehnologii Web" predată de Dr. Sabin Buraga.
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/web/web-film.html
Web 2020 06/12: Procesarea datelor XML & HTML. Document Object ModelSabin Buraga
Prelegere din cadrul materiei "Tehnologii Web" predată de Dr. Sabin Buraga.
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/web/web-film.html
Web 2020 07/12: Procesarea datelor XML & HTML – Simple API for XML. Procesări...Sabin Buraga
Prelegere din cadrul materiei "Tehnologii Web" predată de Dr. Sabin Buraga.
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/web/web-film.html
Web 2020 08/12: Servicii Web. De la arhitecturi orientate spre servicii la SO...Sabin Buraga
Prelegere din cadrul materiei "Tehnologii Web" predată de Dr. Sabin Buraga.
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/web/web-film.html
Web 2020 09/12: Servicii Web. Paradigma RESTSabin Buraga
Prelegere din cadrul materiei "Tehnologii Web" predată de Dr. Sabin Buraga.
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/web/web-film.html
Web 2020 10/12: Servicii Web. Micro-servicii. Serverless. Specificarea API-ur...Sabin Buraga
Prelegere din cadrul materiei "Tehnologii Web" predată de Dr. Sabin Buraga.
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/web/web-film.html
Web 2020 11/12: Interacţiune Web asincronă. Aplicaţii Web de tip mash-up. JAM...Sabin Buraga
Prelegere din cadrul materiei "Tehnologii Web" predată de Dr. Sabin Buraga.
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/web/web-film.html
Prelegere din cadrul materiei "Dezvoltarea aplicaţiilor Web cu JavaScript" (Full-Stack Web Development) predată de Dr. Sabin Buraga (oct.2019–feb.2020).
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/staw/web-film.html
Prelegere din cadrul materiei "Dezvoltarea aplicaţiilor Web cu JavaScript" (Full-Stack Web Development) predată de Dr. Sabin Buraga (oct.2019–feb.2020).
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/staw/web-film.html
STAW 08/12: Programare Web. Suita de tehnologii HTML5Sabin Buraga
Prelegere din cadrul materiei "Dezvoltarea aplicaţiilor Web cu JavaScript" (Full-Stack Web Development) predată de Dr. Sabin Buraga (oct.2019–feb.2020).
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/staw/web-film.html
Prelegere din cadrul materiei "Dezvoltarea aplicaţiilor Web cu JavaScript" (Full-Stack Web Development) predată de Dr. Sabin Buraga (oct.2019–feb.2020).
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/staw/web-film.html
STAW 12/12: (Re)găsirea resurselor Web. De la motoare de căutare şi SEO la da...Sabin Buraga
Prelegere din cadrul materiei "Dezvoltarea aplicaţiilor Web cu JavaScript" (Full-Stack Web Development) predată de Dr. Sabin Buraga (oct.2019–feb.2020).
Resurse suplimentare la https://profs.info.uaic.ro/~busaco/teach/courses/staw/web-film.html
O prezentare referitoare la dezvoltarea aplicațiilor Web dedicată elevilor de liceu. Prelegerea a fost susținută în cadrul Școlii de vară SummerIS organizată la Universitatea Alexandru Ioan Cuza din Iași, Facultatea de Informatică (iulie 2019).
A presentation regarding Web application development delivered to high-school students, a part of the SummerIS summer school organized at the Faculty of Computer Science, Alexandru Ioan Cuza University of Iasi, Romania (July 2019).
HCI 2018 (2/10) Human Factor. From interaction idioms to human capacities & c...Sabin Buraga
A lecture delivered for Human-Computer Interaction, a post-graduate level discipline taught by Dr. Sabin Buraga at Faculty of Computer Science, Alexandru Ioan Cuza University of Iasi, Romania.
Visit also https://profs.info.uaic.ro/~busaco/teach/courses/hci/hci-film.html
HCI 2018 (3/10) Design Models, Methodologies and GuidelinesSabin Buraga
A lecture delivered for Human-Computer Interaction, a post-graduate level discipline taught by Dr. Sabin Buraga at Faculty of Computer Science, Alexandru Ioan Cuza University of Iasi, Romania.
Visit also https://profs.info.uaic.ro/~busaco/teach/courses/hci/hci-film.html
HCI 2018 (4/10) Information Architecture. From Design Patterns to Visual DesignSabin Buraga
A lecture delivered for Human-Computer Interaction, a post-graduate level discipline taught by Dr. Sabin Buraga at Faculty of Computer Science, Alexandru Ioan Cuza University of Iasi, Romania.
Visit also https://profs.info.uaic.ro/~busaco/teach/courses/hci/hci-film.html
HCI 2018 (5/10) Information Architecture. From Design Patterns to FlowSabin Buraga
A lecture delivered for Human-Computer Interaction, a post-graduate level discipline taught by Dr. Sabin Buraga at Faculty of Computer Science, Alexandru Ioan Cuza University of Iasi, Romania.
Visit also https://profs.info.uaic.ro/~busaco/teach/courses/hci/hci-film.html
5. Dr.SabinBuragawww.purl.org/net/busaco
Pointer Events
unifică maniera de preluare de date – via mouse ori
suprafețe tactile – în urma interacțiunii cu utilizatorul
pointer = a hardware agnostic representation of
input devices that can target
a specific (set of) coordinate(s) on a screen
recomandare W3C: www.w3.org/TR/pointerevents/
în lucru (din 2016): www.w3.org/TR/pointerevents2/
8. Dr.SabinBuragawww.purl.org/net/busaco
PointerLock API
oferă acces la date primare vizând mișcările mouse-ului
atunci când interacțiunea se axează (e „blocată”)
asupra unui element specific fără a se reda cursorul
util pentru aplicații de editare/modelare 3D, jocuri 3D,…
recomandare W3C (2016): www.w3.org/TR/pointerlock/
Editor’s Draft (august 2017): www.w3.org/TR/pointerlock-2/
12. Dr.SabinBuragawww.purl.org/net/busaco
Clipboard API and Events
tipuri MIME (Media-Types) uzuale ce pot fi folosite
pentru interschimb de date via clipboard:
text/plain text/uri-list text/csv text/html
application/json application/xml text/xml
17. Dr.SabinBuragawww.purl.org/net/busaco
Web Notifications
// o notificare de interes
var notif = new Notification ("Ha, ha! Ai primit o notă la CLIW!",
{ icon: "nota10.svg", tag: "mesaj" });
onclick = function () { afișeazăMesaj (this); };
tutorial + exemple:
developer.mozilla.org/docs/WebAPI/Using_Web_Notifications
22. Dr.SabinBuragawww.purl.org/net/busaco
var video = document.getElementById ("film");
// auto-rulare a filmului dacă documentul e vizibil
if (document.visibilityState == "visible") {
video.play ();
}
function trateazăModificareaVizibilității () {
if (document.visibilityState == "hidden") { // dacă e ascuns, oprim filmul
video.pause ();
} else {
video.play ();
}
}
document.addEventListener ('visibilitychange',
trateazăModificareaVizibilității, false);
de studiat developer.mozilla.org/Web/API/Page_Visibility_API
34. Dr.SabinBuragawww.purl.org/net/busaco
WebRTC
permite preluarea în timp-real a fluxurilor de date
audio/video și interschimbul acestora
între browser-ele Web fără a necesita un intermediar
utilizări:
tele-conferințe
interschimb de fișiere
managementul identității utilizatorului
…
38. Dr.SabinBuragawww.purl.org/net/busaco
<video id="monitor" autoplay="autoplay"></video>
// accesul la conținut multimedia local furnizat de un senzor
// (cameră Web, microfon,…) pe baza acordului utilizatorului
navigator.getUserMedia (
{ video: true, // pot fi impuse diverse constrângeri
audio: true }, // în acest caz, dorim și video și audio
prelucreazaFlux, trateazaErori
);
var video = document.getElementById ('monitor');
function prelucreazaFlux (flux) {
video.src = URL.createObjectURL (flux); // ‘alimentăm’ cu flux video
video.onerror = function () { flux.stop (); }; // eroare, deci oprim fluxul
flux.onended = function () { /* transmisia s-a terminat */ };
…
}
50. Dr.SabinBuragawww.purl.org/net/busaco
Streams API
fluxurile abstractizează accesul la date stocate parțial
având asociate primitive I/O de nivel scăzut
suplimentar, fluxurile pot fi înlănțuite – pipes:
ieșirea unui fluxintrarea altuia,
cu blocarea (locking) a acestor fluxuri
backpressure = controlul „debitului” mesajelor
transmise prin pipe-uri
51. Dr.SabinBuragawww.purl.org/net/busaco
Streams API
pot fi citite – ReadableStream – de către un consumator,
în regim pull sau push
fragmentele de date (chunks) sunt preluate dintr-o coadă
de mesaje, putând fi citit doar unul la un moment dat
datele binare pot fi citite via un flux de tip BYOB
(Bring Your Own Buffer): ReadableStreamBYOBReader
52. Dr.SabinBuragawww.purl.org/net/busaco
class ReadableStream { // definiție ES6
constructor(underlyingSource = {}, { size, highWaterMark } = {})
get locked () // este blocat (are asociat un lacăt)?
cancel (reason) // anulează operația de citire
getReader ()
// suport pentru realizarea de pipe-uri
pipeThrough ({ writable, readable }, options)
pipeTo (dest, { preventClose, preventAbort, preventCancel } = {})
// blochează fluxul, creând 2 fluxuri ramificate ce pot fi consumate
// independent (duplicarea sursei de date) – similar comenzii tee din Unix
tee ()
}
pentru detalii, a se studia:
developer.mozilla.org/Web/API/Streams_API/Concepts
developer.mozilla.org/Web/API/ReadableStream
53. Dr.SabinBuragawww.purl.org/net/busaco
Streams API
pot fi scrise – WritableStream – de un producător
datele scrise (chunks) se „acumulează” într-un „dren”
(underlying sink) care abstractizează
efectuarea operațiilor I/O de nivel scăzut
starea unui flux de scriere poate fi controlată de
programator via WritableStreamDefaultController
54. Dr.SabinBuragawww.purl.org/net/busaco
class WritableStream { // definiție ES6
constructor (underlyingSink = {}, { size, highWaterMark = 1 } = {})
get locked () // este blocat (are asociat un lacăt)?
abort (reason) // abandonează scrierea
getWriter ()
}
detalii + exemple demonstrative:
developer.mozilla.org/Web/API/Streams_API/Using_writable_streams
github.com/mdn/dom-examples/tree/master/streams
jakearchibald.com/2016/streams-ftw/
56. Dr.SabinBuragawww.purl.org/net/busaco
Streams API
realizează o transformare a datelor – TransformStream –
și constă dintr-o pereche de fluxuri
(unul de scriere, celălalt de citire)
posibile utilizări:
(de)compresie de date prin GZIP, aplicarea în timp-real de efecte
vizuale asupra datelor transmise de Webcam, (de)codificare a
textului într-un sistem P2P conversațional, conversie de formate
(e.g., CSV↔JSON), implementarea unui tunel folosind socket-uri Web
59. Dr.SabinBuragawww.purl.org/net/busaco
se pot defini contexte audio
în care se pot aplica diverse procesări/filtre specifice
exemple: mixaje, modificări ale volumului (e.g., fade-in),
interschimb de canale stereo, prelucrări în timp-real
pe baza MediaStream, integrare cu WebRTC, efecte spațiale
(e.g., concert hall, forest, amphitheater), compresie,…
67. Dr.SabinBuragawww.purl.org/net/busaco
Web Audio API
exemplificări + tutoriale:
scenarii diverse de utilizare
developer.mozilla.org/Web/API/Web_Audio_API/Using_Web_Audio_API
webaudio.github.io/demo-list/
interacțiuni multimedia via camera Web
github.com/chrisjohndigital/OpenLang
vizualizarea datelor sonore
developer.mozilla.org/Web/API/Web_Audio_API/Visualizations_with_Web_Audio_API
70. Dr.SabinBuragawww.purl.org/net/busaco
Web MIDI API
suport pentru protocolul MIDI (Musical Instrument
Digital Interface) ce permite interacțiunea dintre
instrumente/dispozitive muzicale și navigatorul Web
în lucru la Consorțiul Web (7 noiembrie 2017)
webaudio.github.io/web-midi-api/
76. Dr.SabinBuragawww.purl.org/net/busaco
Generic Sensor API
senzor fizic = măsoară anumite cantități fizice și oferă
date neprelucrate (raw sensor readings) privind un aspect
specific utilizatorului sau mediului înconjurător
fiecare informație oferită (observație) are o valoare +
timpul determinării acelei valori – reading timestamp
77. Dr.SabinBuragawww.purl.org/net/busaco
Generic Sensor API
senzor fizic = măsoară anumite cantități fizice și oferă
date neprelucrate (raw sensor readings) privind un aspect
specific utilizatorului sau mediului înconjurător
fiecare informație oferită (observație) are o valoare +
timpul determinării acelei valori – reading timestamp
discrepanțele cunoscute între datele colectate și valoarea
reală ce trebuie măsurată sunt corectate prin calibrare
79. Dr.SabinBuragawww.purl.org/net/busaco
Generic Sensor API
senzorii pot fi:
de nivel superior (high-level sensor type)
numiți după datele preluate
exemplificare: geolocalizator
(maniera prin care sunt calculate datele expuse nu este
necesar a fi cunoscută și poate depinde de anumiți factori)
94. Dr.SabinBuragawww.purl.org/net/busaco
// informații despre poziția curentă + data observării acesteia
interface Position {
readonly attribute Coordinates coords;
readonly attribute DOMTimeStamp timestamp;
};
// coordonate geografice conform WGS84
interface Coordinates {
readonly attribute double latitude;
readonly attribute double longitude;
readonly attribute double? altitude;
readonly attribute double accuracy;
readonly attribute double? altitudeAccuracy;
readonly attribute double? heading;
readonly attribute double? speed;
};
95. Dr.SabinBuragawww.purl.org/net/busaco
// opțiuni privind preluarea poziției geografice
dictionary PositionOptions {
// se dorește acuratețe maximă?
boolean enableHighAccuracy = false;
// timp-limită (în milisecunde); dacă e depășit, se emite eroarea TIMEOUT
[Clamp] unsigned long timeout = 0xFFFFFFFF;
// programul poate accepta o valoare din cache a poziției (0 = poziția actuală)
[Clamp] unsigned long maximumAge = 0;
};
// erori raportate
interface PositionError {
const unsigned short PERMISSION_DENIED = 1;
const unsigned short POSITION_UNAVAILABLE = 2;
const unsigned short TIMEOUT = 3;
readonly attribute unsigned short code;
readonly attribute DOMString message;
};
96. Dr.SabinBuragawww.purl.org/net/busaco
navigator.geolocation.getCurrentPosition (
proceseazaDate, // funcție prelucrând datele privind poziția geografică
trateazaErori, // nu s-a putut determina localizarea
{ // diverși parametri de control
enableHighAccuracy: true,
timeout: 10000, // așteaptă max 10000 milisec. pentru a primi date
maximumAge: 8000 // preia din cache date privind poziția
} // dacă nu-s mai vechi de 8000 de milisecunde
);
function proceseazaDate (localizare) {
alert ('latitudine: ' + localizare.coords.latitude +
'longitudine: ' + localizare.coords.longitude);
}
a se folosi watchPosition()
pentru a prelua localizarea geografică în mod continuu
104. Dr.SabinBuragawww.purl.org/net/busaco
Presentation API
acces din browser la ecrane de prezentare a conținutului
(presentation displays) – e.g., proiector, monitor video,
TV conectat prin rețea – atașate clientului prin fir
(HDMI, DVI) sau fără fir (AirPlay, DLNA, Chromecast)
W3C Editor’s Draft (8 noiembrie 2017)
w3c.github.io/presentation-api/
105. Dr.SabinBuragawww.purl.org/net/busaco
Presentation API
interfețe de interes:
Presentation PresentationRequest PresentationAvailability
PresentationConnectionAvailableEvent PresentationConnection
PresentationConnectionCloseEvent PresentationReceiver
PresentationConnectionList
107. Dr.SabinBuragawww.purl.org/net/busaco
Remote Playback API
privește redarea la distanță a conținutului multimedia
via tehnologii de conectare cu/fără fir
extinde API-urile referitoare la conținut audio/video
W3C Candidate Recommendation (19 octombrie 2017)
www.w3.org/TR/remote-playback/
108. Dr.SabinBuragawww.purl.org/net/busaco
Beacon API
se referă la realizarea de cereri unidirecționale (one-way
requests) pentru a obține date în mod asincron,
non-blocant, minimizând consumul de resurse
W3C Candidate Recommendation (13 aprilie 2017)
www.w3.org/TR/beacon/
109. Dr.SabinBuragawww.purl.org/net/busaco
Beacon API
partial interface Navigator {
// transmite asincron date prin HTTP spre un server Web;
// întoarce true dacă browser-ul a plasat cu succes datele
// în coada de transfer
boolean sendBeacon (USVString url, optional BodyInit? data = null);
};
nu se oferă nicio funcție de tratare a răspunsului
developer.mozilla.org/Web/API/Navigator/sendBeacon
111. Dr.SabinBuragawww.purl.org/net/busaco
Push API
permite trimiterea spre aplicația disponibilă la client
de mesaje via un serviciu de tip push
pe baza HTTP Push (RFC 8030)
aceste mesaje sunt livrate unui service worker
rulând în aceeași origine cu cea a aplicației
W3C Working Draft (15 decembrie 2017)
www.w3.org/TR/push-api/
114. Dr.SabinBuragawww.purl.org/net/busaco
Vibration API
interfața Navigator este extinsă cu metoda vibrate ()
// vibrează timp de 2000 de milisecunde
navigator.vibrate (2000);
// vibrează 50 milisecunde, așteaptă 200, apoi vibrează 100 milisecunde
navigator.vibrate ([50, 200, 100]);
// oprește orice acțiune de vibrare
navigator.vibrate (0);
de studiat și developer.mozilla.org/Web/API/Vibration_API
123. Dr.SabinBuragawww.purl.org/net/busaco
Web ubicuu la nivel fizic – physical Web
dispozitiv fizic capabil să expună un URL
e.g., prin Bluetooth pe baza Web Bluetooth API
github.com/WebBluetoothCG/web-bluetooth
scanner/browser = entitate ce scanează, recunoaște,
procesează și prezintă un set de URL-uri
proxy = un serviciu Web (în „nori”) opțional cu rol de
protejare a utilizatorului + îmbunătățire a performanței
124. Dr.SabinBuragawww.purl.org/net/busaco
Web ubicuu la nivel fizic – physical Web
☁dispo-
zitiv
☗ difuzare
URL
client Web
analiză +
optimizare
proxy
aplicație/serviciu Web
procesare resursă
extragere meta-date
①
②
③
④
diverse direcții de interes:
automatizarea spațiilor de locuit (home automation),
industria auto (smart car), orașe „inteligente” (smart city),
reclame contextuale (smart advertising)
🖼
129. Dr.SabinBuragawww.purl.org/net/busaco
Payment Request API
procesul de a realiza o plată
e modelat de interfața PaymentRequest
detaliile vizând plata sunt emise asincron
via PaymentRequestUpdateEvent
răspunsul primit de la procesatorul plătii
este specificat de interfața PaymentResponse
PaymentAddress – informații despre adresa poștală
132. Dr.SabinBuragawww.purl.org/net/busaco
Payment Request API
specificații adiționale – în lucru:
Payment Handler (3 decembrie 2017)
w3c.github.io/payment-handler/
Payment Method: Basic Card (29 noiembrie 2017)
w3c.github.io/payment-method-basic-card/
Payment Method Manifest (12 decembrie 2017)
w3c.github.io/payment-method-manifest/
133. Dr.SabinBuragawww.purl.org/net/busaco
Specificații vizând securitatea browser-ului
Content Security Policy
a mechanism by which Web developers can control
the resources which a particular page can fetch or execute
recomandare a Consorțiului Web (2016)
www.w3.org/TR/CSP2/
în lucru w3c.github.io/webappsec-csp/
134. Dr.SabinBuragawww.purl.org/net/busaco
Specificații vizând securitatea browser-ului
Content Security Policy
poate preveni atacuri – precum XSS (Cross-Site Scripting) –
pe baza câmpului-antet HTTP Content-Security-Policy
pentru detalii + exemple, de studiat:
content-security-policy.com
developers.google.com/web/fundamentals/security/csp/
developer.mozilla.org/en-US/docs/Web/HTTP/CSP
135. Dr.SabinBuragawww.purl.org/net/busaco
Specificații vizând securitatea browser-ului
Upgrade Insecure Requests
allows authors to instruct a user agent to upgrade
a priori insecure resource requests to secure transport
before fetching them
recomandare a Consorțiului Web (2015)
www.w3.org/TR/upgrade-insecure-requests/
136. Dr.SabinBuragawww.purl.org/net/busaco
Specificații vizând securitatea browser-ului
Tracking Preference Expression (DNT)
vizează acțiunea de user tracking (colectarea datelor
despre utilizator, inclusiv platforma client a acestuia)
pe care o poate realiza un sit/aplicație Web
W3C Candidate Recommendation (19 octombrie 2017)
www.w3.org/TR/tracking-dnt/
137. Dr.SabinBuragawww.purl.org/net/busaco
Specificații vizând securitatea browser-ului
Tracking Preference Expression (DNT)
alături de câmpul-antet DNT dintr-un mesaj HTTP,
se definește atributul doNotTrack
și se specifică modul în care se poate permite
o operație de tip user tracking
developer.mozilla.org/Web/API/Navigator/doNotTrack
139. Dr.SabinBuragawww.purl.org/net/busaco
Specificații vizând securitatea browser-ului
Referrer Policy
regulile de acces – valori "" "same-origin" "strict-origin"
"no-referrer" "no-referrer-when-downgrade" "unsafe-url" etc. –
pot fi precizate în antetul HTTP (Referrer-Policy)
sau în cadrul documentului HTML cu atributul referrerpolicy
asociat elementelor <meta> <a> <img> <iframe> <link>
141. Dr.SabinBuragawww.purl.org/net/busaco
Specificații vizând securitatea browser-ului
Web Cryptography API
permite efectuarea de operații criptografice, inclusiv
generare/verificare de semnături, management de chei,
suport pentru tehnici criptografice actuale și altele
W3C Recommendation (26 ianuarie 2017)
www.w3.org/TR/WebCryptoAPI/
146. Dr.SabinBuragawww.purl.org/net/busaco
HTML5
semantic markup
noi marcaje precum <header> <nav> <section> <aside>…
noi tipuri de interacțiune via formulare Web
includerea diverselor tipuri de conținut precum SVG
microdate – vezi inițiativa schema.org
conținut editabil
atribute specifice aplicațiilor: data-
147. Dr.SabinBuragawww.purl.org/net/busaco
HTML5
prezentarea conținutului via foi de stiluri CSS
facilități CSS: animații, tranziții, transformări, coloane,…
www.w3.org/standards/techs/css#w3c_all
interogări privind mediile de redare (media queries)
suport pentru designul Web responsiv
utilizarea fonturilor externe – Web fonts
156. Dr.SabinBuragawww.purl.org/net/busaco
Web Components
suita de tehnologii HTML5 oferă premisele
implementării de componente Web la nivel de client
ce pot fi împachetate și reutilizate în funcție de context
webcomponents.org
www.w3.org/wiki/WebComponents/
157. Dr.SabinBuragawww.purl.org/net/busaco
Web Components
elemente specificate de dezvoltator – Custom Elements
(ciornă, octombrie 2016):
www.w3.org/TR/custom-elements/
import de construcții HTML – HTML Imports
(în lucru, februarie 2016):
www.w3.org/TR/html-imports/
interacțiune între arborii DOM – Shadow DOM
(în lucru, septembrie 2017):
www.w3.org/TR/shadow-dom/
a se vedea și DOM Living Standard – dom.spec.whatwg.org