Lykilhugtök
Samansafn af öllum lykilhugtökum í áfanganum.
Vika 1
Vikublað 1
- GUI og CLI
- Textaritlar
- Stafasett
- Unicode
- UTF-8
- Internetið
- Vefurinn
- Vefþjónn
- HTTP
- URL
- Vefsíða
- Vafri
- Framendi
- HyperText
- Markup mál
- Markdown
- W3C
- Vefstaðlar
- HTML
- HyperText Markup Language
- Lýsandi umbrotsmál (e. descriptive markup language) með sniði sem leyfir okkur að lýsa textanum okkar og nota HyperText hugtakið.
- Vefforritun: HTML
- Wikipedia: HTML
- Netlify
Vika 2
Vikublað 2
- HTML element
- HTML tag
- HTML attribute
- Tré (gagnaskipan)
- Merkingarfræði
- HTML staðallinn (spec)
- Vísun í efni með afstæðum (relative) slóðum
- Vísun í efni með nákvæmum (absolute) slóðum
- HTML töflur
- Listar
- Form
- Linting
- HTML validator
- Aðgengi
- WCAG staðallinn
- aXe tólið
- Skjálesarar
- Leitarvélabestun, SEO
Vika 3
Vikublað 3
- CSS
- Tenging CSS og HTML
- Selectors
- Yfirlýsingar
- Eigindi
- Gildi
- Hlufallslegar einingar
- Box model
- Sértækni
- Flóðið
- CSS validation
- Eðlilegt flæði
position eigindið
- Leturgerðir
- Texta og leturbreytingar
background eigindið
Vika 4
Vikublað 4
- Progressive enhancement
- Fallback gildi
- Feature queries
- CSS custom properties
object-fit
- Flexbox
- flex container
- flex items
- Ásar: aðal (main axis) og kross (cross axis)
- Röðun á ás með flexbox
- Logical properties
Vika 5
Vikublað 5
- Skalanleg vefhönnun
- Grid/grind í hönnun
- Mobile first
- Sveigjanleg grind
- Sveigjanlegar myndir og miðlar
- Media query
- Device width
- Kvikun
transition
- Hröðun, línuleg og
ease
animation
transform
- Röðun og jöfnun
- Andstæður
- Litir í hönnun
- Veftré
- Wireframe
- CSS grid
- CSS grid er notað til að skilgreina skipulag eða útlit (e. layout) á síðu með því að skilgreina raðir (e. rows) og dálka (e. columns) sem efni er staðsett í.
- Vefforritun: Grid
- MDN: CSS Grid Layout
- Dálkar og raðir í CSS grid
fr
minmax()
repeat()
Vika 6
Vikublað 6
- CSS viðmiðunarreglur
- BEM
- Block Element Modifier
- Tiltölulega einföld aðferð þar sem hún einblínir á það hvernig við skrifum selectora. Við notum aðeins class selector, enga type eða id selectors.
- Vefforritun: CSS í stærri verkefnum, BEM
- Sass
- Sass Breytur
- Sass Hreiðrun
- Node.js
- NPM
- package.json
browsersync pakki
sass pakki
stylelint pakki
Vika 7
Vikublað 7
- Útgáfustjórnun
- Version control
- Kerfi sem geymur útgáfur af skrám sem við vinnum með, leyfir okkur t.d. að treysta því að vinna okkar sé örygg, fara fram og til baka í tíma og gera tilraunir án þess að tapa gögnum.
- Wikipedia: Version Contro
- Git
- Dreift útgáfustjórnunarkerfi með þau markmið að vera hratt, einfalt og leyfa ólínulega þróun (auðvelt að útbúa „branch“).
- Wikipedia: Git
- repo
- Repository
- Staður þar sem við geymum gögn og lýsigögn fyrir útgáfustjórnunarkerfi, t.d. Git.
- Wikipedia: Repository
- stöður í Git
- Git sér skrár í þrem stöðum: committed, modified og staged.
commit
- Git aðgerð sem færir allar skrár sem eru í staged stöðu í committed stöðu.
- remotes
- Remote repositories
- Repo sem eru staðsett á öðrum stað en okkar eigin vél, t.d. á GitHub.
push
- Git aðgerð sem færir committed skrár frá okkar vél yfir á remote repo.
- branches
- Þegar við víkjum frá meginlínu (yfirleitt kallað
main) í vinnu okkar, leyfir okkur að gera tilraunir, breyta einhverju o.fl. án þes að hafa áhrif á annað.
- Wikipedia: Branching (version control)
merge
- GitHub
- GitHub workflow
- Vel skilgreint flæði fyrir vinnu með Git og GitHub.
- GitHub flow
- JavaScript
- JavaScript týpur og aðgerðir
- JavaScript styður ákveðnar týpur og reikniaðgerðir.
string
- Strengi í JavaScript er hægt að skilgreina með
', " eða `, þeir eru geymdir sem óbreytanleg röð af unicode stöfum.
number
- Allar tölur í JavaScript eru geymdar sem
number, hvort þær sem eru heiltölur eða tölur með broti. Vegna þess hvernig þær eru geymdar geta þær verið ónákvæmar.
- MDN
number
boolean
undefined
- Gildi á breytum og eigindum hluta sem ekki hafa verið skilgreind.
- MDN
undefined
null
- Gildi sem stendur fyrir að vísvitandi fjarveru gildis.
- MDN
null
- Veikar týpur
- Í JavaScript hafa breytur ekki týpur heldur hafa gildi týpur, þegar við notum gildi í óviðeigandi aðgerðir getum við fengið óvæntar niðurstöður.
- Wikipedia: Strong and weak typing
- type coercion
- Sjálfkrafa breyting á týpu gilda í JavaScript út frá því hvernig þau eru notuð.
- MDN: Type coercion
- Truthy og falsy
- Þegar við nýtum type coercion til að fá gildi til að haga sér eins og
boolean gildi, falsy gildi eru false, 0, '', null, undefined, NaN og truthy gildi eru öll önnur gildi.
- MDN: Falsy
- MDN: Truthy
Vika 8
Vikublað 8
- Segðir
- Skipanir
- Semíkomman í JavaScript
- Í JavaScript er semíkomma valkvæm statement terminator, ef sleppt er automatic semicolon insertion reikniritið notað til að setja inn semíkommu
- MDN: Automatic semicolon insertion
- Breytur
- Variables
- Breytur eru skilgreindar með
let, const eða var og innihalda vísanir í gildi, breytur hafa ekki týpu, gildið hefur týpu
- MDN: let
- MDN: const
- Flæðistýringar
- Control flow
- Með ákveðnum skipunum í formi
if og switch getum við stýrt flæði forrits
- MDN: Control flow
- Lykkjur
- Loops
- Með ákveðnum skipunum í formi
for, while og do...while getum við endurtekið skipanir í flæði forrits
- MDN: Loops and iteration
- Föll
- Functions
- Blokk af kóði sem getur haft nafn (ef ekki nefnd nafnlaus föll eða anonymous functions) og skilað gildi, notum til að skipuleggja kóða og draga úr endurtekningu
- MDN: Functions
- Fylki
- Arrays
- Raðaður listi af gildum, hægt að nálgast gildi eftir index (byrjar ´0´) með bracket notation
[]
- MDN: Arrays
- Hlutir
- Objects
- Gildi sem geymir núll til fleiri gildi sem nafn-gildis pör, hægt að nálgast gildi með dot notation
. eða bracket notation []
- MDN: Objects
Vika 9
Vikublað 9
- DOM
- Document Object Model
- Leyfir forritum og skriptum að gera dýnamískar breytingar á efni, skipulagi og útliti skjala (oftast HTML eða XML) gegnum API
- MDN: Document Object Model
- DOM tré og nóður, vísanir þeirra á milli
- DOM er tré og hefur nóður sem tengjast, við getum fundið, búið til, breytt og eytt nóðum.
querySelector og querySelectorAll
- Breytingar á DOM tré
- Við getum notað DOM aðgerðir til að breyta DOM tré, t.d.
removeChild, appendChild, insertBefore, replaceChild.
- MDN: Node.removeChild
- Búa til element og nóður í DOM tré
- Við getum búið til nýjar nóður með
document.createElement og document.createTextNode.
- Attributes og DOM
- Við getum bætt við, breytt og fjarlægt attributes á nóðum með
setAttribute, getAttribute og removeAttribute.
- MDN: Element.setAttribute
dataset
classList
- Við getum átt við
class á nóðum með classList eiginleikanum, t.d. bætt við, fjarlægt og athugað hvort nóðan hafi ákveðið class.
- MDN: Element.classList
- Atburðir
- Upplýsingar um atburð (event)
- Fáum
Event hlut sem inniheldur upplýsingar um atburðinn, t.d. um hvaða lykil var slegið á lyklaborð, eða hvaða takka á mús.
- MDN: Event
- Sjálfgefin hegðun og
preventDefault()
- Element með gagnvirk virkni (interactive) á vefnum gera eitthvað sjálfgefið, t.d. form sendir gögn, með
preventDefault getum við stöðvað þessa hegðun.
- MDN: Event.preventDefault
- Einingar
- Modules
- Leið til að skipta forritum upp í frekari einingar en eingöngu föll og breytur, hægt að skilgreina hvaða hluti af kóðanum er aðgengilegur utan einingarinnar.
- Wikipedia: Modular programming
- API
- JavaScript/ECMAScript modules
Vika 10
Vikublað 10
- Ósamstillt forritun
- Asynchronous programming
- Forrit sem sækja gögn á harðan disk, yfir netið, nýta atburði o.fl. eru ósamstillt: við þurfum að bíða eftir að aðgerðir klárast.
- Wikipedia: Asynchronous programming
- Promises og stöður þeirra,
then og catch
async og await
- HTTP
GET
- HTTP aðferð sem er mest notuð, sækir efni (resource) frá vefþjón.
- Wikipedia: GET
POST
- HTTP stöðukóðar
URL og URLSearchParams
- JSON
- JavaScript Object Notation
- Létt gagna format, byggt á JavaScript hlutum, sem er algengt í vefþjónustuköllum.
- Wikipedia: JSON
fetch
- Web API sem leyfir okkur að sækja gögn yfir netið, skilar
Promise.
- MDN: fetch
- Stöður á ósamstilltum köllum / vefþjónustuköllum:
loading, hvað sýnum við meðan við erum að sækja gögn? Það getur tekið allt frá örfáfum ms uppí fleiri sekerror, hvað sýnum við ef þjónustan skilar villu?empty, þjónustan svaraði en við fáum „tóma“ svariðdata, allt gekk upp
- eslint
Vika 11
Vikublað 11
- Villumeðhöndlun
- Exception handling
- Þegar villur koma upp í JavaScript forritum (kóði getur kastað—throw—villu) getum við brugðist við þeim
- MDN: Exception handling
try og catch
- Við getum sett kóða sem gæti kastað villu í
try blokk og bregðist við henni í catch blokk.
- MDN: try…catch
- Reglulegar segðir
- Fallaforritun
- Transpiling
- Pökkun á kóða
- Code bundling
- Þegar við skrifum kóða í mörgum skrám gæti verið að kostur að „pakka“ þeim saman í eina (eða fleiri, þó færri en upprunalega) skrá.
Vika 12
Vikublað 12
- Hlutir
- Objects
- Eitt af aðalhugtökum hlutbundinnar forritunar, hlutur er safn af gögnum og aðferðum sem vinna með þau.
- MDN: Objects
this
- Breyta sem vísar í samhengi, oft innan hlutar, getur verið ólíkt eftir því hvernig er kallað.
- MDN: this
- Prótótýpur
- Prótótýpukeðjan
- Klasar (
class) í JavaScript
- Syntactic sugar fyrir hlutbundna forritun, einfaldar útlit klasa og erfða, verður líkara öðrum forritunarmálum.
- MDN: Classes
- Prófanir
- Þegar við skrifum kóða erum við alltaf að athuga hvernig hann virkar, próf og prófanir er hægt að framkvæma sjálfvirkt með ýmsum leiðum.
- Wikipedia: Software testing
- Jest
- Tól til að prófa JavaScript kóða.
- jest
- Web APIs
- Stöðluð viðmót sem vafra býður upp á, t.d.
DOM, fetch, localStorage o.fl.
- MDN: Web APIs