Du har sikkert hørt om den populære JavaScript-ramme fra Facebook - React. Det bruges af mange populære websteder, herunder Facebook selv og Instagram. I denne artikel finder du 5 praktiske eksempler, der er bygget med React, og som vil give dig et forspring med rammerne. Hvad er specielt ved React?
React har vundet stor popularitet for nylig og har tiltrukket et stort og aktivt fællesskab. Dette resulterer i et stort væld af genanvendelige komponenter til det, der vil spare dig tid, når du koder. Biblioteket selv opfordrer til at skrive løst koblet kode, der er modulopbygget og komponerbar. I
Hvert kapitel i min nye bog Reager hurtigt (Manning, 2016) har et projekt, som er suppleret med en video-screencast. Se videoerne her eller på YouTube. Koden er på GitHub. Reager hurtigt Du kan også downloade hele det første kapitel GRATIS hos Manning. Bogen er planlagt til udgivelse i første kva
Dette er et uddrag fra Reager hurtigt (Manning, 2016). Du kan downloade hele det første kapitel gratis på Manning . Bogen er planlagt til udgivelse i første kvartal af 2016, men MEAP er tilgængelig lige nu. Brug koden mardandz ” for at få 39 % rabat. Hvert kapitel har et projekt, som er suppleret m
Dette indlæg er skrevet af Scott Hasbrouck. Du kan finde ham på Twitter eller hans websted. Det har ikke været andet end vidunderligt at se JavaScript virkelig fange ild de sidste par år inden for webteknologi og i sidste ende blive det mest brugte sprog i 2016, ifølge StackOverflow-data. Min histo
Sådan opbygges en komponent med udvalgt alle ved hjælp af React i en Next.js-app. Kom godt i gang Til denne tutorial vil vi bruge CheatCode Next.js Boilerplate for at give os et udgangspunkt for vores arbejde. Først skal du klone kedelpladen: Terminal git clone https://github.com/cheatcode/nextjs
Sådan opretter du en kreditkortformular ved hjælp af Stripe.js og Stripe Elements, samt hvordan du henter denne kreditkortformulars værdi og genererer et Stripe-kildetoken. Kom godt i gang Til denne tutorial, for at give os et udgangspunkt for vores arbejde, vil vi bruge CheatCode Next.js Boilerpl
Jeg har hørt om React, siden jeg først begyndte at lære JavaScript, men jeg må indrømme, at jeg kiggede på det, og det skræmte mig. Jeg så, hvad der lignede en masse HTML blandet med JavaScript og tænkte, er det ikke det, vi har forsøgt at undgå? Hvad er det store problem med React? I stedet fokus
Et nyt koncept blev introduceret i React - Hooks. Kroge er et alternativ til klasser. Hvis du har brugt React før, vil du være bekendt med enkle (funktionelle) komponenter og klassekomponenter . Simpel komponent } Klassekomponent } } Mange af de funktioner, der er tilgængelige for klasser - såsom
Ethvert element kan gøres redigerbart med tilføjelsen af contenteditable attribut. Denne attribut bruges overalt på nettet, f.eks. i Google Sheets. Jeg vil ikke fortælle dig om du skal bruge eller ikke bruge contenteditable elementer i din app. Hvis du vælger at bruge contenteditable , kan du find
React kommer ikke med en indbygget router, men vi kan nemt opnå routing med react-router-dom bibliotek. Routing er, hvordan en webapplikation dirigerer trafik. (Hvis du ved, hvad routing er, er du velkommen til at springe dette afsnit over.) Eksempel:Hvis du går til taniarascia.com, ender du på min
React Context API er en måde at skabe globale variabler, der kan sendes rundt i en React-app. Dette er alternativet til prop-boring, eller videregivelse af rekvisitter fra bedsteforælder til forælder til barn, og så videre. Kontekst bliver ofte udråbt som en enklere, lettere løsning til at bruge Red
For et stykke tid siden skrev jeg en artikel om Using Context API in React. Men de fleste af mine eksempler på den side brugte klassekomponenter, static contextType og Consumer , som er en arv måde at håndtere kontekst på, og i TYOOL 2021 ønsker vi pæne, rene, funktionelle komponenter. Jeg havde bru
Der er ingen konsensus om den rigtige måde at organisere en React-applikation på. React giver dig en masse frihed, men med den frihed følger også ansvaret for at bestemme over din egen arkitektur. Ofte er tilfældet, at den, der konfigurerer applikationen i begyndelsen, smider næsten alt i en compone
Introduktion Når du opretter React-applikationer, der henter indhold fra eksterne kilder, der tager lidt tid at indlæse, er det altid en god idé at give en behagelig brugeroplevelse ved at engagere brugerne og holde deres opmærksomhed med en indlæser, da dette hjælper brugerne med at forstå, hvad d
Introduktion Når du opretter React-applikationer, der henter indhold fra eksterne kilder, som tager lidt tid at indlæse, er det altid en god idé at give en behagelig brugeroplevelse ved at engagere brugerne og holde deres opmærksomhed med en indlæser, da dette hjælper brugerne med at forstå, hvad d
Introduktion Når en udvikler opretter en applikation, er næste skridt at dele den med venner eller offentligheden, så alle kan få adgang til den. Processen med at overføre kode fra et udviklingsmiljø til en hostingplatform, hvor den serveres til slutbrugere, kaldes implementering . Hosting plejede
Introduktion Implementering er processen med at flytte vores kode fra et kildekontrolsystem til en hostingplatform, hvor den bliver gemt og kan serveres som en applikation til slutbrugere. Typisk gøres dette enten i skyen eller på en lokal server. Før fremkomsten af cloud-platforme som Netlify b
Introduktion Hændelser repræsenterer normalt en form for interaktion mellem brugeren og appen - hver gang en bruger klikker på objektet, skriver i inputfeltet, trækker eller slipper et element, og så videre. Derfor kræver hver begivenhed normalt en form for reaktion fra appen. Hver gang en væsentli
Introduktion En komponent er det nok vigtigste begreb at forstå i React. Det er en af kernebyggestenene af React, der giver os mulighed for at opdele en brugergrænseflade i uafhængige, genbrugelige stykker, hvilket gør opgaven med at bygge brugergrænseflader meget nemmere. Alle disse uafhængige k