trello-clone-nuxt-3 Tailwind Templates

Trello Clone Nuxt 3

Vue 3 / Nuxt 3 fundamentals, Composition API State management with Pinia Tailwind CSS (Utility CSS), local storage VueUse, UINuxt library

Trello Clone - Nuxt 3

This repository contains a Trello-like project built as part of the Vue Mastery course on building a Trello Clone with Nuxt 3.

Technologies Used

  • Nuxt 3: A modern framework built on Vue 3, providing powerful features like server-side rendering (SSR), file-based routing, and automatic imports.
  • Vue 3: For creating a reactive and component-based user interface.
  • Pinia: State management library for managing app state in a modular way.
  • Composition API: Used for structuring logic and reactivity in the project.
  • CSS Modules: Scoped CSS for styling individual components.
  • Vite: A fast build tool and development server.
  • Vue Router: For managing navigation and routing within the app.
  • UI Nuxt Library: For ready-made UI components and faster development.
  • VueUse: A collection of utility functions, including local storage handling, for better app functionality.
  • Tailwind CSS (if used): For utility-first styling.

Key Features

  • Drag-and-drop interface for managing tasks and lists.
  • Dynamically rendered lists and cards with state synchronization.
  • Persistent data storage using VueUse's local storage utilities.
  • Routing setup for different views within the application.
  • State management using Pinia for a reactive data flow.
  • Lightweight and efficient UI components built with Nuxt's best practices.

What I Learned

  • Setting up and configuring a Nuxt 3 project from scratch.
  • Utilizing the Composition API to manage state and logic in Vue 3 components.
  • Implementing state management with Pinia to handle application data.
  • Creating a dynamic and responsive drag-and-drop UI using modern CSS and JavaScript techniques.
  • Optimizing application performance using SSR and Nuxt 3's features.
  • Managing routes and navigation using Vue Router.
  • Using VueUse for simplifying local storage management and ensuring data persistence.
  • Understanding the fundamentals of project structure and best practices in Nuxt 3.
  • Leveraging the UI Nuxt Library for faster UI development.

How to Run the Project Locally

  1. Clone the repository: ```bash git clone https://github.com/valensiaa/trello-clone-nuxt-3.git

Top categories

Loading Svelte Themes