Inhoud Introductie tot de cursus 1 De functie van de cursus 7 2 De inhoud van de cursus 7 2.1 Voorkennis 7 2.2 Leerdoelen van de cursus 8 2.3 Opbouw van de cursus 8 3 Leermiddelen en wijze van studeren 9 3.1 Tekstboek en cursusboek 9 3.2 Software 10 3.3 Studiebegeleiding en Studienet 11 3.4 Tentamen 11 6
Introductie tot de cursus Introductie tot de cursus Voordat u begint met het bestuderen van de cursus Webapplicaties: de clientkant, willen wij u in deze introductie informeren over de bedoeling van de cursus, de opzet van het cursusmateriaal en de werkwijze die wij van u verwachten. U vindt hier dus nog geen studiestof, maar praktische en studietechnische informatie die u kan helpen bij het studeren. 1 De functie van de cursus In deze cursus worden twee aspecten van de clientkant van webapplicaties belicht. In de eerste plaats geeft de cursus een inleiding in diverse technieken voor de ontwikkeling van zulke applicaties. Per techniek komt een aantal basisconcepten aan bod, met als doel dat studenten voldoende kennis opdoen om zich verder zelfstandig in de technieken te kunnen verdiepen. Daarnaast willen we bereiken dat de studenten een overzicht krijgen over het betreffende gebied en de technieken in een breder kader kunnen plaatsen, met als doel dat ze ook andere, bestaande of toekomstige, technieken die dezelfde conceptuele achtergrond hebben, kunnen plaatsen en in staat zijn zich erin te verdiepen. De cursus Webapplicaties: de clientkant is een cursus met een studielast van 4.3 EC, wat overeenkomt met ongeveer 100 uur. De cursus maakt deel uit van verschillende studieprogramma s, waaronder de bacheloropleiding Informatica. De cursus is ook interessant voor losse cursisten die meer willen weten van webapplicaties, zonder dat ze meteen de bedoeling hebben een studieprogramma te volgen. De cursus besteedt geen aandacht aan het programmeren van de serverkant. Hiervoor verwijzen we u naar de cursus Webapplicaties: de serverkant. 2 De inhoud van de cursus 2.1 VOORKENNIS De volgende voorkennis wordt verondersteld: kennis van minstens één objectgeoriënteerde programmeertaal globale kennis van internet Voor opleidingsstudenten geldt dat ze voldoen aan de voorkenniseisen als ze de cursussen Inleiding informatica en Objectgeoriënteerd programmeren in Java 1 hebben gehaald. Losse cursisten moeten de voorkennis op andere wijze hebben opgedaan. Het gebruikte cursusmateriaal is voor een groot deel Engelstalig. U moet het Engels dus in voldoende mate beheersen om de cursus te kunnen bestuderen. OU 7
Webapplicaties: de clientkant 2.2 LEERDOELEN VAN DE CURSUS De leerdoelen omschrijven welke kennis, inzichten en vaardigheden u zich door het bestuderen van de cursus kunt eigen maken. We verwachten dat u na het bestuderen van de cursus de basiselementen van de standaarden en technieken (X)HTML, CSS, JavaScript, DOM en Ajax kunt noemen deze kunt toepassen voor het ontwikkelen van webapplicaties aan de clientkant de technieken met elkaar kunt vergelijken en kunt uitleggen wat de voordelen, nadelen, mogelijkheden en beperkingen van de genoemde technieken zijn, relevante software-engineeringprincipes kunt toepassen bij het creëren van clientkant webapplicaties, de voordelen kunt uitleggen om daarbij te werk te gaan volgens webstandaarden de consequenties kunt uitleggen van het feit dat webapplicaties op een sterk uiteenlopende verzameling (en niet van te voren geheel gekende) platforms gebruikt zullen worden enkele principes voor het maken van gebruikersvriendelijke user interfaces kunt noemen en toepassen. 2.3 OPBOUW VAN DE CURSUS Het schriftelijke materiaal bestaat uit een tekstboek en een cursusboek. Het tekstboek is het boek Web Programming, van Marty Stepp, Jessica Miller en Victoria Kirst. Het cursusboek beschrijft welke delen van het tekstboek bestudeerd moeten worden, het geeft aanvullingen, aanvullende opgaven, opdrachten en uitwerkingen. De cursus is verdeeld in vijf blokken. Blok 1 Context Blok 2 De voorkant van het web: het statische gedeelte Blok 3 De voorkant van het web: programmeren in de browser Blok 4 Clientkant webapplicaties Blok 1 behandelt beknopt de nodige voorkennis. Internet en het world wide web komen aan de orde, evenals enkele protocollen die van belang zijn voor deze cursus Blok 2 geeft in de eerste plaats een inleiding in HTML, de taal die u kunt gebruiken om de structuur van documenten te beschrijven. Daarna volgt een inleiding in CSS, dat u kunt gebruiken om te bepalen hoe documenten worden gepresenteerd. Daarnaast wordt het belang benadrukt om standaarden te gebruiken bij het ontwikkelen van webapplicaties. Blok 3 geeft een inleiding in JavaScript. Javascript maakt het mogelijk webpagina s dynamisch te maken en de gebruiker meer mogelijkheden tot interactie te bieden. Er wordt de nodige aandacht besteed aan regels en gewoonten om JavaScript-code te schrijven die goed leesbaar en goed onderhoudbaar is. Blok 4 geeft een inleiding in Ajax. Ajax maakt het mogelijk om gegevens van de server op te vragen en webpagina s te veranderen zonder dat de gebruiker daarvoor expliciet de opdracht geeft. Een pagina kan dus veranderen terwijl de gebruiker ernaar blijft kijken. Daarnaast wordt ook in dit blok het belang van standaarden aangegeven. 8 OU
Introductie tot de cursus Blok 5 Interface design en Web 2.0 Eindtoets De cursus wordt inhoudelijk afgesloten met blok 5 waarin wordt ingegaan op het ontwerpen van interfaces en op Web 2.0. De cursus heeft een eindtoets die bestaat uit vragen die representatief zijn voor het tentamen. U kunt de eindtoets maken als voorbereiding op het tentamen. De eindtoets staat op Studienet. 3 Leermiddelen en wijze van studeren 3.1 TEKSTBOEK EN CURSUSBOEK Leereenheid Het cursusboek volgt de opbouw van het tekstboek. Het cursusboek is verdeeld in leereenheden. Een leereenheid is een afgerond deel van de stof, dat betrekking heeft op een hoofdstuk of een deel van een hoofdstuk uit het tekstboek. Een leereenheid voegt de volgende ingrediënten toe aan de stof van het tekstboek een korte inleiding op de betreffende stof leerdoelen, die aangeven wat u na het bestuderen van het hoofdstuk weet en/of kunt studeeraanwijzingen voor het betreffende hoofdstuk, waaronder in elke geval een aanduiding van de geschatte studielast waar nodig aanvullingen, toelichtingen, errata, enzovoort opgaven en opdrachten een zelftoets, waarmee u kunt nagaan of u de leerdoelen van de leereenheid hebt bereikt een terugkoppeling op de opgaven, opdrachten en de zelftoets. Het tekstboek bevat het grootste deel van de inhoudelijke stof. Een beperkt aantal leereenheden geeft hier een aanvulling op door stof aan te bieden die los staat van het cursusboek. Self-checks Opgaven Opdrachten Nummering leereenheden en paragrafen U kunt zelf aan het werk via self-checks, opgaven en opdrachten. Het boek bevat self-checks: kleine opgaven die direct aansluiten bij de bestudeerde stof. In het cursusboek hebben we in de meeste leereenheden opgaven en opdrachten toegevoegd. Opgaven kunt u, net als self-checks, maken zonder een computer te gebruiken. Opdrachten daarentegen zijn bedoeld om achter uw computer te maken. Via deze opdrachten kunt u praktische ervaring opdoen met webapplicaties. Vaak gaat het om programma s die in het boek worden besproken en waar u mee kunt oefenen. Maar ook meer omvangrijke programma s die u volledig zelf maakt komen voor. U kunt de opdrachten op twee manieren maken. U kunt de bestanden die u daarvoor nodig hebt downloaden vanaf de Studienet-site van deze cursus en ze vervolgens op uw eigen computer maken. Een andere mogelijkheid is gebruik te maken van de omgeving die gecreëerd is op Studienet. Daar staat allerlei materiaal klaar om u te ondersteunen bij het maken van de opdrachten. In de meeste gevallen is er ook een bestand beschikbaar waarin u de uitwerking van de opdracht kunt vinden. De nummering van de leereenheden volgt de nummering van de hoofdstukken in het tekstboek. Als bij een hoofdstuk in het tekstboek meerdere leereenheden horen, is een letter toegevoegd aan het nummer van de leereenheid. Leereenheid 7b is bijvoorbeeld de tweede leereenheid bij hoofdstuk 7 van het tekstboek. OU 9
Webapplicaties: de clientkant In het tekstboek is elk hoofdstuk ingedeeld in paragrafen of secties die een naam en een nummer hebben. In het cursusboek volgen we deze naamgeving en nummering. Bestudering van tekstboek Het overgrote deel van de hoofdstukken bestudeert u in zijn geheel. Hoofdstuk 5 slaan we grotendeels over en hoofdstuk 13 helemaal. In een enkel geval slaan we een deel van een hoofdstuk over. Als dat het geval is, wordt dit uitdrukkelijk vermeld in de studeeraanwijzingen in het cursusboek. Wij raden u aan bij het bestuderen van het tekstboek steeds het cursusboek bij de hand te houden en per onderdeel te kijken of er studeeraanwijzingen, toelichtingen, enzovoort zijn. Wilt u om welke reden dan ook het tekstboek bestuderen zonder dat u het cursusboek steeds raadpleegt, dan is het raadzaam vooraf in het cursusboek na te gaan of er eventueel onderdelen vervallen. Margeteksten Kernbegrippen Studeeraanwijzingen Dit is een voorbeeld van een studeeraanwijzing. Verwijzingen naar internet Weblink: Web Programming Iedere pagina heeft aan de linkerkant een kolom: de marge. U kunt daarin kernbegrippen aantreffen. Kernbegrippen zijn, zoals de naam al zegt, centrale begrippen. Kernbegrippen zijn te herkennen aan de cursivering. Daarnaast komen in de marge ook korte studeeraanwijzingen voor. Dat kunnen aanwijzingen zijn hoe de tekst gelezen moet worden, herhalingen, verwijzingen naar weblinks of naar andere leereenheden, enzovoort. Studeeraanwijzingen in de marge zijn niet gecursiveerd. In het cursusboek wordt regelmatig verwezen naar bronnen op internet. Meestal gaat het om aanvullend materiaal dat interessant kan zijn voor wie zich verder wil verdiepen in bepaalde onderwerpen. Om te voorkomen dat u regelmatig met adressen te maken krijgt die niet meer bestaan, hebben we geen adressen in het schriftelijke materiaal opgenomen. Deze adressen kunt u vinden op Studienet, waar ze gemakkelijker te onderhouden zijn. Als we bijvoorbeeld willen verwijzen naar de website bij het tekstboek Web Programming, geven we dat aan via een studeeraanwijzing die begint met het woord Weblink. Op Studienet kunt u vervolgens het betreffende adres vinden. Mocht u merken dat een bepaald adres niet meer werkt, dan verzoeken wij u vriendelijk dat te melden bij de examinator, die vervolgens het adres kan aanpassen. 3.2 SOFTWARE De naamgeving van deze cursus geeft al aan dat u bij de opdrachten veel te maken zult krijgen met uw browser: de clientkant speelt zich af in de browser. Zoals u wellicht weet, kunnen browsers behoorlijk van elkaar verschillen. Om beginners op dit gebied zo goed mogelijk te kunnen ondersteunen, hebben wij een keuze gemaakt voor een specifieke browser: Mozilla Firefox. Daarin geïntegreerd is Firebug, een web development tool dat onder meer code kan inspecteren en debuggen. Met deze keuze willen wij niet onze definitieve voorkeur voor Firefox aangeven; er zijn praktische redenen geweest om te kiezen voor Firefox. Wij sluiten ons hiermee aan bij de keuze die in het tekstboek is gemaakt en daarnaast sluit Firefox goed aan bij standaarden. 10 OU
Introductie tot de cursus Software downloaden De ondersteuning die het tekstboek en het cursusboek bieden, bijvoorbeeld in de vorm van aanwijzingen en uitwerkingen bij de opdrachten is gebaseerd op de keuze voor Firefox. U bent vrij om een andere browser te gebruiken, maar u kunt dan voor verrassingen komen te staan. Wij adviseren u daarom bij het bestuderen van deze cursus Firefox te gebruiken. Verder gebruiken we (net als het boek) JSLint voor het debuggen van JavaScript-code. We maken in beperkte mate gebruik van de webserver XAMPP. Ten slotte adviseren wij u om Notepad++ als editor te gebruiken. Al deze software kunt u downloaden via de websites van de aanbieders of via Studienet. 3.3 STUDIEBEGELEIDING EN STUDIENET Als student hebt u toegang tot de website van deze cursus op Studienet. Op deze website vindt u actuele informatie over de cursus, informatie over de begeleiding en over de tentaminering, verwijzingen naar websites, errata, enzovoort. Verder zijn er discussiegroepen, waar u problemen kunt melden, vragen kunt stellen en ervaringen kunt uitwisselen. 3.4 TENTAMEN Referentiekaart De cursus wordt afgesloten met een tentamen dat bestaat uit korte open vragen. U hebt voor het tentamen drie uur de tijd. U mag naar het tentamen de referentiekaart meenemen. Deze referentiekaart is te vinden op Studienet en geeft een beknopt overzicht van elementen van de besproken talen. Het is niet toegestaan ander materiaal naar het tentamen mee te nemen. Via de eindtoets (op Studienet) kunt u zich voorbereiden op het tentamen. Meer informatie over de organisatie van de tentaminering vindt u op Studienet. OU 11
12 OU Webapplicaties: de clientkant
Introductie tot de cursus Blok 1 Context OU 13