Logo

Introduction

Published Oct 12, 2024
Updated Oct 17, 2024
1 minutes read
1

Installation

Follow these simple steps to get started:

pnpm install
pnpm dev
pnpm install
pnpm dev

This will install the necessary dependencies and start the development server. Once the server is running, you can view your portfolio at http://localhost:3000http://localhost:3000.

Environment Variables

The following environment variables are required to run the application:

  • NEXT_PUBLIC_SITE_URLNEXT_PUBLIC_SITE_URL: The URL of your website.

Run the following command to create a .env.local.env.local file and add the required environment variables:

vercel env pull
vercel env pull

Then, update the values in the .env.local.env.local file with your own values.

Scripts

The following scripts are available to help you manage development, build processes, and linting:

buildbuild

Runs the linting process, updates MDX file timestamps, and then builds the Next.js application for production. This ensures code quality and proper SEO metadata before deployment.

pnpm build
pnpm build

postbuildpostbuild

Automatically generates the sitemap after the build process completes. This script uses the next-sitemapnext-sitemap package to create a sitemap.xmlsitemap.xml file for better SEO and discoverability.

pnpm postbuild
pnpm postbuild

mdx:timestampsmdx:timestamps

Runs a custom Node.js script that updates timestamps (createdcreated and updatedupdated) in your MDX files, automating the time management for blog posts.

pnpm mdx:timestamps
pnpm mdx:timestamps

lint:stylelint:style

Runs stylelintstylelint on all CSS files to check and automatically fix any style issues. This ensures consistent and clean CSS code.

pnpm lint:style
pnpm lint:style

lint:biomelint:biome

Runs the Biome linter to check and fix JavaScript/TypeScript code. This keeps your codebase clean and error-free.

pnpm lint:biome
pnpm lint:biome

lint:prettierlint:prettier

Runs Prettier to format your code according to your project's style guide. This improves code readability and consistency.

pnpm lint:prettier
pnpm lint:prettier

lintlint

A combination of the style, Prettier, and Biome linting scripts, run together to ensure the entire codebase follows consistent style and format rules.

pnpm lint
pnpm lint