https://github.com/brandonwingerair/portfolio-nuxt-tailwind-graphql
Redesign of a Blog & Portfolio website, based on a tutorial series by @danvega with custom features added.
https://github.com/brandonwingerair/portfolio-nuxt-tailwind-graphql
blog nuxt nuxt-content nuxt-content-module nuxt-demo nuxt-tailwind-module nuxt-tailwindcss nuxt-website nuxt3 portfolio tailwind tailwind-css tailwindcss vue vue-3 vue-demo vue-demo-preview vue-website vue3 vue3-demo
Last synced: about 2 months ago
JSON representation
Redesign of a Blog & Portfolio website, based on a tutorial series by @danvega with custom features added.
- Host: GitHub
- URL: https://github.com/brandonwingerair/portfolio-nuxt-tailwind-graphql
- Owner: BrandonWingerAir
- Created: 2023-12-03T03:28:39.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-03-15T07:51:07.000Z (about 1 year ago)
- Last Synced: 2025-01-13T11:25:33.944Z (3 months ago)
- Topics: blog, nuxt, nuxt-content, nuxt-content-module, nuxt-demo, nuxt-tailwind-module, nuxt-tailwindcss, nuxt-website, nuxt3, portfolio, tailwind, tailwind-css, tailwindcss, vue, vue-3, vue-demo, vue-demo-preview, vue-website, vue3, vue3-demo
- Language: Vue
- Homepage: https://brandonwingerair.github.io/portfolio-nuxt-tailwind-graphql/
- Size: 2.34 MB
- Stars: 0
- Watchers: 1
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Blog & Portfolio Website
Built with Nuxt 3, Tailwind CSS and GraphQL
## Demo Links
Main Link:
[Live Site](https://blog.brandonwinger-air.com/)
gh-pages Link:
[GitHub Pages](https://brandonwingerair.github.io/portfolio-nuxt-tailwind-graphql/)
## About The Project
Custom Features:
- Color scheme, spacing & UI additions
- Animated gradient background
- Nuxt pages and layouts
- Github Actions workflow & deployment
- API token environment secret and baseURL variable
- Responsive styles and graphic design
Redesign based on a [tutorial series](https://www.youtube.com/playlist?list=PL4cUxeGkcC9gqdtrsPXR3K7nJhvYugyni) by [Dan Vega](https://www.danvega.dev/).
## Setup
### Add the following to environment file (.env)
```Dotenv
# GitHub API for Projects page
GH_TOKEN=YOUR_PERSONAL_ACCESS_TOKEN
# Optional: Enable search engine crawl & index
# SEO_ENV=production
# Optional: Set port if required
# PORT=3000
# Optional: Subdirectory for Nuxt config baseURL
# NUXT_APP_BASE_URL='/your-subdomain'
```
### SEO Configuration (nuxt.config.ts)
Check out the [robots module documentation](https://nuxtseo.com/robots/getting-started/installation) for more information.
### Make sure to install the dependencies
```bash
# npm
npm install
# pnpm
pnpm install
# yarn
yarn install
# bun
bun install
```
### Development Server
Start the development server on `http://localhost:3000`:
```bash
# npm
npm run dev
# pnpm
pnpm run dev
# yarn
yarn dev
# bun
bun run dev
```
### Production
Build the application for production:
```bash
# npm
npm run build
# pnpm
pnpm run build
# yarn
yarn build
# bun
bun run build
```
Locally preview production build:
```bash
# npm
npm run preview
# pnpm
pnpm run preview
# yarn
yarn preview
# bun
bun run preview
```
Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.