Nuxtjs Tailwindcss Portfolio

Overview

This article introduces a simple portfolio starter theme built with Nuxt.js and Tailwind CSS. It is a Nuxt.js version of the Vuejs-&-TailwindCSS-Portfolio. The theme offers a responsive design, a theme switcher with dark mode, and various features like projects filter, search, transitions, carousel, and more. The article provides instructions on how to set up the theme and contribute to the project.

Features

• Simple and responsive design
• Nuxt.js with Vuex
• Tailwind CSS v2
• Theme Switcher with Dark Mode
• Vuex for state management
• Reusable components
• Projects filter by category
• Projects search by title
• Vue transitions
• Counter
• Projects carousel
• Smooth scroll
• Dynamic forms
• Back to top button
• Download file button

Installation

To set up the project, follow these steps:

1. Ensure that you have Node.js installed. Download and install it from the official website or use NVM (Node Version Manager). If you are using Mac, Homebrew is also a good option.
2. Clone the repository.
3. Open the project folder.
4. Install the packages and dependencies by running the command npm install or yarn install.
   • Note: If you don’t have yarn installed, you can install it globally using npm.
5. Start a local development server at http://localhost:3000 by running the command npm run dev or yarn dev.
6. For production build and generating static files, use the following commands:
   • Build for production and launch server: npm run build && npm run start or yarn build && yarn start.
   • Generate static project: npm run generate or yarn generate.

Summary

This article introduces a simple portfolio starter theme built with Nuxt.js and Tailwind CSS. It showcases various features including a responsive design, theme switcher with dark mode, and several other components and functionalities. The article also provides installation instructions for setting up the theme and generating static files. Contributions to the project are welcomed.