Ok. Så nu har vi en webserver der kører node og som åbner vores egen server.js fil og hoster vores skitse i p5 lokalt på port 3000. Nu skal vi tilføje det kode som gør det muligt for klienter på serveren, at sende beskeder frem og tilbage til hinanden i […]
p5.js
Så er vi næsten i mål. Vi har skrevet koden til en lille webserver vi kan starte og køre, og vi har oprettet forbindelse med en klient – som har fået sit helt eget id. Vi kan åbne to forskellige browservinduer og forbinde til serveren – og i terminalvinduet kan […]
Du har nu lært en række redskaber, som gør det muligt at skabe interessante interaktive skitser med javascript biblioteket p5.js. Imidlertid er din viden – hvis dette vel at mærke er første gang du programmerer – stadig noget funktionel og tilrettelagt. Det er på tide at springe ud i vandet […]
Hvis du aldrig har prøvet at programmere før, er det her et godt sted at begynde. I dette forløb lærer du at programmere på en nem og visuel måde. Men endnu vigtigere, så lærer du også at forstå hvad det digitale stof din computer er lavet af er, og hvad […]
Denne lille skitse er et godt sted at starte, hvis du er interesseret i programmering, men aldrig har prøvet at kode før. På denne side vil jeg gennemgå koden skridt for skridt, og hvordan du får det til at virke i din browser. Først og fremmest skal du downloade koden […]
Hvis musen er over midten af skitsen, så skift farve Hvordan træffer computerprogrammer beslutninger mens de kører? Indtil nu har du set hvordan metoden draw() hele tiden looper gennem de samme instruktioner. Med logiske betingelser kan man ændre noget hver gang programmet kører en ny omgang, og det er nu […]
Det er meget ofte sådan i programmering – grafisk programmering, såvel som visuel, interaktionsdesign, datamodellering og meget mere – at man har en eller anden form for skala. Lad os forestille os en glideknap-fader på en stikkontakt. Når man flytter slideren op og ned på kontakten, skal lyset gå fra 0 til […]
Hvad er et objekt? Det næste vigtige fænomen du skal kende til, er objekter. Et objekt er en skabelon for hvordan noget kunne se ud. Lad os forestille os, at vi ville programmere en motorvej med biler der kommer kørende. Vi kunne selvfølgelig sætte os til at tegne hver enkelt […]
I denne skitse skal du lære lidt om funktioner. Et redskab til at ordne din kode – igen – så du kan samle relaterede opgaver i klaser. Koden nedenfor er ikke sat ind i funktioner – endnu. Det er din opgave. Følg vejledningen i kommentarerne og se hvor meget det […]
Nu er du næsten i gang med at lave objektorienteret programmering: fundamentet for det meste af det software vi bruger. Og fundamentet for at blive så god til at kode, at du kan lave næsten hvad som helst. Næste skridt er at flytte funktioner ind i objekterne – så de både […]
Et array kan oversættes til en række eller opstilling. Det er nemt at forestille sig, at når man arbejder med computere, skal man ofte bruge ikke bare en enkelt, men en hel masse af en bestemt “slags”. Bare forestil dig rækker af bogstaver, pixels eller tal – det er som oftest […]
Arrays bliver rigtig interessante når vi fylder dem med objekter. På den måde kan man opbygge simulationer af virkeligheden – ved at indsætte biler, fodgængere eller andre objekter med egenskaber som minder om den virkelige verden. Måske kan du nu se, at det er den måde rigtig meget software fungerer […]
Jo mere komplekse objekter vi har lyst til at lave, jo mere forvirrende og besværligt bliver det, at have dem liggende i setup funktionen. Vi har brug for en metode, så vi kan ordne vores objekter, så vi kan udvide dem med variable og funktioner, uden at vores programkode bliver overdrevet […]
Klik og træk på skærmen for at starte din slange af objekter. Objekterne er egentlig ikke sammenhængende – de ved ikke noget om den næste i rækken, hvilket du kan se ved at vente lidt. Efterhånden opløser slangen sig igen. Men i første omgang tegnes objekterne der hvor musen er […]
Klik på cirklerne for at skifte deres farve I denne skitse lærer du at finde ud af om brugeren har klikket på et objekt. Det er sådan set enkelt nok – man sammenligner faktisk bare musemarkørens position med objektets x- og y-koordinater. Men det åbner for en verden af muligheder […]
De to cirkler undersøger hele tiden om de overlapper hinanden – hvis de gør, skifter de farve Vi har ofte brug for at vide om objekter rører hinanden. Det kunne være de ønskede det, eller det kunne være de ville undgå det. Det er sådan set meget simpelt – vi […]