Här följer en kortare guide för att börja utforska IDS och React och hur man skulle kunna bygga prototyper.
...
I den högra vyn finns en liten mappstruktur som ser ut ungefär såhär:
📁 public
📁 src
📁 components
App.js
index.js
style.css
package.json
Innehållet för vårt projekt finns i mappen 📁 src, där man kan hålla koll på två saker:
...
Om du öppnar mappen 📁 components så ser du att det finns två filer i den mappen; Footer.js och Header.js. Om du öppnar dessa filer så ser du att koden för sidhuvud och sidfot är mer komplex än vad som syns i App.js. Av den anledningen är det smidigt att bryta ut kod till egna komponenter och hantera dem separat.
📋 Skapa en egen kopia
Nästa steg är att skapa en egen kopia, så att du kan spara den och arbeta vidare som det passar dig. Det man gör då är att skapa en fork, vilket innebär att man skapar en ny kopia av ett existerande repository.
...
Varje gång man sparar en ny version av sin kod kommer den nu att sparas “i ett nytt spår”, vilket gör att två parallella versioner kan existera samtidigt. Du kan helt enkelt arbeta vidare med en egen kopia
...
[Texten under uppdatering].
För att skapa en kopia tryck på knappen Fork uppe till höger i Code Sandbox.
Du kommer nu att uppmanas att skapa ett konto eller logga in. Om du vill så kan du hoppa över detta steg och klicka på knappen Continue without an account längst nere i rutan. Du kan då arbeta vidare med din kod, men inte spara den. Annars är det rekommenderat att skapa ett konto, exempelvis via Google-login.
Du kommer nu att ha registrerat dig för ett gratis-konto, med vissa begränsningar (men som funkar för ändamålet). Nu kan du fortsätta att redigera din kod.
Om du vill visa din kod i webbläsaren så kan du kopiera den adressen som visas ovanför förhandsgranskningen (den högra kolumnen i gränssnittet).