o -+- / \
Å jobbe som programmerer er en allsidig jobb hvor man lager små og store program for å automatisere, forenkle eller utføre arbeid man før måtte gjort for hånd.
Typiske eksempler på programmering er systemer som lager nettsider. Før man hadde nettlesere så måtte man forholde seg til skrevne bøker, man hadde gjerne et leksikon hjemme eller på skolen med informasjonen man trengte. Disse tok opp mye plass og det er vanskelig å oppdatere. Websider løste mye av dette. Etter hvert innså man at å lage alle websider for hånd også er tungvint, så man lagde verktøy for å gjøre det enklere. Man begynte å programmere små programmer som genererte websider.
Formålet med disse oppgavene er å gi en innsikt i hele stabelen (stacken) med teknologier som trengs for å kunne produsere dynamiske websider.
Vi har valgt å fokusere på litt mer bredde enn bare web-teknologi så derfor er programmeringsoppgavene mer en introduksjon til programmering enn et kurs i å lage et publiseringssystem eller et grensesnitt for å hente ut innhold til websider.
Mye av jobben som programmerer er å lese seg opp på hvordan noe fungerer. Det kan være et nytt programmeringsspråk, en ny versjon av språket med endringer. Det kan være et nytt rammeverk med støttefunksjoner, det kan være kompliserte applikasjoner som er utviklet av andre og som må endres.
Her er noen av de stedene man kan finne relevant informasjon for å drive med programvareutvikling.
HTML er grunnstammen til websider. I de senere år har man valgt å flytte alt det grafiske ut av html slik at man kun sitgter igjen med informasjonen og hvordan innholdet er strukturert. Kort oppsummert så kan man med html lage overskrifter, men hvilke størrelse og utseende disse har bestemmes av CSS.
CSS står for cascading style sheets og er en måte å endre den grafiske utformingen av websider som er beskrevet med html. Det er i html man definerer f.eks en tabell, mens det er i CSS man sier noe om hvordan rutene i tabellen ser ut, hvor store bokstavene er, om teksten er fet, skråstilt, hvilke farge på teksten og hvilken bakgrunn osv.
Dette dokumentet kunne fint hatt et lite stilark (en css-fil) som beskriver bredden og litt andre småting slik at det ville sett penere ut på brede skjermer. I stedet er det opp til nettleseren hvordan det skal se ut.
Python er et flott programmeringsspråk for nybegynnere, og kan brukes til veldig mye. Alt fra dataspill til websider er det helt fint mulig å lage i Python. Det er også utrolig mye brukt innen forskning, matematikk og statistikk så av den grunn er man bortimot nødt til å være innom dette om man skal få seg en høyere utdanning. Prinsippene man lærer i Python kan i stor grad også brukes til andre programmeringsspråk om man vil lage f.eks avanserte 3D-motorer til spill.
Ulike språk er gode til ulike ting, og Pythons styrke er at det er ikke så komplisert, ganske moderne og laget for å være enkelt å lære seg å mestre. På den andre enden av skalaen har man assembly som i bunn og grunn bare er et sett med cpu-instruksjoner og som krever at man gjør mer eller mindre alt for hånd, eller kaller bibliotek med ferdiglagde funksjoner for å få ting gjort.
Vi har laget et sett med oppgaver som vi vil dere skal løse. Dette er i all hovedsak teknologier og problemer som vi møter i jobben her på bygget, men er på et noe lavere nivå. Oppgavene har ulike vanskelighetsgrad, så det kan være lurt å begynne med den første og jobbe seg videre.
Det betyr ikke nødvendigvis at den første er den enkleste, men at det er en viss ide om en progresjon i oppgavesettet.
Vi vil at dere skal designe to ulike websider. Den første skal være et dokument som har form ca som et standard norsk brev. Her skal dere i all hovedsak benytte html og ikke noe css. Det trenger ikke være helt likt. Dere kan godt bruke et fiktivt navn og fiktiv adresse etc.
HTML består av tekst og små kontroll-ord, bare kalt tagger (tags) som endrer hvordan innholdet presenteres. Hovedoverskrifter er inni en H1-tag slik: <h1>Stor hovedoverskrift</h1>. Det er viktig at tagger avsluttes ellers vil man f.eks ende opp med at hele dokumentet er en overskrift.
Følgende tagger kan være nyttige til et slikt dokument.
<ul> <li>Listepunkt 1</li> <li>Listepunkt 2</li> </ul>
Den andre oppgaven er å lage en CV for en fiktiv person med navnet Herlefjott Støvheim. Herlefjott er 55 år gammel og har jobbet som svinerøkter, tryllekunstner, gatefeiebilsjåførassistent, lærer på ungdomskolen og på 80-tallet var han omreisende skoselger.
Om du vil så kan du i stedet lage en CV for deg selv, men jevnt over så har de fleste som går på ungdom- og videregående skole ikke så mye å putte på CVen sin.
Her kan det være lurt med et par tagger i tillegg til dem man hadde i brevet.
CSS er cascading style sheets og inneholder informasjon om hvordan innholdet skal se ut. her lager man ulike stiler som man kan så sette at innhold som paragrafer, lenker, bilder, lister osv skal ha. CSS har utrolig mange funksjoner og det er her mye av utviklingen på nettlesere ligger i dag. Det kommer ikke så mange nye tagger, det er i all hovedsak ny funksjonalitet i CSS som blir lagt til.
En css-stil i en minstil.css-fil kan f.eks se sånn ut:
body {
background-color: lightblue;
}
h1 {
color: white;
text-align: center;
}
p {
font-family: verdana;
font-size: 20px;
}
Her vil da h1-overskriftene få den stilen som er beskrevet der. Om du ønsker
en litt annen stil på en enkelt-overskrift så kan du sette stilen kun for det
html-elementet:
<h1 class="spesialoverskrift"> Veldig lang overskrift som derfor er i en mindre skrifttype</h1>Da må cssen ha noe ala dette i stilarket:
.veldiglangoverskrift {
font-family: verdana;
font-size: 24px;
/*
Alt mellom 'skråstrek asterisk' og 'asterisk skråstrek' er en kommentar,
som nettleseren bare ignorerer. Asterisk er et flott ord for stjerne.
*/
}
Python er et enkelt programmeringsspråk som også kan brukes til å tegne ting på skjermen. Vi skal bruke noe som heter turtle-graphics. Det fungerer litt som en skilpadde som går rundt på skjermen og tegner streker etter seg der den går. Dere skal bruke noe som heter python line turtle graphics, som dere kan søke etter og finne vha google.
Det kan virke barnslig å tegne ved hjelp av en skilpadde, men måten skilpadda beveger seg på er lik måten en robot beveger seg på. Dermed kan alle de triksene dere lærer her brukes til å styre en robot. Det finnes roboter som kan programmeres med Python.
Man kaller funksjoner, ofte med parameter for å endre hvordan programmet jobber. Under er en liste med et pat nyttige funksjoner for turtle.
Få skilpadda til å tegne følgende geometriske tegninger: