bram/hoewerkt
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Heb wat kleine aanpassingen gemaakt aan de artikelen en code.

Browse source
This commit is contained in:
Bram van der Veen 2015-08-24 13:06:42 +02:00
parent fac5703ee9
commit d3bad9aff2
6 changed files with 28 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
app.js
View file

@ -19,7 +19,7 @@ app.use('/other', express.static(__dirname + '/resources/other'));
app.get('/', hoewerkt); app.get('/', hoewerkt);
app.get('/:article', hoewerkt); app.get('/:article', hoewerkt);
app.get('/:article/:difficulty', hoewerkt);
function start(port) { function start(port) {
app.listen(port); app.listen(port);

6
articles/index.md
View file

@ -3,7 +3,7 @@
Welkom op de index van mijn profielwerkstuk. Vanuit hier kun je alle verschillende hoofdstukken en deelvragen bekijken en nalezen. Ik zou echt wel voorstellen om de artikelen te lezen op chronologische volgorde, want op die manier zou het het makkelijkste te lezen zijn. Welkom op de index van mijn profielwerkstuk. Vanuit hier kun je alle verschillende hoofdstukken en deelvragen bekijken en nalezen. Ik zou echt wel voorstellen om de artikelen te lezen op chronologische volgorde, want op die manier zou het het makkelijkste te lezen zijn.
--- ---
<!--
Ik ben in de laatste paar weken druk bezig geweest met het maken van het nieuwe Werkmanrooster. Ik ben in de laatste paar weken druk bezig geweest met het maken van het nieuwe Werkmanrooster.
Ik wil dit nu opnieuw gemaakte project gaan onderzoeken en aan de hand daarvan mensen uit leggen hoe de website achter de schermen werkt. (onderzoek) Ik wil dit nu opnieuw gemaakte project gaan onderzoeken en aan de hand daarvan mensen uit leggen hoe de website achter de schermen werkt. (onderzoek)
Ik ben hier aan toegekomen in de PWS week maar heb niet een geschreven deel waarvan er al uitleg is, ik heb het voorwerk gedaan om mijn uitleg zo begrijpbaar mogelijk te houden. Ik ben hier aan toegekomen in de PWS week maar heb niet een geschreven deel waarvan er al uitleg is, ik heb het voorwerk gedaan om mijn uitleg zo begrijpbaar mogelijk te houden.
@ -18,6 +18,6 @@ Daarnaast is het project zelf (de code) [hier](http://git.werkmanrooster.nl/werk
Mijn geschreven PWS is deze website waar je nu op zit. Mijn geschreven PWS is deze website waar je nu op zit.
Voor het project van deze website kun je [hier terecht](http://git.werkmanrooster.nl/werkmanrooster/hoewerkt) en voor het [logboek hier](http://git.werkmanrooster.nl/werkmanrooster/hoewerkt/commits/master). Voor het project van deze website kun je [hier terecht](http://git.werkmanrooster.nl/werkmanrooster/hoewerkt) en voor het [logboek hier](http://git.werkmanrooster.nl/werkmanrooster/hoewerkt/commits/master).
De resultaten van de enquête die ik heb gedaan is [hier](https://docs.google.com/spreadsheets/d/1aFATRxpZHEEclkP5N8JychHlphkcezI4vAAl2nWqXe0/edit#gid=547327911) te vinden. De resultaten van de enquête die ik heb gedaan is [hier](https://docs.google.com/spreadsheets/d/1aFATRxpZHEEclkP5N8JychHlphkcezI4vAAl2nWqXe0/edit#gid=547327911) te vinden. -->
[Naar de inleiding >>](/inleiding.md) [Naar de inleiding >>](/Inleiding)

4
articles/inleiding/makkelijk - inleiding.md
View file

@ -1,7 +1,7 @@
##Inleiding #### Inleiding
--- ---
Heel veel mensen op het Werkmancollege locatie Stadslyceum gebruiken een alternatieve manier van hun rooster bekijken. Dit doen ze via Werkmanrooster, een door leerlingen opgerichte website voor het bekijken van je eigen rooster. [Het eerste initiatief](http://web.archive.org/web/20101216064457/http://werkmanrooster.nl/) van [Moet opzoek naar eerste oprichters] toen [overgenomen](http://web.archive.org/web/20140103031959/http://werkmanrooster.nl/) door Daniël Koster & Friso Wobben. Sinds December 2014 was het mijn beurt om het domein in bezit te nemen. Heel veel mensen op het Werkmancollege locatie Stadslyceum gebruiken een alternatieve manier van hun rooster bekijken. Dit doen ze via Werkmanrooster, een door leerlingen opgerichte website voor het bekijken van je eigen rooster. [Het eerste initiatief](http://web.archive.org/web/20101216064457/http://werkmanrooster.nl/) van [Moet opzoek naar eerste oprichters] toen [overgenomen](http://web.archive.org/web/20140103031959/http://werkmanrooster.nl/) door Daniël Koster & Friso Wobben. Sinds December 2014 was het mijn beurt om het domein in bezit te nemen.
Er zijn in die tijd al verschillende versies van Werkmanrooster langsgekomen, dit profielwerkstuk zou echter gaan over mijn tweede versie van Werkmanrooster, genaamd [rooster.io](http://git.werkmanrooster.nl/werkmanrooster/rooster-io). Dit is de versie van werkmanrooster die iedereen heeft gebruikt voor de twee jaar en waar laatst een nieuwe versie van is uitgekomen. Ik ga in mijn profielwerkstuk uitleggen hoe Werkmanrooster in elkaar zit en wat er allemaal gebeurd tijdens en voordat je jouw rooster opvraagd. Ook ga ik antwoorden geven op veel gestelde vragen en nog een ander voorbeeld geven van soort gelijke webapplicatie. Er zijn in die tijd al verschillende versies van Werkmanrooster langsgekomen, dit profielwerkstuk zou echter gaan over mijn tweede versie van Werkmanrooster, genaamd [rooster.io](http://git.werkmanrooster.nl/werkmanrooster/rooster-io). Dit is de versie van werkmanrooster die iedereen heeft gebruikt voor de twee jaar en waar laatst een nieuwe versie van is uitgekomen. Ik ga in mijn profielwerkstuk uitleggen hoe Werkmanrooster in elkaar zit en wat er allemaal gebeurd tijdens en voordat je jouw rooster opvraagd. Ook ga ik antwoorden geven op veel gestelde vragen en nog een ander voorbeeld geven van soort gelijke webapplicatie.
[Volgende (ELI5) >>](/eli5.md) [Volgende (ELI5) >>](/Moeilijkheidsgraad)

4
articles/moeilijkheidsgraad/makkelijk - eli5.md
View file

@ -1,4 +1,4 @@
#### ELI5 #### ELI5 - Explain Like I'm Five
--- ---
Als je naar de titel van deze pagina kijkt dan denk je zeker, wat is dit nou weer voor een rare term. Vast voor iets gerelateerd aan programeren of zo iets moeilijks. Gelukkig voor jou, de lezer, is dat het omgekeerde. ELI5 staat voor "Explain Like I'm 5", dat wil zeggen, leg me dit uit alsof ik vijf jaar oud ben. Dit is om ervoor te zorgen dat mijn uitleg voor iedereen begrijpbaar zou moeten zijn. Ik geef van dezelfde hoofdstukken ook nog uitleg op een gemiddeld en een wat hoger niveau, dus mocht je geintereseerd zijn dan is er meer en wat diepgaandere informatie beschikbaar. Aan het begin en aan het eind van elke pagina zijn er dus meerdere knoppen aanwezig voor het verwisselen van moeilijkheid. [Momenteel nog niet beschikbaar/word later toegevoegd]. Als je naar de titel van deze pagina kijkt dan denk je zeker, wat is dit nou weer voor een rare term. Vast voor iets gerelateerd aan programeren of zo iets moeilijks. Gelukkig voor jou, de lezer, is dat het omgekeerde. ELI5 staat voor "Explain Like I'm 5", dat wil zeggen, leg me dit uit alsof ik vijf jaar oud ben. Dit is om ervoor te zorgen dat mijn uitleg voor iedereen begrijpbaar zou moeten zijn. Ik geef van dezelfde hoofdstukken ook nog uitleg op een gemiddeld en een wat hoger niveau, dus mocht je geintereseerd zijn dan is er meer en wat diepgaandere informatie beschikbaar. Aan het begin en aan het eind van elke pagina zijn er dus meerdere knoppen aanwezig voor het verwisselen van moeilijkheid. [Momenteel nog niet beschikbaar/word later toegevoegd].
@ -10,4 +10,4 @@ Good programmers write code that humans can understand." -Martin Fowler
Dit allemaal bij elkaar is een poging om alles zo duidelijk mogelijk uit te leggen. Dit allemaal bij elkaar is een poging om alles zo duidelijk mogelijk uit te leggen.
[Volgende (De broodjeszaak) >>](/broodjeszaak.md) [Volgende (De broodjeszaak) >>](/Inhetkort)

18
articles/moeilijkheidsgraad/normaal - moeilijker.md
View file

@ -1,15 +1,25 @@
#### Moeilijker #### Rooster.io en code
--- ---
Hoewel veel van het process is uitgelegd in [de broodjeszaak](/broodjeszaak.md) is er meer aan de hand dan alleen het vragen van informatie en het krijgen hier van. Werkmanrooster of hoe ik het noem [rooster.io](http://git.werkmanrooster.nl/werkmanrooster/rooster-io), bestaat uit iets genaamd '`code`'. Deze code beschrijft wat een computer moet doen en wanneer. Deze code zorgd ervoor dat een computer bepaalde afwegingen maakt, bijvoorbeeld dat hij een [lijst geeft van meerdere leerlingen als er meerdere zijn gevonden](http://werkmanrooster.nl/rooster/bram) in plaats van het weergeven van [een rooster](http://werkmanrooster.nl/rooster/Bram van der Veen). Deze afwegingen komen veel voor in de `code` van rooster.io. Als wij het hebben over Werkmanrooster dan hebben we het eigenlijk over een website waarop leerlingen hun roosters kunnen bekijken. Ik kan je ook uitleggen hoe het werkt in [grote lijnen](/Inhetkort) maar er komt veel meer bij kijken dan alleen een voorbeeld met een broodjeszaak. Werkmanrooster heeft namelijk een tweede naam: [rooster.io](http://git.werkmanrooster.nl/werkmanrooster/rooster-io.git).
Dit is de naam voor het project, een project wat 100% bestaat uit code. Om een wat dieper begrip van Werkmanrooster en rooster.io te krijgen is het dus belangrijk dat je ook deze kant kent. Ik zou verschillende begrippen gebruiken en uiteraard uitleggen.
Om te beginnen ga ik je wat leren over `code`. `Code` is eigenlijk gewoon een manier waarop je een computer verteld wat hij moet doen. Dit kan door te vertellen welke handelingen hij moet doen, maar ook vooral afwegingen maken tussen verschillende soorten informatie. Sommige dingen zou je wel herkennen van wiskunde bijvoorbeeld de `<`, `>` en `=` tekens. Ook word er in `code` gebruik gemaakt van variabelen (`var`).
Zo'n afweging ziet er als volgende uit in `code`. Zo'n afweging ziet er als volgende uit in `code`.
```javascript ```javascript
//found_students.length wil zeggen hoeveel leerlingen er zijn. //Defineer het variabele fount_students en geef het een waarde van 10.
if (found_students.length > 1) { //Afweging: als er meer dan een leerlingen is gevonden var found_students = 10;
//We weten dat found_students 10 is. 10 is groter dan 1, dus deze afweging klopt.
if (found_students > 1) { //Afweging: als er meer dan één leerling is gevonden
//Maak dan een lijst. //Maak dan een lijst.
} }
else { //Als de eerste afweging niet klopt, dan gaat hij naar de volgende else { //Als de eerste afweging niet klopt, dan gaat hij naar de volgende
//Laat een rooster zien //Laat een rooster zien
} }
``` ```
Bij de andere hoofdstukken zou ik uiteraard nieuwe dingen uitleggen, dus wees bereidt om wat nieuws te leren!
[Volgende >>](/Inhetkort/normaal)

13
hoewerkt.js
View file

@ -8,17 +8,15 @@ var articles = [
] ]
module.exports = function (req, res, next) { module.exports = function (req, res, next) {
console.log('Got a hit');
if (req.url == '/') { if (req.url == '/') {
res.render('article', render('index')); res.render('article', render('index'));
} }
else { else {
var sub = req.url.split('/')[1]; var sub = req.url.split('/')[1];
var othersub = req.url.split('/')[2] || 'makkelijk'; var othersub = req.url.split('/')[2] || 'makkelijk';
for (article of articles) { for (article of articles) {
if (sub == article.split(':')[0]) { if (sub == article.split(':')[0]) {
res.render('article', render(sub, othersub)) res.render('article', render(sub, othersub, res))
return; return;
} }
} }
@ -26,13 +24,14 @@ module.exports = function (req, res, next) {
} }
} }
function render(file, difficulty) { function render(file, difficulty, res) {
if (file == 'index') var content = fs.readFileSync(__dirname + '/articles/index.md').toString(); if (file == 'index') var content = fs.readFileSync(__dirname + '/articles/index.md').toString();
else { else {
console.log('files', file);
var files = fs.readdirSync(__dirname + '/articles/' + file.toLowerCase()).join('\n'); var files = fs.readdirSync(__dirname + '/articles/' + file.toLowerCase()).join('\n');
var selected = files.match(new RegExp(difficulty + '.*'))[0]; var selected = files.match(new RegExp(difficulty + '.*'));
var content = fs.readFileSync(__dirname + '/articles/' + file + '/' + selected).toString(); if (!selected) res.render('404');
var content = fs.readFileSync(__dirname + '/articles/' + file + '/' + selected[0]).toString();
} }
return {'markdown': marked(content), 'articles': articles} return {'markdown': marked(content), 'articles': articles}