O prezentare pentru elevii de liceu – participanți la SummerIS <www.summeris.ro> – referitoare la cele mai importante aspecte privind cariera de dezvoltator de aplicații Web.
A presentation for high-school students regarding the most important aspects about a professional carrier focused on Web application development.
3. Dr.Sabin-CorneliuBuraga–http://profs.info.uaic.ro/~busaco/
World Wide Web
spațiu informațional comun în care comunicăm
prin interconectarea și partajarea unor elemente
de interes denumite resurse
inventat de Sir Tim Berners-Lee în decembrie 1989
detalii istorice în Sabin Buraga, 25 de ani de Web (2014)
www.slideshare.net/busaco/25-de-ani-de-web
37. Dr.Sabin-CorneliuBuraga–http://profs.info.uaic.ro/~busaco/
client Web server Web
conținut
static
conținut
dinamic
conținut
static
conținut
dinamic
date
locale
JavaScript server de aplic., framework
HTTP
transfer
asincron
via o interfață Web, utilizatorul interacționează cu clientul
(frontend) și inițiază acțiuni – e.g., cereri HTTP (a)sincrone –
executate de diverse componente implementate
la nivel de server (backend), pentru a obține date
☁date externe
(serviciu Web)
frontend backend
41. Dr.Sabin-CorneliuBuraga–http://profs.info.uaic.ro/~busaco/
Internet
(Web)
Aplicație Web = Interfață + Program + Conținut (Date)
standarde deschise
structurarea conținutului: HTML (HyperText Markup Language)
stiluri de prezentare a datelor: CSS (Cascading Style Sheets)
transfer asincron: Ajax (Asynchronous JavaScript And XML)
ilustrații 2D în format vectorial: SVG (Scalable Vector Graphics)
conținut 3D: WebGL
45. Dr.Sabin-CorneliuBuraga–http://profs.info.uaic.ro/~busaco/
Internet
(Web)
Aplicație Web = Interfață + Program + Conținut (Date)
recurgerea la modele de date diverse
relațional – interogare via SQL (Structured Query Language)
bazat pe grafuri – o fațetă a „mișcării” NoSQL
cheie-valoare – e.g., formatul JSON (JavaScript Object Notation)
arborescent – XML (Extensible Markup Language)
57. Dr.Sabin-CorneliuBuraga–http://profs.info.uaic.ro/~busaco/
client(i)
mandatar (proxy)
zid de protecție (firewall)
intermediar(i) (middleware)
server(e) Web
server(e) de aplicații
cadre de lucru, biblioteci, alte componente
server(e) de stocare persistentă – e.g., baze de date
server(e) de conținut multimedia
server(e) de management al conținutului (CMS)
aplicații/sisteme tradiționale (legacy)
58. Dr.Sabin-CorneliuBuraga–http://profs.info.uaic.ro/~busaco/
client(i)
mandatar (proxy)
zid de protecție (firewall)
intermediar(i) (middleware)
server(e) Web
server(e) de aplicații
cadre de lucru, biblioteci, alte componente
server(e) de stocare persistentă – e.g., baze de date
server(e) de conținut multimedia
server(e) de management al conținutului (CMS)
aplicații/sisteme tradiționale (legacy)
eventual, recurgând la servicii în „nori” – cloud
partajarea la cerere a resurselor de calcul și a datelor
cu alte calculatoare/dispozitive pe baza tehnologiilor Internet
59. Dr.Sabin-CorneliuBuraga–http://profs.info.uaic.ro/~busaco/
Aplicație
Web
Procesare la nivel de server
(backend)
Stocare
persistentă
eBay Java, Node.js (JavaScript) Oracle DB
Facebook
Hack, PHP (HHVM), Python,
C++, Java, Erlang, D, Haskell,
XHP (extensie PHP/Hack)
MySQL,
Apache HBase,
Apache Cassandra
Google C, C++, Go, Java, Python BigTable, MariaDB
Linkedin Java, JavaScript, Scala Voldemort
Pinterest Django (Python), Erlang MySQL, Redis
Twitter C++, Java, Scala, Rails (Ruby)
MySQL, Cassandra,
Hadoop, Vertica
Wikipedia PHP, Hack MySQLMariaDB
WordPress PHP / Node.js – Calypso MySQL
YouTube C, C++, Python, Java, Go BigTable, MariaDB
en.wikipedia.org/wiki/Programming_languages_used_in_most_popular_websites
profs.info.uaic.ro/~busaco/teach/courses/web/web-film.html#week3
61. Dr.Sabin-CorneliuBuraga–http://profs.info.uaic.ro/~busaco/
procesare backend Java, Python, Node.js (JavaScript)
procesare frontend React (JavaScript)
sisteme de stocare
MySQL, Apache Cassandra, Apache
Hadoop, Apache Hive, Oracle DB
servicii în „nori”
Amazon EC2 – procesare video
Amazon S3 – stocare
servicii SQL Amazon RDS
servicii NoSQL Amazon DynamoDB
management de cod GitHub (implementat în Ruby)
integrare continuă Jenkins (implementare Java)
gestionare servere Apache Mesos (implementare C++)
distribuire de conținut
(content distribution network)
Open Connect CDN (FreeBSD,
Nginx), Akamai, Level 3, Limelight
monitorizare Apache Chukwa (scris în Java)
highscalability.com/blog/2015/11/9/a-360-degree-view-of-the-entire-netflix-stack.html
62. Dr.Sabin-CorneliuBuraga–http://profs.info.uaic.ro/~busaco/
browser
control
proce-
sare
client „puternic”
și/sau „isteț”
alternativă: arhitecturi fără server (serverless)
aplicația Web depinde semnificativ de componente
externe, disponibile în „nori” – (micro-)servicii
BaaS
Mike Roberts (2016) – martinfowler.com/articles/serverless.html
func-
ționa-
litate1
☁
func-
ționa-
litate2
☁
☁
auten-
tificare
☁
BaaS = (Mobile) Backend As A Service FaaS = Functions As A Service
☁
FaaS
căutare
procesare
comenzi
BaaS
comenzi
produse
acces
la API
72. Dr.Sabin-CorneliuBuraga–http://profs.info.uaic.ro/~busaco/
programare (server + client)
creare/adaptare
de conținut
testare
documen-
tare
arhitectura info
+ navigarecerințe
public beta lansare
mentenanță
www.webpagefx.com/blog/web-design/agile/
actualmente, sunt preferate metodologii agile
de dezvoltare a sistemelor Web
www.infoq.com/process-practices/
101. Dr.Sabin-CorneliuBuraga–http://profs.info.uaic.ro/~busaco/
Web Designer
standarde Web la nivel de client: HTML5, CSS3,…
cunoștințe vizând navigatoarele Web
experiență în design vizual + design responsiv
cunoștințe privind interacțiunea Web (mobilă)
familiaritate cu JavaScript (+framework-uri/biblioteci)
paradigme de interacțiune naturală
(tactilă, bazată pe gesturi, realitate virtuală/îmbogățită – VR/AR)
102. Dr.Sabin-CorneliuBuraga–http://profs.info.uaic.ro/~busaco/
cel puțin 1 limbaj obiectual – la nivel de server/client
protocoale și standarde Internet + Web
cunoștințe privind baze de date
(inclusiv NoSQL și/sau XML)
cunoștințe vizând servicii Web
familiaritate cu alte paradigme de programare
(e.g., funcțională, distribuită)
securitate & performanță Web
Web Developer
114. Dr.Sabin-CorneliuBuraga–http://profs.info.uaic.ro/~busaco/
Web ubicuu la nivel fizic – physical Web
context: IoT (Internet of Things)
far (beacon) = dispozitiv fizic capabil să expună un URL
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
google.github.io/physical-web/ www.slideshare.net/yiibu/presentations
115. Dr.Sabin-CorneliuBuraga–http://profs.info.uaic.ro/~busaco/
Web ubicuu la nivel fizic – physical Web
☁beacon
☗ 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)
🖼
116. Dr.Sabin-CorneliuBuraga–http://profs.info.uaic.ro/~busaco/
Web „inteligent” – semantic Web, Web of Data
modelarea resurselor – date, informații, cunoștințe –
disponibile pe Web pentru a fi „înțelese” de calculatoare
standarde Web:
RDF (Resource Description Framework)
OWL (Web Ontology Language)
pentru detalii, de considerat:
Sabin Buraga, Why 5-Star Data? (2016)
www.slideshare.net/busaco/why-5star-data
Sabin Buraga, Dezvoltarea aplicațiilor Web (curs master FII, UAIC)
profs.info.uaic.ro/~busaco/teach/courses/wade/web-film.html
117. Dr.Sabin-CorneliuBuraga–http://profs.info.uaic.ro/~busaco/
interogări asupra DBpedia
(varianta procesabilă de către mașină a enciclopediei Wikipedia)
diverse URL-uri
desemnând concepte
(things, not strings)
Cine este Linus Torvalds?
PersonWithOccupation
ComputerPioneers
FinnishComputerProgrammers
FreeSoftwareProgrammers
LinuxKernelHackers
LivingPeople
PeopleInInformationTechnology
Golfer
119. Dr.Sabin-CorneliuBuraga–http://profs.info.uaic.ro/~busaco/
Web „inteligent” – semantic Web, Web of Data
în conjuncție cu alte abordări:
învățare automată (machine learning)
software capabil să învețe și/sau să realizeze predicții
fără a fi explicit programat
github.com/josephmisiti/awesome-machine-learning deeplearninggallery.com