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:
- 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.
- Clone the repository.
- Open the project folder.
- Install the packages and dependencies by running the command
npm install
oryarn install
.- Note: If you don’t have yarn installed, you can install it globally using npm.
- Start a local development server at http://localhost:3000 by running the command
npm run dev
oryarn dev
. - For production build and generating static files, use the following commands:
- Build for production and launch server:
npm run build && npm run start
oryarn build && yarn start
. - Generate static project:
npm run generate
oryarn generate
.
- Build for production and launch server:
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.