Bookmarks landing page with Nuxt.js & Vuelidate

I am continuing to use these projects to get more reps in with NuxtJS. We are using this framework at work, and it is helpful to work through these projects to get more experience with Nuxt.

Those big purple blobs behind the hero and featured section images were an interesting challenge. I tried several approaches using ::before and ::after pseudo attribute selectors, but decided to use an empty div using aria-hidden="true".

This ended up being a much larger project than I originally anticipated, but it introduced me to some new ideas, so it was definitely worth it. One thing I learned is the Vue.js <component is="h2">/<component is="h3">. The thing I like about this is that it allows me to create a reusable component while ensuring proper semantics within the document flow. No more worrying about using an h2 element inside a component that should really contain an h3.

The more of these I do, the more I find opportunities to improve my component development. I assert that these submissions are not perfect, but give me an opportunity to reflect on my progress as I continue to learn.