Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Bkbiet day1

320 views

Published on

Day 1 presentation for BKBIET

Published in: Education, Technology
  • Be the first to comment

  • Be the first to like this

Bkbiet day1

  1. 1. 03/06/2013BKBIET Phase IDay 1Thursday, 13 June 13
  2. 2. Today...✤ Technical✤ Web Technologies✤ client-server technologies✤ HTTP/HTML/JS✤ web server/servlet-container/cgi✤ DB/SQLThursday, 13 June 13
  3. 3. The NetworkThursday, 13 June 13
  4. 4. The NetworkThursday, 13 June 13
  5. 5. The NetworkThursday, 13 June 13
  6. 6. The NetworkThursday, 13 June 13
  7. 7. Client Server Model✤ Why client server?Thursday, 13 June 13
  8. 8. Client Server Model✤ Why client server?✤ alternatives?Thursday, 13 June 13
  9. 9. Client Server Model✤ Why client server?✤ alternatives?✤ basis of all distributed computing paradigmsThursday, 13 June 13
  10. 10. Client Server Model✤ Why client server?✤ alternatives?✤ basis of all distributed computing paradigms✤ service-oriented, based on a request response protocolThursday, 13 June 13
  11. 11. Client Server Model✤ Why client server?✤ alternatives?✤ basis of all distributed computing paradigms✤ service-oriented, based on a request response protocol✤ requires two distinct entities, a client and a serverThursday, 13 June 13
  12. 12. Client Server Model✤ Why client server?✤ alternatives?✤ basis of all distributed computing paradigms✤ service-oriented, based on a request response protocol✤ requires two distinct entities, a client and a server✤ problems?Thursday, 13 June 13
  13. 13. WebTechnologies✤ interconnected computers : Internet✤ interconnected, distributed knowledge : Hypertext✤ language to express, hypertext : HTML✤ tags✤ links✤ client :web-browser,✤ server : web-server,✤ protocol: Hyper Text Transfer ProtocolThursday, 13 June 13
  14. 14. HTTP✤ Request✤ the url✤ protocol✤ host/domain,[port]✤ path, parameters✤ methods:✤ GET, POST, PUT,DELETE✤ HEAD, OPTIONS, TRACE...✤ Cookies!GET /index.html HTTP/1.1Host: www.example.comThursday, 13 June 13
  15. 15. HTTP✤ Response✤ Status codes✤ Response headers✤ content type✤ content length✤ Response data✤ Cookies!Thursday, 13 June 13
  16. 16. HTTP✤ Response✤ Status codes✤ Response headers✤ content type✤ content length✤ Response data✤ Cookies!HTTP/1.1 200 OKDate: Mon, 23 May 2005 22:38:34 GMTServer: Apache/1.3.3.7 (Unix) (Red-Hat/Linux)Last-Modified: Wed, 08 Jan 2003 23:11:55 GMTContent-Type: text/html; charset=UTF-8Content-Length: 131Connection: close<html><head><title>An Example Page</title></head><body>Hello World, this is a very simple HTMLdocument.</body></html>Thursday, 13 June 13
  17. 17. HTTP✤ Salient Properties:✤ Idempotent, except for POST✤ multiple calls should result in the same state✤ Stateless✤ why?✤ problems?Thursday, 13 June 13
  18. 18. HTTP Sessions✤ Cookies to the rescue!✤ Types✤ session✤ persistent✤ secure✤ third-party cookie✤ super cookie✤ Server --> Client✤ Client --> ServerHTTP/1.1 200 OKContent-type: text/htmlSet-Cookie: name=valueSet-Cookie: name2=value2; Expires=Wed, 09 Jun 202110:18:14 GMT (content of page)GET /spec.html HTTP/1.1Host: www.example.orgCookie: name=value; name2=value2Accept: */*Thursday, 13 June 13
  19. 19. HTML✤ The language of the internet?✤ distributed information bank✤ tag based structure✤ links to other html documents✤ styling provided through css✤ latest versions HTML 5, CSS 3✤ move from hypertext to hypermedia<!DOCTYPE HTML><html><body><video width="320" height="240" controls><source src="movie.mp4" type="video/mp4"><source src="movie.ogg" type="video/ogg">Your browser does not support the videotag.</video></body></html>Thursday, 13 June 13
  20. 20. DynamicWeb✤ Personalized, interactive and dynamic✤ HTTP Sessions✤ dynamically generated content✤ server-side: cgi✤ client-side: javascript✤ AjaxThursday, 13 June 13
  21. 21. CGI✤ basis of server side dynamism✤ route the request from client to a server-side script✤ let the script generate the response✤ CGI can be anything✤ perl, bash script✤ C program✤ Java, python or rubyThursday, 13 June 13
  22. 22. Java on the Server✤ harness the power of java on the server side✤ Java Servlets✤ JSP: templates for java✤ Enter frameworks✤ struts✤ spring✤ MVCThursday, 13 June 13
  23. 23. Java on the Server✤ harness the power of java on the server side✤ Java Servlets✤ JSP: templates for java✤ Enter frameworks✤ struts✤ spring✤ MVCThursday, 13 June 13
  24. 24. Web Application✤ web page --> web app✤ an interactive front-end✤ enter applet,vbscript,javascript,....✤ HTML as DOM✤ Ajax/XHR✤ frameworks : jQuery, backbone.js, ember.js, angular.js, knockout.jsThursday, 13 June 13
  25. 25. Persistence✤ Flat files --> Databases✤ Relational Databases✤ NoSQL✤ No more 1 size fits all✤ JDBC✤ ORM : HibernateThursday, 13 June 13
  26. 26. Let’s Start..✤ Questions???Thursday, 13 June 13
  27. 27. Let’s Start..✤ Questions???✤ ExerciseThursday, 13 June 13

×