Útfæra skal Express vefþjón sem birtir yfirlit yfir greinar úr möppu á disk og möguleika á að lesa hverja grein.
Gefin er mappa með fjórum greinum ásamt myndum sem þær vísa í. Hver grein hefur skilgreind lýsigögn fremst í skjali skilgreint með frontmatter, t.d.
---
title: Lorem ipsum
slug: lorem-ipsum
date: Wed Jan 17 2018 12:30:00 GMT+0000 (GMT)
image: ./img/lorem-ipsum.jpg
---
Finna þarf NPM einingu sem þáttar þessi gögn ásamt rest af skjali og skilar sem gögnum. title er titill greinar, slug er slóðin sem á að vera á grein (að ofan ætti greinin slóðina /lorem-ipsum), date er dagsetning greinar, image er mynd fyrir grein sem þarf ekki að skilgreina.
Rest af grein er skilgreind í Markdown og þarf sömuleiðis að finna NPM pakka til að þátta það.
Forsíða á vef birtir lista af öllum greinum með mynd (ef skilgreind, annars #666 bakgrunnur), titli og dagsetningu á formi dd.mm.yyyy. Greinum skal raða í öfuga tímaröð, þ.a. nýjasta greinin er fyrst.
Titill síðu (<title>) og fyrirsögn skal vera „Greinasafnið“.
Þegar smellt er á grein er sú grein opnuð á viðeigandi slóð (út frá slug) og efni hennar birt. Ef grein vísar í mynd skal hún birtast. Hægt er að nota Express static middleware til þess, ekki ætti þó að vera hægt að opna .md skrár.
Titill síðu (<title>) og fyrirsögn skal vera titill greinar.
Allar greinar skulu lesnar asynchronously af disk með callbacks, promises eða async await. Ekki þarf að spá í hraða, það er í lagi að lesa af disk fyrir hverja beiðni.
Notast skal við EJS template til að útbúa HTML. Útbúa skal header.ejs og footer.ejs sem önnur template nota.
Setja skal upp villumeðhöndlun fyrir almennar villur og ef beðið er um slóð sem ekki er til (404). Skilaboð skulu birt notanda um hvað gerðist („Síða fannst ekki“ – „Villa kom upp“).
app.js skal setja upp Express vefþjón en virkni sem les greinar og útbýr routes fyrir þær skal útfærð í articles.js.
Öll dependency skulu skráð í package.json.
npm start skal keyra upp vefþjón á localhost porti 3000.
CSS skrá ásamt mynd í haus skal sækja gegnum static middleware í Express úr /public möppu.
CSS skal vera snyrtilegt, skalanlegt og nota flexbox. Ekki þarf að fylgja nákvæmlega gefnu útliti en það skal vera frekar líkt. Um útlit gildir:
- Meginmál notar Lora leturgerð, bæði regular, italic og bold
- Fyrirsagnir nota Roboto leturgerð, bold
- Bakgrunnslitur er
#eeeog letur#333. Fyrirsögn í haus er#eee - Bil eru annaðhvort
15pxeða30px - Grunn leturstærð er
16px, fyrirsagnir eru24px,32pxog48px - Efni síðu skal miðjað og ekki breiðara en
1200px
Verkefni þetta er sett fyrir á GitHub og almennt ætti að skila því úr einka (private) repo nemanda. Nemendur geta fengið gjaldfrjálsan aðgang að einka repos á meðan námi stendur, sjá https://education.github.com/.
Til að byrja er hægt að afrita þetta repo og bæta við á sínu eigin:
> git clone https://github.com/vefforritun/vef2-2018-v1.git
> cd vef2-2018-v1
> git remote remove origin # fjarlægja remote sem verkefni er í
> git remote add origin <slóð á repo> # bæta við í þínu repo
> git push- 20% – Útlit útfært með merkingarfræðilegu HTML og snyrtilegu CSS
- 10% – EJS template notuð til að útbúa útlit
- 10% – JavaScript kóði er villulaus þegar eslint er keyrt
- 20% – Útfærsla á lestri greina og lýsigagna úr markdown skjölum
- 10% – Greinalisti
- 20% – Grein með stílum og myndum
- 10% – Villumeðhöndlun
Verkefni sett fyrir í fyrirlestri fimmtudaginn 18. janúar 2018.
Skila skal undir „Verkefni og hlutaprófa“ á Uglu í seinasta lagi fyrir lok dags sunnudaginn 4. febrúar 2018.
Skilaboð skulu innihalda slóð á GitHub repo fyrir verkefni, og dæmatímakennurum skal hafa verið boðið í repo (sjá leiðbeiningar). Notendanöfn þeirra eru ernir og elvarhelga.
Sett verða fyrir sex minni verkefni þar sem fimm bestu gilda 6% hvert, samtals 30% af lokaeinkunn.
Sett verða fyrir tvö hópa verkefni þar sem hvort um sig gildir 15%, samtals 30% af lokaeinkunn.