dezvoltator web?! (varianta 2015)

100
Dr. Sabin-Corneliu Buraga www.purl.org/net/busaco Dr. Sabin Buraga Facultatea de Informatică, Universitatea „A. I. Cuza” – Iași, România www.purl.org/net/busaco

Upload: sabin-buraga

Post on 16-Aug-2015

692 views

Category:

Technology


1 download

TRANSCRIPT

Page 1: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Dr. Sabin BuragaFacultatea de Informatică, Universitatea „A. I. Cuza” – Iași, România

www.purl.org/net/busaco

Page 2: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Ce este Web-ul?

Page 3: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

coWorld Wide Web

“a common information space

in which we communicate by sharing information”

Sir Tim Berners-Lee – a creat Web-ul în decembrie 1989

Page 4: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

coWorld Wide Web

scopuri principale:

independența de dispozitiv

independența de software

scalabilitatea

ubicuitatea

Page 5: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

coWorld Wide Web

bazat pe standarde deschise stipulate de Consorțiul Web

www.w3.org

Page 6: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

coWorld Wide Web

un serviciu Internet

alături de poștă electronică, transfer de fișiere etc.

WWW Internet

Page 7: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Web-ul e bazat pe modelul client/server al Internet-ului

server Webclient Web

cerere

răspuns

Page 8: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

clientul Web (browser, player multimedia,

aplicație desktop/mobilă, robot al unui motor de căutare,…)

procesează conținuturi – adică date – primite de la server

Page 9: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

pentru a reprezenta aceste conținuturi,

se adoptă diverse formate de date

cel mai popular: HTML (HyperText Markup Language)

Page 10: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

conținut ≅ <marcajeHTML versiune=5/> +

{ foi de stiluri: CSS3 } la modă

Page 11: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

aceste conținuturi sunt stocate

în documente (pagini) Web

mai general, resurse Web

Page 12: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

resursele vor fi identificate printr-o adresă Web

URL (Uniform Resource Locator)

exemplu: http://www.slideshare.com/busaco/presentations/

identificator unic

Page 13: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

paginile Web – la rândul lor – includ referințe

către alte resurse de interes via adrese (URL-uri)

hipertext (hipermedia)

Page 14: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Web-ul reprezintă un graf hipermedia

explorat pe baza interacțiunii cu utilizatorul via URL-uri

Page 15: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

la nivel de server Web, resursele (conținuturile)

solicitate de client – via un URL – sunt

fie stocate static (i.e. create manual), fie generate dinamic

– pe baza unor programe implementând diverși algoritmi

Page 16: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

transferul datelor între client și server e stabilit

de un protocol de comunicație

pentru Web: HTTP (HyperText Transfer Protocol)

Page 17: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

codificarea

datelor Unicode

nume de domenii

DNS

protocoalele

Internet

TCP/IP

adrese Web

URI = URL + URN

protocoale Web

HTTP, HTTPS,…

Page 18: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Internet

(Web)

Client

interfață cu

utilizatorul

Page 19: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Internet

(Web)

Client

interfață cu

utilizatorul

Server

sit/aplicație Web

Page 20: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Internet

(Web)

Client

interfață cu

utilizatorul

Server

sit/aplicație Web

sit Websistem găzduind o serie de pagini (resurse) Web înrudite

ale unei organizații, companii sau persoane

Page 21: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Internet

(Web)

Client

interfață cu

utilizatorul

Server

sit/aplicație Web

aplicație Webcolecție interconectată de pagini Web

cu conținut generat dinamic, oferind o funcționalitate specifică

Page 22: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Internet

(Web)

Client

interfață cu

utilizatorul

Server

sit/aplicație Web

interacțiune Web„dialogul” dintre utilizator(i) și aplicație are loc via o interfață Web

Page 23: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Internet

(Web)

Client

interfață cu

utilizatorul

Server

sit/aplicație Web

interacțiune Web

uzual, sit Web = aplicație Web

Page 24: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

exemple de aplicații Web:

Amazon, Coursera, Facebook, Dropbox, Flickr, GitHub, info.uaic.ro,

Instagram, Medium, PHPMyAdmin, Reddit, Quora, SlideShare,

TED.com, Tumblr, Twitter, Vimeo, webmin, Wikipedia, WordPress

…și multe, multe, multe altele

Page 25: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Internet

(Web)

Client

interfață cu

utilizatorul

Server

sit/aplicație Web

Date

stocate

persistent

Page 26: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Internet

(Web)

Client

interfață cu

utilizatorul

Server

sit/aplicație Web

Date

stocate

persistent

accesul la date poate fi realizat via servicii Websoftware oferind o funcționalitate specifică

în urma căreia se obțin date de interes

uzual, apelând la un API (Application Programming Interface)

Page 27: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

💡

Care e arhitectura generică

a unei aplicații Web?

Page 28: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Internet

(Web)

uzual, o aplicație Web implică trei strate (3-tier)

client server de aplicații stocare

(interface) (application) (persistence)

Page 29: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Sponge / Database

Jelly / Business Logic

Custard / Page Logic

Cream / Markup

Fruit / Presentation

C. Henderson, “Scalable Web Architectures”, 2007

Page 30: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Sponge / Database

Jelly / Business Logic

Custard / Page Logic

Cream / Markup

Fruit / Presentation

C. Henderson, “Scalable Web Architectures”, 2007

Page 31: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

mitul 1: cea mai importantă este interfața

Page 32: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Internet

(Web)

Aplicație Web = Interfață + Program + Conținut (Date)

standarde deschise:

HTML, CSS, Ajax, SVG, WebGL,…

Page 33: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

mitul 2: cel mai important este programul

Page 34: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Internet

(Web)

Aplicație Web = Interfață + Program + Conținut (Date)

server: C#, Go, Java, JavaScript, PHP, Python, Ruby, Scala etc. etc.

client: JavaScript

servere de aplicații Web, framework-uri, biblioteci, componente,…

Page 35: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

mitul 3: cele mai importante sunt datele (“content is king”)

Page 36: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Internet

(Web)

Aplicație Web = Interfață + Program + Conținut (Date)

utilizarea diverselor modele:

relațional – interogare via SQL

bazat pe grafuri (NoSQL)

cheie-valoare – formatul JSON

arborescent – XML

Page 37: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Aplicație Web = Interfață + Program + Conținut (Date)

mitul 1: cea mai importantă este interfața

mitul 2: cel mai important este programul

mitul 3: cele mai importante sunt datele

fapt: sunt importante toate!

Page 38: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

View(prezentare + interacțiune)

Model(structura datelor)

Controller(procesare)

modelul de structurare a datelor este separat

de maniera de procesare (controlul aplicației) și

de modul de prezentare a acestora (interfața Web)

Page 39: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Viewla nivel client(i) – e.g., Web

Modelstocare persistentă

Controlleraplicație (server și/sau client)

HTML, CSS, SVG, MathML, WebGL,…

SQL, JSON, XML (XQuery), RDF (SPARQL)

💡servere de aplicații, framework-uri etc.

arhitectura generică a unei aplicații Web

va consta dintr-un set de resurse referitoare la

controller, model și view

Page 40: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

browserprezen-

tare

proce-

sare

abstrac-

tizare

date

pagini <Web/>

HTML, CSS,…

server „gras”

(fat)

client „prostuț”

(dumb)

arhitectura aplicațiilor Web: abordarea MVC tradițională

www.leaseweblabs.com/2013/10/api-first-architecture-fat-vs-thin-server-debate/

frontend backend

Page 41: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

browser

modern

prezen-

tare

proce-

sare

abstrac-

tizare

date

recurgere la API

JSON, XML, CSV,…

server „slab”

(thin)

client „puternic”

(HTML5)

aplicație JavaScript

(eventual, via app store)

arhitectura aplicațiilor Web: abordarea JavaScript

www.leaseweblabs.com/2013/10/api-first-architecture-fat-vs-thin-server-debate/

Page 42: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

sistem de

operare

prezen-

tare

proce-

sare

abstrac-

tizare

date

recurgere la API

JSON, XML, CSV,…

server „slab”

(thin)

client „isteț”

(smart device)

aplicație nativă

Java, Obj-C, Swift,…

(uzual, via app store)

arhitectura aplicațiilor Web: aplicații mobile

www.leaseweblabs.com/2013/10/api-first-architecture-fat-vs-thin-server-debate/

Page 43: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

browserprezen-

tare

proce-

sare

abstrac-

tizare

date

API

JSON et al.

server „slab”

(thin)

client „puternic”

și/sau „isteț”

arhitectura aplicațiilor Web: abordarea hibridă

server de

prezentare

pagini

HTML

www.leaseweblabs.com/2013/10/api-first-architecture-fat-vs-thin-server-debate/

Page 44: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

💡Câteva exemplificări de aplicații Web?

Page 45: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

client(i)

firewall

proxy

middleware

server(e) Web

server(e) de aplicații

framework-uri, 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

Page 46: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

studiu de caz: Flickr

Page 47: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Flickr

scop: partajare a conținutului grafic (fotografii)

aplicație reprezentativă a Web-ului social

agregare de comunități – imaginea ca obiect social

adnotări via termeni de conținut (tagging) + comentarii

Page 48: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

PHP (procesare – application logic, acces la API,

prezentare de conținut via Smarty, modul de e-mail)

Perl (validarea datelor)

Java (managementul nodurilor de stocare)

MySQL (stocare de date)

ImageMagick (bibliotecă C de prelucrare de imagini)

Ajax (interacțiune asincronă)

Linux (platformă de rulare)

alte detalii la http://highscalability.com/flickr-architecture

Page 49: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

arhitectura inițială – conform (Cal Henderson, 2007)

Page 50: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

studiu de caz: SmartFetcher

Page 51: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

SmartFetcher

scop: recomandare în timp-real de știri de interes

(ziare, blog-uri,…), pe baza profilului utilizatorului

și a interacțiunii sale cu sistemul

recurge la tehnici de învățare automată, în funcție și de

sentimentul manifestat față de un articol dat

Page 52: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

la nivel de server (backend): Node.js (framework-ul Sails)

API REST – eventual, folosit via WebSocket-uri

pentru comunicarea în timp-real cu clienții

pe partea client (frontend): Angular și Bootstrap

Page 53: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

proiect de licență al absolvenților Raluca Jalaboi & Bogdan Spiridon

(Facultatea de Informatică, UAIC Iași, 2015)

Page 54: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

💡Aspecte importante vizând

dezvoltarea de aplicații Web?

Page 55: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

aplicații Web sisteme software complexe,

în evoluție permanentă

Page 56: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

mijloace multiple de interacțiune Web cu utilizatorul

mobil laptop PC tabletă (smart) TV ecran urban

Page 57: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

creșterea masei de utilizatori,

având așteptări tot mai mari din partea software-ului

de la conținut (hiper)textual

la aplicații Web sociale + interacțiune naturală

Page 58: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

suportul variat privind dezvoltarea de aplicații

(limbaje, API-uri, SDK-uri, biblioteci, framework-uri,...)

oferit de platforma hardware/software

la nivel de server(e) și/sau de client(i)

Page 59: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

neadaptarea la cerințele economice (de tip business)

development vs. marketing vs. management

Page 60: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

adaptare după Crumlish & Malone, 2009

scopuri

psihologie

comportament

💡

interacțiune

controale

limbi naturale

facilități

tehnologii

algoritmi

indexare

structurare

meta-date

instrumente

metodologii

stimuli

utilizatori interfață software conținut creatori

Page 61: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Etape în dezvoltarea unei aplicații Web

Cerințe – requirements

Analiză și proiectare – software design

Implementare – build

Testare – testing

Exploatare – deployment

Mentenanță – maintenance

Evoluție – evolution

Page 62: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Jesse Garrett, The Elements of User Experience (2nd Edition), New Riders, 2011

aplicație Web (produs software)

funcționalitate

+

informații oferite

Page 63: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

programare (server + client)

creare/adaptarede conținuttestare

documen-tare

arhitectura info+ navigarecerințe

public beta lansare

mentenanță

http://sixrevisions.com/web-development/agile/

actualmente, sunt preferate metodologii agile

http://www.infoq.com/process-practices/

Page 64: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Vreau să dezvolt un proiect Web…

Page 65: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

code repositoriesinstrumente de

dezvoltare (IDE)

runtime environment

dezvoltare

rulare

A. Iq

bal

, M

. H

aunse

nbla

s, S

. D

ecke

r (2

012

)

procesul actual de dezvoltare și exploatare

a aplicațiilor Web – Development As A Service

Page 66: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

code repositoriesinstrumente de

dezvoltare (IDE)

runtime environment

dezvoltare

rulare

A. Iq

bal

, M

. H

aunse

nbla

s, S

. D

ecke

r (2

012

)

Web: Cloud9, Koding, eXo Cloud, Ideone

desktop: Eclipse, Visual Studio

BitBucket

GitHub, Unfuddle

Google App Engine, Heroku,

Jelastic, Windows Azure

Page 67: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Parametrii unui proiect Web

obiectiv principal

durată

cost

abordare

tehnologii

procese

rezultat

resurse umane

profilul echipei

Page 68: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

✓obiectiv principal

crearea unui produs software utilizabil

în cât mai scurt timp posibil

Page 69: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

⌚durată

aproximativ 2—6 luni

Page 70: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

♨cost

de ordinul miilor de Euro

Page 71: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

✒abordare

prototipizare – wireframe, mockup,…

metode agile

asamblare de componente reutilizabile

Page 72: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co♻tehnologii

componente (servicii Web, API-uri publice,

framework-uri, biblioteci, plugin-uri, extensii etc.)

proiectare/programare „vizuală”

multimedia

…și altele

Page 73: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

procese

uzual, dezvoltarea aplicațiilor Web se realizează iterativ

„nu te aștepta să-ți iasă din prima…”

understand

study

designbuild

evaluate

Page 74: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co⎚rezultat

reutilizabilitate mare a codului,

recurgerea la componente/limbaje/platforme standard

aplicații implementate uzual conform standardelor

designul vizual este, de cele mai multe ori, unicat

Page 75: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

♚♞♟resurse umane

uzual, 3—9 persoane

“For the first version of your app, start with only 3 people.”

Getting Real – https://gettingreal.37signals.com/

Page 76: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

profilul echipei

specialiști în interacțiune – uzual: designeri Web

+

dezvoltatori (programatori) Web – la nivel client/server

+

arhitecți de baze de date

+

specialiști în marketing și/sau relații cu publicul

Page 77: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Care-i echipa de dezvoltare

a unei aplicații Web de anvergură?

Page 78: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

managementsite editor

project manager

Page 79: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

dezvoltare

(arhitectură)

system architect

data (content) architect

component architect

security architect

Page 80: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Page 81: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Page 82: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

interacțiune cu utilizatorul

creative lead

Web interface designer(s)

graphic artist(s)

HCI engineer

Page 83: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Page 84: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

programare

server-side programmers

client-side programmers

data/component integration programmers

Page 85: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Page 86: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Page 87: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

cotestare

testing lead

client-side tester(s)

server-side tester(s)

component tester(s)

integration tester(s)

Page 88: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Page 89: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

operații tehnice

Webmaster

hardware/network technicians

network administrator(s)

database administrator(s)

backup operator

uptime monitor

security monitor(s)

Page 90: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

marketing

content producer(s)

copywriter(s)

content editor(s)

branding & advertising expert(s)

direct e-marketer

public relations personnel

Page 91: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

echipa proiectului Web

management

Web Project Manager

funcționalitate

Software Engineer(s)

Multimedia Designer(s)

conținut (date)

Domain Expert

Business Expert

Page 92: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Web Designer

aplicații grafice raster/vectoriale, HTML5, CSS3,

cunoștințe despre compatibilitate cu/între diverse navigatoare Web,

experiență în design vizual + design responsiv,

cunoștințe privind interacțiunea Web – inclusiv la nivel mobil,

JavaScript (+framework-uri/biblioteci aflate „pe val”),

familiar cu paradigme de interacțiune naturală

(tactilă, bazată pe gesturi, realitate virtuală/îmbogățită),…

Page 93: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Web Developer

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),

familiaritate cu sisteme CMS/wiki, cunoștințe vizând servicii Web,

familiar cu alte paradigme de programare (e.g., funcțională,

distribuită), securitate & performanță Web,…

Page 94: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Page 95: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Web Technician

asistent (ajutor) al webmaster-ului,

designerului sau dezvoltatorului Web

poate efectua operații tehnice: instalare, configurare, monitorizare,…

Page 96: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Web Maintainer

actualizează conținutul

uzual, via o interfață WYSIWYG

(de exemplu, recurgând la un sistem

de management al conținutului – CMS)

Page 97: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Page 98: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

☺Bun… Și eu ce fac?

Page 99: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

fii curios & iscoditor

învață(citește + experimentează + cere ajutor + reutilizează)

creează și arată

(design, cod-sursă, prototipuri, exemple demonstrative,…)

acumuleazăexperiență, „aură”, statut social etc.reputație

concurează

(…atât de multe oportunități)

ajută/instruiește pe ceilalți

Page 100: Dezvoltator Web?! (varianta 2015)

Dr. S

abin

-Cor

nel

iuBura

ga–

ww

w.p

url.o

rg/n

et/b

usa

co

Mult succes la InfoEducație 2015!

imagini medievale furnizate de http://discardingimages.tumblr.com/