DEV Community

Suulola Oluwaseyi
Suulola Oluwaseyi

Posted on

Building with Vue 3 with tailwindcss

This tutorial will be building a full project using Vue 3 and combining it with the magic of Tailwindcss to produce a responsive multipage website

Below is the landing page of the webpage that will be built

Vue 3 Webpage

Some of the concepts that will be learnt in the process include

  • Setting up a Vue project with tailwindcss
  • State management with vuex
  • Routing, Composition API in Vue 3
  • Creating reusable components
  • Persisting state in Vue application
  • Interacting with APIs

It promises to be an interesting an exciting journey.

The codebase can be accessed on GitHub Here. Give it a star if you find it helpful and your pull requests are definitely welcomed.

The choice of tailwind is become of the flexibility the utility library gives - especially for responsiveness and dark/light mode which is something we will implement across the application.

You can check the final product here as hosted on Netlify.

Drop your comment in the comment box and I hope you are as excited as I am to embark on this quest.

Your questions and comments are welcomed in the comment section.

Cheers

Image of Datadog

How to Diagram Your Cloud Architecture

Cloud architecture diagrams provide critical visibility into the resources in your environment and how they’re connected. In our latest eBook, AWS Solution Architects Jason Mimick and James Wenzel walk through best practices on how to build effective and professional diagrams.

Download the Free eBook

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay