Javascript, Programmering, React
useCallback
useCallback er en hook i React som returnerer en memorisert callback funksjon. Det sparer minne i applikasjonen fordi funksjonens verdier ikke trenger å rekalkuleres. useCallback kjøres kun når en av de avhengige variablene endres, som vist i tabellen til slutt i useCallback hooken, i dette tilfellet count og count2. Kilde: https://stackblitz.com/edit/vitejs-vite-bvtgfy?file=src/App.tsx I koden i App.tsx […]
Les mer
Javascript, React
Lag et minne-spill med Javascript og React
av Ole Petter, 11. oktober 2021
Bruk javascript til å lage et «to-like» spill, hvor hukommelsen kan spille deg et puss. https://enlear.academy/creating-a-simple-memory-game-with-react-8b7e70bebf9e
Les mer
Javascript, Programmering, React
Lag en lottotall generator
av Ole Petter, 7. oktober 2021
Lær å bruke Javascript til å opprette tabeller, Math funksjonen, og React sitt state management system med Hooks. https://enlear.academy/simple-random-number-generator-with-react-260e92655b2f
Les mer
Firebase, Ionic, Javascript, Programmering, React
Last opp bilder med mobilkamera i firebase
Kildekode: https://github.com/olepetterkh91/ionic-camera-demo Filer For å bruke firebase må man konfigurere det til et prosjekt. Det er lurt å sette opp prosjektets ulike nøkler med en .env fil, som lagres i hovedmappen til prosjektet. For å laste opp bilder i firebase trenger man autentisering, for å registrere nye brukere brukes filen RegisterFirebase.tsx, og for innlogging, LoginFirebase.tsx. […]
Les mer
Ionic, Javascript, Programmering, React
Sett opp et prosjekt i Ionic
Ionic er et framework som inneholder UI Komponenter som tilpasses ulike visninger, som WebView, MobileView og mer. Fordelen med Ionic Framework er at det er enkelt å sette opp mobilapplikasjoner som kan brukes på iOS og Android enheter. Ionic har god dokumentasjon på deres hjemmeside: https://ionicframework.com/docs Start en enkel applikasjon For å starte et prosjekt […]
Les mer
Javascript, Programmering, React
Tastetrykk i React
Dette innlegget er en fortsettelse av det forrige innlegget, https://progitek.no/2021/07/28/lag-en-lightbox-med-react/ Tastetrykk hook: useKeypress Denne koden er hentet fra: https://usehooks.com/useKeyPress/ Bruk useKeypress i Modal.js useKeypress håndterer tastetrykkene, det eneste man trenger å sende inn, er hvilken knapp man vil lytte til. I dette tilfellet er venstre pil, høyre pil og Escape knappen brukt for å navigere […]
Les mer
Javascript, Programmering, React
Lag en lightbox med React
Kildekode Kildekoden kan finnes her: https://github.com/olepetterkh91/react-bootstrap-lightbox Les historien på engelsk her: https://medium.com/@olepetterkh/create-a-simple-lightbox-with-react-abe04e3e6e7b Create React App I dette eksempelet brukes Bootstrap til CSS. Bootstrap er et css-rammeverk som gjør det kjapt og enkelt å lage en fin nettside. Det finnes også en React plugin for Bootstrap som legger til funksjoner slik som modal og responsiv navigeringsmeny. […]
Les mer
Ionic, Javascript, Programmering, React
Gode kurs for å lære frontend-utvikling
av Ole Petter, 26. januar 2021
JavaScript Maximillian Schwarzmüller Javascript: The Complete Guide 2020 https://www.udemy.com/course/javascript-the-complete-guide-2020-beginner-advanced/learn/ Jonas Schmedtmann The Complete Javascript Course (Oppdatert i 2020-21) https://www.udemy.com/course/the-complete-javascript-course/learn/ Shaun Pelling (The Net Ninja) Modern Javascript – From novice to ninja https://www.udemy.com/course/modern-javascript-from-novice-to-ninja/learn/ Brad Traversy Modern Javascript from the beginning https://www.udemy.com/course/modern-javascript-from-the-beginning/learn/ React Brad Schiff React for the rest of us (2020) https://www.udemy.com/course/react-for-the-rest-of-us/learn/ Ionic Mirko Nasato Ionic […]
Les mer
Programmering, React
Lag en React App med WordPress REST Api
av Ole Petter, 17. januar 2021
Start en ny React App I et tidligere innlegg har jeg vist hvordan man kan opprette en react-app enkelt med node.js og create-react-app. Lage routes For å håndtere ulike innleggssider, brukes ‘react-router-dom’. Den inneholder komponenter som BrowserRouter, Switch og Route, som gjør at man kan navigere rundt i en Single Page Application. App.js Lage Posts.js […]
Les mer