O slideshow foi denunciado.
Utilizamos seu perfil e dados de atividades no LinkedIn para personalizar e exibir anúncios mais relevantes. Altere suas preferências de anúncios quando desejar.
Les 01: De wondere wereld van het Internet.
Front-end development




Wie ben ik?

 Jeroen Hulscher (25), Rijswijk

            Oud CMD-student, afgestudeerd in 2007....
Front-end development




Agenda van vandaag

 Korte kennismaking
 Kennismaking met FED @ HRO
 Geschiedenisles
 Quiz
...
Front-end development




Wat is Front-end Development?




                                4
Front-end development




10 geboden (of nouja…9)

 Theorie- en Praktijkdeel.
 Praktijkdeel is de start van het “huiswer...
Front-end development




Literatuur




                        6
Front-end development




Agenda van vandaag

 Korte kennismaking
 Kennismaking met FED @ HRO
 Geschiedenisles
 Quiz
...
Front-end development




        “Where shall I begin, please your Majesty?”

        “Begin at the beginning”, the King ...
Front-end development




Sputnik 1, 1957
‘s Werelds eerste satteliet


                              9
Front-end development




ARPA Inc., 1967
Creatie van “ARPANet”


                        10
Front-end development




CERN, 1991
Tim Berners Lee schrijft over de “hyperlink” en “World Wide Web”


                  ...
Front-end development




       <a href=”http://www.google.com”>Google</a>




                                          ...
Front-end development




       <a href=”http://www.google.com”>Google</a>
  <a href=”http://www.askjeeves.com”>Ask Jeeve...
Front-end development




Internet voor de massa




                         14
Front-end development




Browser wars




                        15
Front-end development




Browser wars




                        16
Front-end development




Browser wars




                        17
Front-end development




Browser statistieken


                        68% marketshare
                        (IE6, IE7...
Front-end development




Browser bugs

                 Firefox 3   Internet Explorer 6




                             ...
Front-end development




Standaarden voor het Internet
(tried since 1994)




                                20
Front-end development




Hoe werkt dat dan?


                                Mag ik www.google.nl?




    Jij (client) ...
Front-end development




Hoe werkt dat dan?




                        Client checkt altijd eerst voor index.html

     ...
Front-end development




Agenda van vandaag

 Korte kennismaking
 Kennismaking met FED @ HRO
 Geschiedenisles
 Quiz
...
Front-end development




Quiz

 (X)HTML                PHP
 DNS                    A List Apart
 CSS                ...
Front-end development




Agenda van vandaag

 Korte kennismaking
 Kennismaking met FED @ HRO
 Geschiedenisles
 Quiz
...
Front-end development




To-do-list

 Connectie met Eduroam maken
 links op: docent.cmd.hro.nl/huljl/herfst01.html
 Ap...
Front-end development




FTP instellingen




                        27
Front-end development




Huiswerk
 Hoofdstuk 1 + 2 van CSS & HTML Web Design lezen
 Opera Curriculum stukken lezen
 Mo...
Front-end development




                        29
Front-end development




                        30
Front-end development




                        31
Próximos SlideShares
Carregando em…5
×

Front end development - Les 01

First lesson of Front-end development course, year 01 at the Rotterdam University of Applied Sciences

  • Seja o primeiro a comentar

Front end development - Les 01

  1. 1. Les 01: De wondere wereld van het Internet.
  2. 2. Front-end development Wie ben ik? Jeroen Hulscher (25), Rijswijk Oud CMD-student, afgestudeerd in 2007. Multimedia Engineering (huidige FED) , sinds vorig jaar part-time docent Werkzaam sinds januari 2007 bij Tam Tam in Delft Lead Front-end developer & Adviseur Nieuwe Media 2
  3. 3. Front-end development Agenda van vandaag  Korte kennismaking  Kennismaking met FED @ HRO  Geschiedenisles  Quiz  Installatie-ronde 3
  4. 4. Front-end development Wat is Front-end Development? 4
  5. 5. Front-end development 10 geboden (of nouja…9)  Theorie- en Praktijkdeel.  Praktijkdeel is de start van het “huiswerk” + verdiepingsslag.  Inleveren huiswerk 24 uur voor aanvang van de les.  Altijd op je studentspace inclusief aanpak en broncode. 

Altijd de lesstof lezen voor aanvang van de volgende les (4 uur in theorie) 

Beoordeling op basis van een deel van je huiswerk (!)  Twee keer afwezig in een kwartaal = vak niet gehaald.  Laptops alleen tijdens praktijkdeel open.  Werk kopieren is niet toegestaan (duh...) 5
  6. 6. Front-end development Literatuur 6
  7. 7. Front-end development Agenda van vandaag  Korte kennismaking  Kennismaking met FED @ HRO  Geschiedenisles  Quiz  Installatie-ronde 7
  8. 8. Front-end development “Where shall I begin, please your Majesty?” “Begin at the beginning”, the King said gravely, “and go on till you come to the end: then stop.” ~ Alice’s Adventures in Wonderland; Lewis Caroll 8
  9. 9. Front-end development Sputnik 1, 1957 ‘s Werelds eerste satteliet 9
  10. 10. Front-end development ARPA Inc., 1967 Creatie van “ARPANet” 10
  11. 11. Front-end development CERN, 1991 Tim Berners Lee schrijft over de “hyperlink” en “World Wide Web” 11
  12. 12. Front-end development <a href=”http://www.google.com”>Google</a> 12
  13. 13. Front-end development <a href=”http://www.google.com”>Google</a> <a href=”http://www.askjeeves.com”>Ask Jeeves</a> 13
  14. 14. Front-end development Internet voor de massa 14
  15. 15. Front-end development Browser wars 15
  16. 16. Front-end development Browser wars 16
  17. 17. Front-end development Browser wars 17
  18. 18. Front-end development Browser statistieken 68% marketshare (IE6, IE7, IE8) 23% (FF2, FF3) Safari 3,6%, Chrome 2,1%, Opera 2%, Netscape 0.6%, Overige browsers 0.4% 18
  19. 19. Front-end development Browser bugs Firefox 3 Internet Explorer 6 19
  20. 20. Front-end development Standaarden voor het Internet (tried since 1994) 20
  21. 21. Front-end development Hoe werkt dat dan? Mag ik www.google.nl? Jij (client) Oh, je bedoelt 92.148.10.104, alsjeblieft! Internet (server) 21
  22. 22. Front-end development Hoe werkt dat dan? Client checkt altijd eerst voor index.html dus docent.cmd.hro.nl/huljl is eigenlijk docent.cmd.hro.nl/huljl/index.html 22
  23. 23. Front-end development Agenda van vandaag  Korte kennismaking  Kennismaking met FED @ HRO  Geschiedenisles  Quiz  Installatie-ronde 23
  24. 24. Front-end development Quiz  (X)HTML  PHP  DNS  A List Apart  CSS  W3C validator  URI  Web standards  FTP  Javascript  PHP  <h2>  Adobe Flash  <p> 24
  25. 25. Front-end development Agenda van vandaag  Korte kennismaking  Kennismaking met FED @ HRO  Geschiedenisles  Quiz  Installatie-ronde 25
  26. 26. Front-end development To-do-list  Connectie met Eduroam maken  links op: docent.cmd.hro.nl/huljl/herfst01.html  Aptana Studio downloaden  Firefox 3 downloaden Web Developer Toolbar add-on toevoegen Firebug add-on toevoegen FireFTP add-on toevoegen  FTP connectie met studentenserver maken  Huiswerk in de loop van de week op de FTP zetten 26
  27. 27. Front-end development FTP instellingen 27
  28. 28. Front-end development Huiswerk  Hoofdstuk 1 + 2 van CSS & HTML Web Design lezen  Opera Curriculum stukken lezen  Modulewijzer lezen (zijmenu op de website)  Tekstbrij op docent.cmd.hro.nl/huljl/herfst01.html “opmaken”  Huiswerk op studentenserver plaatsen als volgt: public.www jaar1 herfst fed week1 index.html Lukt het niet (24 u voor volgende les)  email jeroen@tamtam.nl  bel 06 15 88 02 65  Lukt het niet, en niet gemaild/gebeld is Cola Light (of liever Zero) halen voor mij 28
  29. 29. Front-end development 29
  30. 30. Front-end development 30
  31. 31. Front-end development 31

×