Den här veckan (vecka 53) har ni hemstudier i vad testning är och hur man skriver tester för JavaScript-kod och sedermera hur man skriver tester för React-komponenter. Ni ska när ni är klara ha en aning om vad TDD (Test-Driven Development) är för något, vad det används till och varför Läs mer…
Efter förra veckans genomgång av Firebase Cloud Storage och repetition av Firebase Firestore så är målet den här veckan att knyta ihop Firebase Auth med de två, så att vi får en komplett app med inloggning, databas och lagring av uppladdade filer. Vi satte upp en ny React-app och installerade Läs mer…
Dagen mjukstartades med lite info om de fyra sista veckorna av kursen, och att vi de kommande två veckorna kommer att kolla på Cloud Storage via Firebase’s Cloud Storage. Vi satte upp en ny React-app och installerade firebase, react-bootstrap, bootstrap samt [email protected], sen skapade vi en ny Firebase-app i Firebase Läs mer…
Idag kollade vi på useMutation() som är en del av React Query och som på ett smidigt sätt låter oss skicka iväg data. Vi kikade även på QueryCache och invalidering av cache:ad data, och hur vi själva kan sätta vad för data som ska finnas i cache:n. Allt detta gjorde Läs mer…
Vi tittade på hur vi kunde lyfta ut konfigurationen av React Query till först en egen config-modul och därefter hur vi kan använda ReactQueryConfigProvider för att förse React Query med inställningar utan att behöva importera en config-modul varje gång vi ska använda useQuery. Därefter kollade vi på isError som är Läs mer…
Dagen inleddes med en snabb genomgång av React Router v6 följt av felsökning för jag missat att migrera <Link>-komponenterna när vi uppgraderade till v6-beta.0 i torsdags. Därefter skapade vi en ny React-app (03-query) med lite placeholders i statisk HTML, innan vi introducerade React Query och kollade på hur den kan Läs mer…
På det senaste ledningsgruppsmötet godkändes att kunskapskontrollerna pga. pandemin för kursen är som följer: Tenta 1 (digital) – fredag 18/9 09.00-12.00 Innefattar Hooks, React Router och React Router Hooks (v5.2 + v6-beta). Dvs kursvecka 1-2. Tenta 2 (digital) – fredag 11/12 09.00-12.00 Den tidigare schemalagda lektionen för fredag 11/12 har flyttas Läs mer…
Vi ägnade större delen av förmiddagen åt att gå igenom workshopen från i tisdags, där vi bland annat installerade paketet use-url-search-params som gjorde att vi enklare kunde interagera med query-parametrar i vår URL istället för att manuellt behöva parse:a och uppdatera location.search. Precis innan lunch kollade vi på React Router Läs mer…
Idag kollade vi på React Router v5.2 och de möjligheter den ger oss. Bland annat så kan vi med hjälp av fyra stycken Router-hooks använda funktions-komponenter och ändå hämta ut route-parametrar och interagera med både history och location-objekten. (Hooks fanns i React Router v5.1 som vi använde i JavaScript 1-kursen Läs mer…
Hela dagen ägnades åt att gå igenom Custom Hooks i mer detalj i och med workshop:en från i torsdags, och vi skrev både en useLocalStorage-hook och en useFetch-hook samt en tillhörande HackerNewsSearch-komponent som använde vår useFetch-hook. En bit in på eftermiddagen blev vi klara med genomgången av useFetch-hook:en och ni Läs mer…
Först gick vi igenom lösningsförslag på workshop:en från i tisdags där ni skulle skriva en funktions-komponent som hämtar ut vehicles från Star Wars API, och se om ni kunde få Previous/Next page att fungera vilket många hade lyckats med 🥳. Vi kikade även på steg 2 där man skulle kunna Läs mer…
Vi repeterade lite kort useState och useEffect på morgonen och därefter gick vi in på useMemo men jag fick inte den att fungera alls som jag tänkt mig, så om du ser detta i efterhand så kan du skippa video 2.2 och första hälften av 2.3. I video 2.4 så Läs mer…
Idag gick vi igenom useState på förmiddagen som är den första och enklaste i raden av React Hooks som vi ska kika på den här veckan. Eftermiddagen ägnades åt den spännande useEffect-hook:en som gör att vi kan (bland mycket annat) replikera componentDidMount, componentDidUpdate och componentWillUnmount lifecycle events från klass-komponenter. GitHub-repository Läs mer…