Home

Awesome

Primer React Template ๐Ÿฑโš›๏ธ

The quickest way to test out or prototype something in Primer React without having to set up a new project.

<img width="902" alt="preview" src="https://user-images.githubusercontent.com/980622/133642956-9eba4d44-ce66-434f-afe0-a88be0104682.png">

Get Started (Codespaces)

  1. Click Code
  2. Click new codespace
  3. Pick any machine type and click create codespace
  4. Wait until the container is built and Running postCreateCommand... is finished running in the bottom TERMINAL panel.
  5. Now in the TERMINAL panel write the yarn start command and hit enter.
  6. When it's finished building your project click Open to open a preview of it. If this doesn't happen click PORTS in the bottom window and open the Local Address from there.
  7. Now you are in Mona's playground ๐ŸŽ‰ and you can start editing the src/Playground.js file to play around with Primer React.

https://user-images.githubusercontent.com/980622/135662854-946e5d2d-b6d1-4cbf-a769-318bf52858a8.mov

Get Started (Locally)

  1. Clone the project
  2. Run yarn
  3. Run yarn start
  4. Open http://localhost:3000 to view it in the browser.
  5. Go to src/Playground.js to start prototyping.

(For GitHub staff only) Check out this talk (9 minutes 30 seconds) from @heyamie for more tips on prototyping with Primer React.

10 reasons why this is great

Useful Links