Primer ViewComponents Template 🐱💎

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

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 bottom TERMINAL panel write the rails server 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 app/views/hello/index.html.erb file to play around with Primer ViewComponents.

Instructions.mov

Get Started (Locally)

1. Clone the project
2. Run bundle install
3. Run rails server
4. Open http://127.0.0.1:3000 to view it in the browser.
5. Go to app/views/hello/index.html.erb to start prototyping.

10 reasons why this is great

• 🧑🏻‍💻 Get used to using Codespaces
• 🥺 You're a new Hubber, you have enough to learn already
• 🧖‍♀️ Prototype layouts outside the main platform
• 🗑 No clutter on your local computer
• 🥴 No local problems
• ▶️ Send over a preview link while working live on your code, no waiting for deploy previews needed.
• 🚀 No need to set up a new project, just instantly start prototyping
• 🧪 You want to learn Rails

Useful Links

• 🧠 Primer ViewComponents Documentation
• 🌈 Primer Primitives (Colors)