Lesweek 6

• Applicatie- en mediaontwikkelaar
• MBO
• Studiejaar 2

Kennismakingsronde

• terugblik javascript
• wat is er nodig om wordpress lokaal te draaien
• installatie xampp
• onderdelen xampp

Doelen

Waarom wordt JavaScript vaak gebruikt in webontwikkeling?

1. Om de stijl van een website te bepalen
2. Om interactieve elementen en dynamische content op een webpagina mogelijk te maken
3. Om afbeeldingen op een website te beheren
4. Om tekst te formatteren

Wat is de functie van document.getElementById("mijnElement") in JavaScript?

1. Het maakt een nieuw HTML-element aan met de ID "mijnElement"
2. Het verwijdert een element met de ID "mijnElement" van de pagina
3. Het zoekt een HTML-element met de ID "mijnElement" en geeft dit terug, zodat je er wijzigingen aan kunt maken
4. Het zorgt ervoor dat een element met de ID "mijnElement" verborgen wordt

De variabele leeftijd heeft de waarde 15. Wat zal er in de console worden weergegeven?

1. "Ga links af"
2. "Ga rechts af"
3. Er gebeurt niets
4. Er verschijnt een foutmelding

Kennismakingsronde

• Kan een eenvoudig functioneel en technisch ontwerp voor een website lezen
• Kan een content management systeem (CMS) installeren
• Kan een database koppelen aan de website via een content management systeem (CMS)
• Kan door middel van gebruik van thema's een website vormgeven en realiseren conform het functioneel en technisch ontwerp
• Kan een website publiceren
• Kan de website via het content management systeem (CMS) aanpassen aan de specifieke wensen van een klant of

Examenstof - richting Exameneisen

Kennismakingsronde

Een website met een webshop met behulp van een content management systeem (CMS) - Wordpress

Examen Basis Web Development

We hebben geleerd dat browsers werken op basis van html, css en javascript.
Met een cms kan je een website maken zonder dat je iets hoeft te weten van html en css.

Hoe doet een cms dat dan?

Kennismakingsronde

• Gebruiksvriendelijkheid
  Inhoud beheren zonder programmeerkennis
  
• Snelle aanpassingen
  Eenvoudig content wijzigen via een intuïtieve interface
• Tijd besparen
  Snel en efficiënt onderhoud en updates uitvoeren

Er zijn heel veel CMS-en. We kiezen voor Wordpress

Content Management System (CMS)

Kennismakingsronde

• 2003: WordPress opgericht door Matt Mullenweg en Mike Little, gebaseerd op b2/cafelog.
• Oorsprong als blogplatform: Begonnen als eenvoudig systeem voor bloggers.
• Open-source ontwikkeling: Groeide door bijdrages van een wereldwijde community van ontwikkelaars.
• Uitbreiding van functionaliteiten: Thema’s, plug-ins en widgets toegevoegd voor veelzijdig gebruik.
• Populairste CMS ter wereld: Circa 40% van alle websites draaien nu op WordPress.
• Gebruik buiten bloggen: WordPress evolueerde tot een platform voor volledige websites, webshops, en applicaties.

Wordpress - kenmerken

Kennismakingsronde

Wordpress - onderdelen en technieken

Kennismakingsronde

Wordpress - onderdelen en technieken

Kennismakingsronde

Wat hebben we nodig aan software?

• Webserver (apache)
• Databaseserver (Mysql)
• PHP
  
  
• Als stack - xampp met een control panel
  
  

Wordpress lokaal installeren

Kennismakingsronde

Samwerking webserver, met fileserver en databaseserver

Server is niet per se een aparte machine.

In ons geval een service die draait op de laptop.
Laptop is dus zowel client als server!

Kennismakingsronde

• Programmeertaal
• Speciaal voor het web ontwikkeld
• Draait op de server
• Verzorgt de uitwisseling met de database
  
• Extensie .php
• functie -> html genereren!
  

PHP

Kennismakingsronde

Download en installeer de laatste versie

• https://www.apachefriends.org/download.html
• Gebruik de standaardmap c:\xampp
• Bij de opties zijn de optionele opties:
  mysql en phpmyadmin nodig
  De andere tools als perl etc niet
  

XAMPP installeren

Kennismakingsronde

• http(s)://localhost in de browser verwijst naar de map
  c:\xampp\htdocs
• Zoekt naar index.php of index.html
• Je kunt elke map binnen htdocs beschouwen als een website

XAMPP

Kennismakingsronde

• Een eenvoudige php pagina
• Een lijst maken met een PHP-loop
  
• Een database maken via phpMyAdmin
• Dummy data toevoegen aan de database
• PHP gebruiken om gegevens uit de database te tonen

Oefeningen

Kennismakingsronde

• phpmyadmin is een admin gedeelte van mysql
• zorg ervoor dat de services apache en mysql gestart zijn
  
• admin gedeelte is ook via het control panel te benaderen

Demo aanmaken database, tabel en dummy data

Toelichting bij de oefening

Kennismakingsronde

Diverse oefeningen met php.
Het doel: Een keer gezien hebben wat je er allemaal mee kunt doen. Vind je het leuk interessant, overweeg dan een vervolgopleiding tot software developer!

Lever de screenshots in word format in bij de opdracht "PHP en MYSQL oefeningen inleveren"

Klaar? Even samen doorlopen

Probeer eens Wordpress te installeren ! Google, AI

Zelf aan de slag

Wat zijn de stappen om Wordpress te installeren?

Kennismakingsronde

Introductie cms - Wordpress

• Installatie XAMPP
• Korte introductie PHP

Volgende week

Installatie Wordpress

Terug- en vooruitblik