React
Skyddad: JavaScript 1 – Tenta 3 – omtenta 2 (praktisk uppgift)
Det finns inget utdrag eftersom detta är ett skyddat inlägg.
React
Skyddad: JavaScript 1 – Tenta 3 – omtenta (praktisk uppgift)
Det finns inget utdrag eftersom detta är ett skyddat inlägg.
React
JavaScript 1 – Projektarbete i React
Ni ska skapa en enklare Quiz-app där man som besökare kan testa sina kunskaper i olika Quiz:es, och där man även kan logga in och skapa egna Quiz:es. Metodik Ni ska… jobba agilt enligt SCRUM tillsammans bryta ner User Stories till en Backlog inför varje Sprint utse en SCRUM-master som Läs mer…
React
Skyddad: JavaScript 1 – Tenta 3 (praktisk uppgift)
Det finns inget utdrag eftersom detta är ett skyddat inlägg.
React
JavaScript 1, dag 36 – React – Routing
Vi gick igenom lösningsförslag på måndagens workshop där ni skulle lägga till stöd för att toggle:a en TODO och sedermera även radera den. Efter det så lade vi in en spinner för att ge lite feedback till användaren något händer i bakgrunden (att en asynkron förfrågan är igång), och visar/döljer Läs mer…
React
JavaScript 1, dag 35 – React Basics – Intermediary Components and Firestore
Vi gjorde om TODO-appen till att använda TodoList som blir en s.k. Intermediary Component som skickar data mellan App och TodoItem. Sen gick vi igenom lösningsförslag på fredagens workshop, följt av lite tenta-snack och intro till att använda Firebase Firestore i React. <code> Add Firebase to React src/modules/firebase.js Länkar Firebase Läs mer…
React
JavaScript 1, dag 34 – React Basics – Container/Class Components vs UI Components, Forms, Life Cycle Methods and axios in React
Idag har vi gått igenom skillnaden mellan s.k. Container Components (även kallade Class Components) och UI Components. För en refresher se nedan skärmdump från avsnitt #15 om Stateless Components från Shauns video-serie om React: Därefter tittade vi på hur man kan hantera Forms i React och skapade en AddTodo-komponent som Läs mer…
React
JavaScript 1, dag 33 – React Basics – Looping and Communicating with parent Component
Vi repeterade Props, States och setState från tisdagen och gick igenom workshopen. Därefter gjorde vi en TodoItem-komponent och kollade vi på hur vi kunde loopa ut en sådan komponent för varje todo-objekt i en array. Slutligen skapade vi en handleTodoToggle metod i App-komponenten och skickade med den som en prop Läs mer…
React
JavaScript 1, dag 32 – React Basics – State, Events and Changing State
Vi fortsatte med introduktionen av React och repeterade fredagen lite kort för att sedan gå över till State, Events och hur man kan ändra State med hjälp av setState()-metoden. Workshop Starta med att en helt ny, tom React-app som du skapar med npx create-react-app. Dagens övning består av allas favorit-uppgift Läs mer…
Vanilla JavaScript
JavaScript 1, dag 25 – ES6 features
Vi gick igenom lite ES6 features som destructuring, rest parameters och spread syntax. Därefter kikade vi på Babel och WebPack. Se screencasts från dagens lektion samt video 107, 148-150 samt 151-155 från Udemy-kursen. 107. Destructuring (3 min) 148. Spread & Rest (8 min) 149. Sets (9 min) 150. Symbols (4 Läs mer…
Vanilla JavaScript
JavaScript 1, dag 23 – Recept-databas
Vi fortsatte prata om databaser och gjorde en recept-databas och en app som hämtade ut recept därifrån, men vi gjorde det utan att skapa klasser som med TODO-appen, för att hålla det enklare. Därefter lade vi till funktionalitet för att skapa recept direkt från webb-appen, och avslutade med att även Läs mer…
Vanilla JavaScript
JavaScript 1, dag 22 – Prototypes och Databaser
Vi pratade om prototypes och hur den ES6-syntaxen vi precis lärt oss egentligen bara är syntaktiskt socker (syntactic sugar) och att prototypes är det som händer ”behind the scenes” när vi skriver class Animal {} och class Dog extends Animal {} Se screencasts från dagens lektion samt video 123-124 från Läs mer…
Vanilla JavaScript
JavaScript 1, dag 21 – Arv inom objekt-orienterad programmering
Vi pratade om vad arv är inom objekt-orienterad programmering (OOP) och hur man kan använda det för att ärva egenskaper och metoder från ”förälder-klasser” (kallas även ibland super-klasser). Efter en kortare genomgång så gjorde vi ett antal exempel på arv, se lesson-21 branchen på GitHub-repositoryt. Se screencasts från dagens lektion Läs mer…
Vanilla JavaScript
JavaScript 1, dag 20 – Objekt-orienterad programmering
Vi pratade om vad objekt-orienterad programmering (OOP) är och tittade på hur man skapar en klass i JavaScript. Se screencasts från dagens lektion samt video 115-119 från Udemy-kursen. 115. What is OOP? (8 min) 116. Object Literal Recap (5 min) 117. Classes (4 min) 118. Class Constructors (5 min) 119. Läs mer…
Vanilla JavaScript
JavaScript 1 – praktisk uppgift 1 (namnsdag)
Ni ska skapa en komplett mini-web-app där man kan söka på ett namn och få reda på när det namnet har namnsdag, och samtidigt kunna se vilka andra som också har namnsdag samma dag. Man ska även kunna ange en specifik dag och få reda på alla som har namnsdag Läs mer…
Vanilla JavaScript
JavaScript 1, dag 19 – Weather-app
För att refresh:a minnet efter jul och nyår så gjorde vi en sista async-app där vi hämtade nuvarande väder för en ort ifrån OpenWeatherMap’s API. Skaffa gratis konto och skapa en egen API-nyckel eller kolla i 03-JavaScript 1-kanalen i Teams för min API-nyckel. Workshop Fortsätt på vår väder-app och börja Läs mer…
Vanilla JavaScript
JavaScript – tips på övningar
Flera har frågat efter lite svårare JavaScript-övningar att pyssla med, så här kommer några länkar som jag hittat. Övningar Exercises on the JavaScript track https://exercism.io/tracks/javascript/exercises JavaScript coding challenges and excercises with solutions for beginner and advanced Verkar som att man gör övningarna i form av ett spel där man når Läs mer…
Vanilla JavaScript
JavaScript 1, dag 17 – Async/await
Idag har vi kikat på hur man kan använda de nya async/await nyckelorden som kom i ES8, och de låter oss skriva vår asynkrona promise-baserade kod som om den vore synkron kod. I grund och botten är det fortfarande promises, så detta är bara en annan syntax för att skriva Läs mer…
Vanilla JavaScript
JavaScript 1 – praktisk uppgift 1 (struken)
OBS! Denna uppgift är struken! Ni ska skapa en komplett mini-web-app där man kan söka på en artist/album/låt och få reda på information om varje sökträff. Man ska kunna Välja om man vill söka enbart på artister, album, låtar eller alla kombinationer Se cover-photo för varje träff (om det är Läs mer…
Vanilla JavaScript
JavaScript 1, dag 16 – Promises and Fetch
Idag har vi kikat på Promises och hur vi kan använda dem för att slippa ”Callback Hell” och göra vår kod renare och lättare att följa. Vi gjorde en enkel workshop på förmiddagen i promises där ni skrev om fredagens workshop-uppgift till att använda Promises istället för callbacks. Därefter gick Läs mer…