The quickest way to test out or prototype something in Primer React without having to set up a new project.
- Click
Code - Click
new codespace - Pick any machine type and click
create codespace - Wait until the container is built and
Running postCreateCommand...is finished running in the bottomTERMINALpanel. - Now in the
TERMINALpanel write theyarn startcommand and hit enter. - When it's finished building your project click
Opento open a preview of it. If this doesn't happen clickPORTSin the bottom window and open theLocal Addressfrom there. - Now you are in Mona's playground 🎉 and you can start editing the
src/Playground.jsfile to play around with Primer React.
Instructions.mov
- Clone the project
- Run
yarn - Run
yarn start - Open http://localhost:3000 to view it in the browser.
- Go to
src/Playground.jsto start prototyping.
(For GitHub staff only) Check out this talk (9 minutes 30 seconds) from @heyamie for more tips on prototyping with Primer React.
- 🧑🏻💻 Get used to using Codespaces
- 🥺 You're a new Hubber, you have enough to learn already
- 👁 Color mode test your layout quickly
- 🧖♀️ Prototype layouts outside the main platform
- 🗑 No clutter on your local computer
- 🥴 No local problems
- 🪄 No linter or formatter issues
▶️ Send over a preview link while working live on your code, no waiting for deploy previews needed.- 🚀 No need to set up a new react project, just instantly start prototyping
- 🧪 You want to learn React
