Hier en daar wat kleine tweaks gemaakt.
This commit is contained in:
parent
c7d3ee93bd
commit
c7292b7dac
3
articles/handenuitdemouwen/webapp.md
Normal file
3
articles/handenuitdemouwen/webapp.md
Normal file
|
@ -0,0 +1,3 @@
|
|||
#### Handen uit de mouwen
|
||||
---
|
||||
Lel
|
|
@ -4,7 +4,7 @@ Heel veel mensen op het Werkmancollege locatie Stadslyceum gebruiken een alterna
|
|||
|
||||
Mijn passie voor programeren en dingen uitzoeken heeft me de laatste paar jaar bezig gehouden met het steeds beter worden in het ontwikkelen van websites, applicaties en andere technische snufjes. Werkmanrooster is daar geen uitzondering op. Dit is dan ook de reden dat ik mijn profielwerkstuk hierover schrijf. Ik vind het heel leuk vind om uit te leggen hoe programeren te werk gaat en misschien mensen iets nieuws laten leren.
|
||||
|
||||
Toen het mijn beurt was om Werkmanrooster te beheren, zijn er al veel versies van Werkmanrooster langsgekomen. Dit profielwerkstuk gaat over mijn tweede versie van Werkmanrooster, genaamd [`rooster.io`](http://github.com/96aa48/rooster.io). Dit is de versie van werkmanrooster die iedereen heeft gebruikt voor de laatste twee jaar. Ik ga in dit profielwerkstuk aan jou uitleggen hoe het internet werkt, hoe Werkmanrooster werkt, wat data-gedreven applicaties zijn en nog veel meer.
|
||||
Toen het mijn beurt was om Werkmanrooster te beheren, zijn er al veel versies van Werkmanrooster langsgekomen. Dit profielwerkstuk gaat over mijn tweede versie van Werkmanrooster, genaamd [rooster.io](http://github.com/96aa48/rooster.io). Dit is de versie van werkmanrooster die iedereen heeft gebruikt voor de laatste twee jaar. Ik ga in dit profielwerkstuk aan jou uitleggen hoe het internet werkt, hoe Werkmanrooster werkt, wat data-gedreven applicaties zijn en nog veel meer.
|
||||
|
||||
---
|
||||
[Volgende >>](/moeilijkheidsgraad)
|
||||
|
|
|
@ -24,7 +24,7 @@ Wat de secretaresse doet is elk bestand bij langs gaan en dit vergelijken met jo
|
|||
---
|
||||
|
||||
##### Zoeken naar een naald in een naaldberg
|
||||
Bij het intypen van `Bram van der Veen` zal `rooster.io` [de informatie](http://werkmanrooster.nl/api/search?name=Bram van der Veen) vinden die daar bij hoort. Je ziet een duidelijke overeenkomst tussen het onder weergeven database bestand en het bestand van de archiefkast. Het verschil zijn wat vreemde tekens in en rond de informatie. Wat betekent dit allemaal?
|
||||
Bij het intypen van `Bram van der Veen` zal rooster.io [de informatie](http://werkmanrooster.nl/api/search?name=Bram van der Veen) vinden die daar bij hoort. Je ziet een duidelijke overeenkomst tussen het onder weergeven database bestand en het bestand van de archiefkast. Het verschil zijn wat vreemde tekens in en rond de informatie. Wat betekent dit allemaal?
|
||||
|
||||
```javascript
|
||||
//In dit voorbeeld heeft naam_voor_de_data, de waarde "data".
|
||||
|
@ -37,7 +37,7 @@ Bij het intypen van `Bram van der Veen` zal `rooster.io` [de informatie](http://
|
|||
|
||||
Wat we hier zien is ook een soort van `code`. Het is misschien niet direct een manier van vertellen wat een computer moet doen, maar een manier waarop code informatie kan vasthouden en organiseren. De structuur (of syntax) is vergelijkbaar met die van `Javascript`, dat klopt ook zeker. Dit is namelijk een dataobject genoteerd in zogenaamd "**J**ava**s**cript **O**bject **N**otation", `JSON` in het kort. Eigenlijk staat er precies hetzelfde als in het bestand uit de archiefkast, maar er zijn wat tekens aan toegevoegd zodat de computer het kan lezen.
|
||||
|
||||
`Rooster.io` werkt hier net zoals de secretaresse. Hij gaat alle bestanden bij langs om te kijken of jouw zoekopdracht overeenkomt met een van de vele bestanden in de database. Zo'n bestand ziet er zo uit:
|
||||
rooster.io werkt hier net zoals de secretaresse. Hij gaat alle bestanden bij langs om te kijken of jouw zoekopdracht overeenkomt met een van de vele bestanden in de database. Zo'n bestand ziet er zo uit:
|
||||
```javascript
|
||||
//Een dataset voor de zoekopdracht "Bram van der Veen"
|
||||
{
|
||||
|
@ -55,6 +55,6 @@ Wat we hier zien is ook een soort van `code`. Het is misschien niet direct een m
|
|||
}
|
||||
```
|
||||
Het bestand is eigenlijk een groep variabeles die het systeem bij langs gaat. In dit geval komt `Bram van der Veen` overeen met de waarde van het variabele `name`. Maar hetzelfde geld als ik bijvoorbeeld alleen `Bram` of `van der Veen` intyp, het systeem zal alleen [meerdere ](http://werkmanrooster.nl/api/search?name=Bram)[mensen](http://werkmanrooster.nl/api/search?name=van der Veen) vinden met dezelfde waardes.
|
||||
Als `rooster.io` meerdere mensen vindt voor dezelfde zoekopdracht dan maakt hij een lijst zodat de gebruiker kan kiezen uit welk van de mensen hij of zij het rooster wil zien. Als er maar één persoon gevonden wordt dan gaat `rooster.io` verder met de volgende stap, het rooster verkrijgen en verwerken.
|
||||
Als rooster.io meerdere mensen vindt voor dezelfde zoekopdracht dan maakt hij een lijst zodat de gebruiker kan kiezen uit welk van de mensen hij of zij het rooster wil zien. Als er maar één persoon gevonden wordt dan gaat rooster.io verder met de volgende stap, het rooster verkrijgen en verwerken.
|
||||
|
||||
[Volgende >>](/verkrijgen)
|
||||
|
|
|
@ -15,7 +15,7 @@ Hoe een template werkt, is te vergelijken met wiskundige formules. Je hebt gewoo
|
|||
p Hallo #{naam}, hoe gaat het met jou?
|
||||
```
|
||||
|
||||
Ik voer dan voor het variabele `naam` dan de naam van de rooster opvrager. Op die manier krijg ik dus bijvoorbeeld `Hallo Bert, hoe gaat het met jou?` als het variabele naam gelijk staat aan `Bert`. Deze templaten zijn echter geschreven in een taal die dit soort vergelijkingen makkelijk leesbaar maakt voor de programeur, ik heb voor `rooster.io` gekozen voor `Jade`. `Jade` kan veel handige dingen zoals het importeren van templaten in een ander template, waardoor je een project modulair kan aanpakken. Laten we eens bekijken hoe zo'n template er uit ziet.
|
||||
Ik voer dan voor het variabele `naam` dan de naam van de rooster opvrager. Op die manier krijg ik dus bijvoorbeeld `Hallo Bert, hoe gaat het met jou?` als het variabele naam gelijk staat aan `Bert`. Deze templaten zijn echter geschreven in een taal die dit soort vergelijkingen makkelijk leesbaar maakt voor de programeur, ik heb voor rooster.io gekozen voor `Jade`. `Jade` kan veel handige dingen zoals het importeren van templaten in een ander template, waardoor je een project modulair kan aanpakken. Laten we eens bekijken hoe zo'n template er uit ziet.
|
||||
|
||||
```jade
|
||||
.bar
|
||||
|
|
|
@ -16,7 +16,7 @@ Hij bekijkt het bestand en richt zich gelijk op de laatste waarde van het bestan
|
|||
---
|
||||
|
||||
#### Data verkrijgen en algoritmes
|
||||
`Rooster.io` gaat ook verder, door het bestand uit de database te verwerken. Hij doet hetzelfde als de collega in het verhaal hierboven. Hij knipt en plakt het rooster in een nieuw jasje. Maar dan op een geprogrameerde en effici"ente manier.
|
||||
rooster.io gaat ook verder, door het bestand uit de database te verwerken. Hij doet hetzelfde als de collega in het verhaal hierboven. Hij knipt en plakt het rooster in een nieuw jasje. Maar dan op een geprogrameerde en effici"ente manier.
|
||||
|
||||
Hij gaat naar de link die is gegeven in het bestand en download het daar gevonden rooster als tekstbestand. Vervolgens gaat hij door dit tekstbestand heen om het rooster uit te vissen. Hij leest dit bestand volgens een bepaald algoritme. Dit algoritme is voorgeprogrameerd om bepaalde informatie er uit te halen. De informatie die verkregen word uit de webpagina is bijvoorbeeld de rooster informatie. Dit zijn dingen zoals welke uren je welke lessen hebt met welke docenten en in welk lokaal. Het algoritme verkrijgt ook informatie zoals het naam van het rooster. Hij vertaalt dan deze door mensen te lezen informatie, in een soortgelijk [database bestand](http://werkmanrooster.nl/api/schedule?name=16374) zodat een computer het kan lezen. Het verschil in database bestanden tussen een rooster en die van een leerling, is het verschil van inhoud. Een database bestand van een leerling houdt informatie vast over de leerling, terwijl een database bestand van een rooster informatie vasthoud over een specifiek rooster. Nu moet er van dit database bestand een webpagina gemaakt worden.
|
||||
|
||||
|
|
|
@ -8,9 +8,9 @@ var articles = [
|
|||
'intypen:Je gaat naar de website',
|
||||
'opzoek:Op zoek naar je naam',
|
||||
'verkrijgen:Verkrijgen en verwerken',
|
||||
'dataapps:Data gedreven applicaties',
|
||||
'templates:Templaten',
|
||||
'database:De database'
|
||||
'database:De database',
|
||||
'handenuitdemouwen:Handen uit de mouwen'
|
||||
]
|
||||
|
||||
module.exports = function (req, res, next) {
|
||||
|
|
Loading…
Reference in a new issue