Innledning

Dette emnet tar for seg «grunnsteinene» i frontend-utvikling og gir studenten en innføring i sentrale begreper, teorier, metoder og verktøy. Målet med emnet er å gi studentene et språk og en forståelse for fagfeltet, samt gi studenten kunnskaper og ferdigheter de kan bygge videre på i andre semester.  Emnet tar for seg fire sentrale tema:

Tema 1 - Frontend-utvikling, prosesser og universell utvikling

I dette temaet introduseres HTML og CSS, som er grunnsteinene i produksjon av nettsider. Det er videre en introduksjon av prototyper og prosesser som tas i bruk i planleggingen av en frontend-produksjon. Dette fasiliteters av forelesninger etterfulgt av workshops og oppgaver som bruker yrkesrelevante problemstillinger. Studenten får en innføring i det gjeldende regelverket i forhold til universell utforming og designprinsippene som sørger for tilgjengelighet og brukervennlighet for alle, og studenten tar i bruk verktøy for å teste i hvilken grad produktet samsvarer med de gjeldende reglene og designprinsippene. 

Tema 2 - Grunnleggende JavaScript

I dette temaet introduseres fagterminologi og verktøy som benyttes innenfor utvikling i JavaScript - et programmeringsspråk som benyttes sammen med HTML/CSS for å skape interaktive nettsider. Gjennom forelesninger, workshops og oppgaver får studentene en innføring i praktisk bruk av JavaScript i produksjon av nettsider. Studentene får en innføring i Github og Github Pages, og hvordan de kan bruke dette til å lagre koden sin i skyen og publisere nettsidene de koder.  

Tema 3 - Brukergrensesnitt, responsivt design og animasjon

I dette tema belyses modeller, verktøy og metoder for utviklingen av brukergrensesnitt, dvs. design av hvordan brukeren navigerer og bruker nettsider og applikasjoner.Videre inneholder temaet CSS-animasjoner samt animasjonsprinsipper og hvordan disse brukes for å fremheve viktige elementer i brukergrensesnittet. Temaet gjennomføres med workshops og brukertester.  

Tema 4 - Innføring og bruk av bransjens foretrukne JavaScript-rammeverk

Dette temaet tar for seg et av bransjens foretrukne JavaScript-rammeverk til utvikling av web-applikasjoner. Et JavcaScript-rammeverk brukes til å utvikle avanserte og effektive web-applikasjoner. Eksempler på slike rammeverk er React som er utviklet av Facebook, Angular som er utviklet av Google og Vue JS. I temaet benyttes React.

Læringsutbytte

Kunnskaper:

Kandidaten …

 

  • har kunnskap om fagterminologi, utviklingsspråk og arbeidsprosesser som anvendes i utviklingen av nettsider ved bruk av HTML og CSS
  • har grunnleggende kunnskap om programmeringsspråket JavaScript og fagterminologi i utviklingen av nettsider og web-applikasjoner
  • har kunnskap om grunnleggende programmeringsarkitektur
  • har innsikt i relevant regelverk for universell utforming og standarder og krav til kvalitet i utviklingen av nettsider og applikasjoner
  • har kunnskap om responsivt og adaptivt design tilpasset forskjellige enheter
  • har kunnskap om grunnleggende animasjonsprinsipper og utvikling ved bruk av HTML, CSS og JavaScript.
  • kan oppdatere sin yrkesfaglige kunnskap ved å gå gjennom faglig relevant dokumentasjon av ulike verktøyer og systemer
  • forstår betydningen av universelt utformede nettsider og mobile applikasjoner for å sikre tilgjengelighet og gode brukeropplevelser for alle brukergrupper
  • har kunnskap om fagterminologi i JavaScript-rammeverket React og hvordan dette anvendes i utviklingen av frontend-prosjekter       

Ferdigheter

Kandidaten …

  • kan anvende kunnskap om HTML og CSS til å utvikle nettsider, samt begrunne sine valg
  • kan anvende kunnskap om JavaScript til å utvikle nettsider og web-applikasjoner, samt begrunne sine valg
  • kan anvende kunnskap om animasjonsprinsipper i utviklingen dynamiske nettsider ved bruk av CSS og JavaScript
  • kan anvende kunnskap om responsivt og adaptivt design og mobiltilpassing til utviklingen av nettsider som tilpasses ulike skjermløsninger
  • kan anvende kunnskap om kolleksjoner av data og eksterne data i utvikling av nettsider og web-applikasjoner
  • kan anvende aktuelle verktøy for testing og kvalitetssikring av et frontend-utviklings prosjekt i forhold til gjeldende krav og regelverk 
  • kan anvende kunnskap om JavaScript rammeverket React og hvordan dette kan benyttes for å utvikle web-applikasjoner    

Generell kompetanse:

Kandidaten …

  • har forståelse for bransjeetiske prinsipper innenfor frontend-utvikling 
  • har utviklet en etisk grunnholdning i utøvelsen av frontend-utvikling gjennom forståelse av verdien i universell utforming for alle brukergrupper  

Emnet inngår i

Frontend-utvikling

Læringsaktiviteter

Forelesning, prosjektarbeid, individuelt arbeid, veiledning og presentasjon

Emnet vil kreve en stor grad av gruppearbeid og egeninnsats også mellom undervisningsøktene

Anbefalt tidsbruk

Undervisningstimer: 225

Arbeidstimer: 580

Arbeidsverktøy

.

Arbeidslivstilknytning

Gjesteforelesere 

Eksamen

Eksamensdel: Individuell mappevurdering

Varighet: Semesteret 

Gradering: Nasjonal karakterskala B/IB (Bestått/Ikke bestått) 

Vekting: Bestått av hel vurdering 

Hjelpemidler: Alle hjelpemidler tillatt 

Vurderingskriterier

.

Pensumlitteratur

Robbins, Jennifer (2018). Learning Web Design: A Beginner's Guide to Html, Css, Javascript, and Web Graphics. O'reily Media. ISBN: 9781491960202

 

Grant, Keith J. (2018). CSS in Depth. Manning Publications. ISBN: 9781617293450

 

Frisbie, Matt. (2019). Professional JavaScript for Web Developers. Wrox. 4th Edition. 

ISBN-10: 1119366445, ISBN-13: 978-1119366447 (merk at denne utgis 18. september, men vi trenger den ikke i starten av studiet)

Læremidler

.

Samlet sidetall/pensum

.

Anbefalt litteratur

https://www.scrimba.com

https://reactjs.org/tutorial/tutorial.html

https://www.codecademy.com/

https://www.w3schools.com/

https://developer.mozilla.org/en-US/docs/Web/HTML

https://developer.mozilla.org/en-US/docs/Web/CSS

https://developer.mozilla.org/en-US/docs/Web/JavaScript