Building a quick prototype should be easy, and, well, quick. I am currently exploring headless CMS options for a project at work and need to do some testing to see if a particular CMS solution will do the trick for us.
I want to build a barebones prototype using the Javascript framework I am most comfortable with, which is Nuxt.
First, get a Nuxt 3 app up and running. If you're no sure how to do this, please check out their documentation site.
I wanted to use Pico.css, because it's minimal and easy to get a good looking prototype up and running. I am used to TailwindCSS's way of doing things and that's just too much right now.
First, install Pico.css using npm
npm install @picocss/pico
Then, in your Nuxt project root, add an assets directory with an empty CSS file. I've added one in
assets/css/app.css
Next, you have to add the following line in the CSS file:
@import url('@picocss/pico/css/pico.slim.css)
I used the slim build, because I want this prototype as lightweight as possible.
Finally, run your build script npm run dev (or whatever you're using and you should be able to start using Pico.css in your project.