koppelen in De belangrijkste punten van hoofdstuk 15 Databasetechnieken gebruiken. De eigenschappen van een database instellen.

Transcriptie

1 15 Een database koppelen in Dreamweaver CS3 De belangrijkste punten van hoofdstuk 15 Databasetechnieken gebruiken. De eigenschappen van een database instellen. Databasetechnieken gebruiken. De eigenschappen van een database instellen.

2 Wat leert u in dit hoofdstuk? Wat databasetechnieken zijn. Wat een database is. Hoe een database wordt opgebouwd. Hoe een database wordt gekoppeld. Een databasetoepassing maken in Dreamweaver CS3.

3 Dreamweaver CS3 de basis 15.1 Een dynamische website Een dynamische website biedt veel voordelen. Bij een dynamische site wordt meestal de content in een database geplaatst. Zo kunt u met een database: Een website gemakkelijk onderhouden met behulp van het Content Management Systeem dat daarvoor is gebouwd; Gemakkelijk door de website zoeken; Producten bekijken en in een database plaatsen; Online bestellingen die in een database zijn ingevoerd bijhouden Benodigdheden Anders dan bij een statische website hebt u voor een dynamische site de volgende zaken nodig: Database, zoals MS Access, MySQL, MS SQL of FileMaker; Scripttaal die de database kan aanspreken, zoals PHP, ASP, ASP.NET, CFML of JSP; Eigen webserver of een hostingprovider die de databases en scripttaal aanbiedt. De (web)server is nodig om de scripttaal en de database samen te brengen en te kunnen laten draaien. De toepassing draait fysiek op een geschikte (web)server; Kennis van de gebruikte scripttaal om de toepassing in elkaar te zetten; Een duidelijk ontwerp van hoe de processen lopen op uw website. Afbeelding 15.1 Keuze maken in techniek.

4 15 Een database koppelen in Dreamweaver CS3 Na het maken van een keuze van de databasetechnologie en het opzetten van de weben databaseomgeving biedt Dreamweaver een groot aantal gratis toepassingen Mogelijke toepassingen met Dreamweaver Met Dreamweaver zijn onder andere de volgende toepassingen te maken: Product- of artikel invoersysteem; Dynamisch overzicht; Mutatiesysteem; Dynamische zoekopties. Afbeelding 15.2 Een beheersysteem voor boeken. Eventuele andere toepassingen kunt u vinden en downloaden op De databasekeuze De keuze voor een database is erg belangrijk. Sommige databases kunt u gratis gebruiken, andere hebben een licentie nodig. Databases die u eenvoudig kunt gebruiken in Dreamweaver zijn: MS Access of MS SQL van Microsoft, die zich vooral kenmerken voor gebruiksvriendelijkheid; MySQL, een gratis open-sourcedatabase die gemakkelijk gekoppeld kan worden en veel op internet wordt gebruikt.

5 Dreamweaver CS3 de basis Afbeelding 15.3 Pagina s toevoegen aan een nieuwssysteem. De keuze van de database hangt af van uw budget en de benodigde capaciteit. Met de genoemde databases kunt u vrij geavanceerde oplossingen maken. De grootste databaseproducent ter wereld is Oracle. Microsoft en IBM zijn twee andere belangrijke leveranciers van databases. Vrijwel alle databases ondersteunen SQL: Structured Query Language, de taal om databases aan te sturen en te manipuleren De scripttaalkeuze Niet elke scripttaal kan gekoppeld worden aan een willekeurige database. Er bestaat vaak een zekere chemie tussen een scripttaal en een bepaalde database. Zoals gezegd, is de scripttaal die de database aanstuurt onderdeel van de serversidetechniek. Deze code ziet u niet in de browser. Dreamweaver ondersteunt de volgende scripttalen: PHP (Hypertext Preprocessor): een open-sourcescripttaal die erg populair is. In Europa is dit een van de meest gebruikte scripttalen op het web. In 2005 is versie PHP5 uitgebracht. Meer over deze ontwikkelingen leest u op ASP (Active Server Pages): een scripttaal van Microsoft die eenvoudig een MS Access-database op het internet publiceert. ASP is vaak aanwezig in Windows XP Pro of een soortgelijke professionele Windows-versie. De meest actuele versie van ASP is versie 3.0. ASP.NET is de opvolger; ASP.NET, onderdeel van het.net-framework. Dit is de opvolger van ASP 3.0. ASP.

6 15 Een database koppelen in Dreamweaver CS3 NET (dot net) kan geavanceerde toepassingen bouwen en diverse soorten databases koppelen. Deze scripttaal gebruikt onder andere XML als belangrijke techniek in het koppelen van databases; CFML (ColdFusion Markup Language), een product van Allaire en Macromedia. Deze scripttaal is vooral in de Verenigde Staten erg populair. CFML kan diverse soorten grote databases eenvoudig koppelen; JSP (Java Server Pages) wordt vaak in Java-omgevingen gebruikt. JSP is een dure, maar betrouwbare en stabiele scripttaal van producent SUN. Programmeurs die met JSP werken, gebruiken meestal een teksteditor als Dreamweaver. Ook vorige versies van Dreamweaver boden al ondersteuning voor JSP. Er zijn nog meer scripttalen die feilloos een database kunnen aansturen. Deze worden echter niet ondersteund door Dreamweaver Een databasekoppeling voorbereiden Voordat we een database aan een website gaan koppelen, zullen we de nodige voorbereidingen moeten treffen. Voor de koppeling hebben we het volgende nodig: Een gevulde database waarvan we de structuur kennen; Een Data Source Name die tussen de scripttaal en de database staat; De scripttaal; Een webserver die de scripttaal en de database kan draaien; Een in Dreamweaver ingestelde sitemap gebaseerd op de andere componenten. In de volgende paragraaf bouwen we in de vorm van een case een databasegestuurde toepassing met de genoemde onderdelen. De webserver De webserver is de software die de scripttaal en de database kan publiceren. Een webserver is onderdeel van een hostingserver die de gehele website kan publiceren. Zo heeft een webserver een specifieke taak om bijvoorbeeld de scripttaal ASP te laten zien in de browser. De werking van de webserver is eenvoudig. De server leest bijvoorbeeld de ASP-code uit en vertaalt dit op de webserver naar HTML. ASP heeft in een eerder stadium bijvoorbeeld gegevens uit een MS Access-database uitgelezen. De HTML kan weer worden gepubliceerd in de browser.

7 Dreamweaver CS3 de basis Afbeelding 15.4 Databasekoppelingen kunnen zeer complex zijn Een dynamisch overzicht maken In deze paragraaf maken we de fysieke koppeling en toepassing met MS Access, ASP en Dreamweaver. Helaas kunt u dit alleen onder Windows (98/XP/2000/ Vista) uitproberen. MacOS X ondersteunt geen ASP, maar daarentegen wel weer standaard PHP en MySQL. Een database Een database is een bestand waarin we op een speciale manier gegevens kunnen opslaan. Een database bevat tabellen met rijen die we records noemen. Ieder record bevat op zijn beurt velden. Voor ieder record in een tabel is de betekenis van elk veld hetzelfde. Een tabel met adresgegevens bevat bijvoorbeeld allemaal records met de velden adres, postcode, plaats enzovoort. Een database kan verschillende tabellen bevatten. Voor de oefening in de volgende paragraaf gaan we een met films gevulde MS Access-database bekijken. Hiervoor moeten we eerst een Data Source Name (DNS) in Windows aanmaken. In Dreamweaver zetten we vervolgens de sitemap klaar voor ASP. Daarna bouwen de interface in Dreamweaver en leggen we de koppeling zodat de de dynamische content verschijnt.

8 15 Een database koppelen in Dreamweaver CS De database bekijken In MS Access staat de met films gevulde database films.mdb klaar (zie afbeelding 15.6). Afbeelding 15.5 Een filmdatabase aanleggen. Als we de database bekijken, zien we de volgende velden: id, het unieke nummer; filmtitel, gevuld met tekst; genre, gevuld met tekst; waardering, gevuld met een getal van 1 tot 10. De database is gevuld met de volgende records, die van links naar rechts de velden id,filmtitel, genre en waardering invullen: Afbeelding 15.6 Een filmdatabasestructuur in MS Access.

9 Dreamweaver CS3 de basis Tabel 15.1 Velden in de filmdatabase ID Filmtitel Genre Waardering 1 Crash Thriller 9 2 Hostel Horror 5 3 Guess Who Humor 8 4 Fun with Dick and Jane Humor 7 5 Johan Cruijff: en un Momento Dado Sport 9 We hebben nu een database met vijf records (zie afbeelding 15.7). Afbeelding 15.7 Een filmdatabase met rijen of records De Data Source Name (DSN) De DSN is als de trekhaak tussen de auto en een caravan. Een DSN staat in ons geval tussen de scripttaal ASP en de MS Access-database. In de DSN definiëren we: Naam van de database; Soort database; Naam van de DSN zodat we die in Dreamweaver kunnen gebruiken; Plaats van de database op de harde schijf of server. Nu gaan we de DSN aanmaken in Windows. Oefening 15.1 Een DSN aanmaken 1 Open in Windows (XP) het Configuratiescherm via het menu Start. 2 Kies voor de optie Prestaties en onderhoud. 3 Kies nu de optie Beheer. 4 Kies nu voor de optie Gegevensbronnen (ODBC). Het dialoogvenster voor de DSN verschijnt (zie afbeelding 15.8).

10 15 Een database koppelen in Dreamweaver CS3 5 Klik op Toevoegen om een DSN toe te voegen. Kies voor de Microsoft Access Driver(*.mdb). 6 Geef de DSN de naam dsnfilms. Wijs met de optie Selecteren onze database aan. 7 De omschrijving is niet verplicht. Bevestig met OK. MS Access is gemakkelijk te koppelen met ASP, de scripttaal die we gaan gebruiken. Hiervoor hebben we een webserver nodig van Microsoft. Afbeelding 15.8 De Data Source Name De webserver Onder Windows draait een zogeheten IIS-webserver (Internet Information Servicesserver). Deze is werkzaam in de map C:\Inetpub op uw harde schijf. Hiertoe moet u wel in het bezit zijn van Windows XP Pro of een soortgelijke (professionele) editie. De Home Editie kent geen ingebouwde webserver. In Windows Vista Home Basic Edition en Vista Starter Edition is er helaas ook niet in IIS voorzien. We gaan er voor deze oefening vanuit dat u de beschikking hebt over IIS. In de map Inetpub kunt u onder andere ASP vinden. De map die onze databasetoepassing kan publiceren, is de map wwwroot. Plaats een submap met de naam Dreamweaverfilms in deze map. We gaan nu in Dreamweaver een sitemap aanmaken die verwijst naar deze map in de webserver.

11 Dreamweaver CS3 de basis Afbeelding 15.9 Is de Inetpub aanwezig op uw systeem? Toch een webserver in de Home Edition De website toont een artikel waarin wordt gesteld dat u toch een IIS-webserver onder de Home Edition kunt draaien. Het gerucht gaat dat de webserver wel aanwezig is in deze editie, maar simpelweg niet is geactiveerd. Andere webservers zijn bijvoorbeeld: Apache voor het gebruik van PHP, standaard aanwezig in MacOS X; Jakarta voor het gebruik van Java; SUNOne voor het gebruik van Java; ColdFusion Enterprise Server voor CFML. Afbeelding Voor Vista is IIS 7.0 webserver ontwikkeld.

12 15 Een database koppelen in Dreamweaver CS3 Afbeelding De IIS 7.0 webserver De sitemap in Dreamweaver Eerder in dit boek hebt u al een sitemap opgezet, maar deze was nog niet geschikt voor een databasekoppeling. Oefening 15.2 De sitemap geschikt maken voor de filmdatabase 1 Open Dreamweaver CS3 en kies Site > Nieuwe Site... 2 Geef als naam Dreamweaverfilms op voor de site, zie afbeelding Nu wijzen we de juiste technologie aan: kies voor ASP VBScript. 4 Kies vervolgens de map uit die we zojuist hebben aangemaakt in de webserver: Dreamweaverfilms, zie afbeelding Klik nu op Volgende en controleer of de link wordt vermeld. 6 Klik door met Volgende totdat u de definitie kunt bevestigen. Klik op OK. De omgeving staat nu klaar De interface in Dreamweaver In Dreamweaver gaan we nu het ontwerp maken voor een dynamisch overzicht van de films in de database.

13 Dreamweaver CS3 de basis Afbeelding Een Site aanmaken. Afbeelding Is de juiste map aanwezig?

14 15 Een database koppelen in Dreamweaver CS3 Oefening 15.3 Interface ontwerpen voor filmdatabase 1 Sla het document op als overzicht.asp. 2 Plaats het in de projectmap op de webserver. Pas dan de titel aan en voer de gewenste paginaeigenschappen in. 3 Voeg een tabel in van vier kolommen en drie rijen en maak de tabel op met het paneel Eigenschappen Content plaatsen De interface staat nu klaar. In de tabel kunnen we straks de dynamische content slepen. Eerst zullen we echter de koppeling in Dreamweaver actief moeten maken. Oefening 15.4 Databasekoppeling in Dreamweaver actief maken 1 Activeer het paneel Toepassingen en selecteer de tab Databases. Afbeelding De DSN koppelen. 2 Noem de verbinding connfilms en selecteer onze dsnfilms als DSN. 3 Bevestig met OK. De databaseverbinding wordt nu zichtbaar in het paneel, zie afbeelding Activeer de tab Bindingen en klik op het zwarte plusteken. 7 Neem de gegevens over van afbeelding en bevestig met OK. 8 Sleep nu de dynamische inhoud uit Bindingen in de tabelcellen. 9 Plaats op de bovenste rij van de tabel de velden ID, Titel, Genre en Waardering. 10 Test de koppeling met Voorvertoning in de browser of druk op functietoets F12. Sluit eventueel Dreamweaver af als u een foutmelding krijgt (File already in use). Het is wat dat betreft belangrijk dat u alle updates hebt geïnstalleerd voor uw besturingssysteem. U ziet nu nog

15 Dreamweaver CS3 de basis Afbeelding De verbinding is zichtbaar. Afbeelding De recordset om bij Bindingen gegevens op te halen. Afbeelding De tabel voor de dynamische content.

16 15 Een database koppelen in Dreamweaver CS3 maar één record. We zullen de dynamische content moeten herhalen om alle vijf de films te kunnen zien. Afbeelding De tabel met database-inhoud. Selecteer de rij met de dynamische inhoud en klik op de tab Server gedragingen in het paneel Toepassing. Klik vervolgens op het zwarte plusteken en kies voor Rijen herhalen. Laat de vijf records zien en bevestig met OK. Bekijk het dynamische resultaat in de browser. Paul Vreke, webontwikkelaar, gebruikt dreamweaver Paul Vreke, webontwikkelaar van CC Internet & Communicatie (CCIC) over het maken van databasetoepassingen met Dreamweaver: Het is vooral de eenvoud. Met wat basiskennis kom je een heel eind in Dreamweaver. Je hebt alleen de inloggegevens, de naam van de database en wat overige gegevens nodig en je kunt een toepassing bouwen. Toepassingen zoals de automatische navigatie door de database zijn indrukwekkend snel te maken. Het is een hoop klik-en-sleep (drag and drop), maar zeker stukken sneller dan met de hand coderen. Als je de kennis hebt om toch handmatig een en ander te programmeren, kun je in de codeweergave gemakkelijk een en ander opsporen en oplossen en eventueel de toepassing met de hand nog geavanceerder maken. De keuze van de database en de praktijk Het kiezen van een database is een lastige klus. Indien u een juiste keuze maakt, kunt u met uw databasegestuurde website schaalbaar werken. Indien de keuze niet geheel op de toekomst gericht blijkt, dan zult u een keer vastlopen met de mogelijkheden. De keuze is van verschillende factoren afhankelijk. We kijken hier vooral naar de toekomst en de eventueel te verwachten groei van uw website of webtoepassing. Uzelf eerst vragen stellen Voordat u bewust een databasekeuze maakt, zijn er een aantal vragen die u in acht moet nemen: Wat is het budget dat u hebt voor een database(licentie) of programmering? Hoe is de schaalbaarheid van de database? Praktijkvoorbeeld

17 Dreamweaver CS3 de basis Praktijkvoorbeeld Welke kennis hebt u van de database om bijvoorbeeld in de toekomst uitbreidingen toe te voegen aan uw applicatie? Voor het web bestaat er een aantal uitstekende databases. Deze zijn beschikbaar voor bijvoorbeeld een Microsoft-omgeving of voor het draaien op een Unix- of Linux-machine. Als u op dit moment op een Windows-machine werkt, dan ligt het voor de hand dat u een database kiest die daaronder draait. Indien u bijvoorbeeld onder MacOS X werkt, dan wordt dit als een Unix-machine gezien, aangezien de onderlaag van MacOSX het besturingssysteem Unix is. Een database van Microsoft: gemakkelijk beschikbaar Elke database vereist een zogenaamde omgeving waarin deze draait. De omgeving is eigenlijk de server waar de database op kan draaien en functioneren. Indien u kiest voor een database van Microsoft dan zal de omgeving ook een Microsoft-omgeving moeten zijn. Microsoft kent de databases: MS Access, dat onderdeel is van een professionele versie van MS Office; MS SQL Server, die als volwassen versie van MS Access wordt gebruikt op de websites van bijvoorbeeld Wehkamp en Free Record Shop. Voor de koppeling van een Microsoft-database hebt u weinig kennis nodig. Microsoft maakt het de gebruiker zeer gemakkelijk door het eenvoudige gebruik van de databases MS Access en MS SQL. Op de website kunt u een gratis versie van ASP. NET, inclusief een probeerversie van MS SQL Server downloaden. Een database die op Unix draait: veelal gratis Op de besturingssystemen Unix of Linux draaien gratis databasesystemen zoals PostgreSQL of MySQL. Indien u werkt op een Mac, dan zult u een van de database moeten gebruiken die op een Unix- of Linux-systeem draaien. Microsoft-databases zijn ongeschikt voor de MacOS X-omgeving. Beide genoemde databases zijn gratis. De databases zijn zoals dat heet open-source. Zo kunt u op de database downloaden en eventuele handleidingen bekijken. Om deze gratis databases aan te maken hebt u speciale adminsoftware nodig. Deze kunt u bijvoorbeeld net als de database zelf downloaden van Een bekend beheerprogramma voor MySQL-databases is bijvoorbeeld PhpMyAdmin(. net). Naast de genoemde populaire databases zijn er nog veel meer databases zoals Filemaker Pro, Oracle en diverse varianten van SQL-databases. Voordat u aan de slag gaat met databasekoppelingen op het internet zou ik u een training willen aanbevelen in de door u gekozen database en serverside-scripttaal of een van de vele Pearson-boeken te raadplegen die over dit onderwerp zijn uitgekomen.