Skip to main content
Get the portfolio up and running on your local machine in just a few minutes. This guide walks you through cloning the repository, installing dependencies, and starting the development server.

​
Prerequisites

Before you begin, ensure you have the following installed:

Node.js

Version 18 or higher recommended

Package Manager

Bun, npm, or Yarn (Bun 1.1.38+ recommended)
This project uses Bun 1.1.38 as the default package manager. You can also use npm or Yarn if preferred.

​
Installation

1

Clone the repository

Clone the Bennett Eghan portfolio from GitHub:
git clone https://github.com/abena07/bennett-eghan.git
cd bennett-eghan
This downloads the source code and navigates into the project directory.
2

Install dependencies

Install all required packages using your preferred package manager:
bun install
This installs all dependencies including React, Vite, TypeScript, Tailwind CSS, and MDX tooling.
3

Start the development server

Run the development server with hot module replacement:
bun dev
The development server will start on http://localhost:5173 by default.
4

Verify the installation

Open your browser and navigate to http://localhost:5173. You should see:
  • The homepage with Bennett Eghan’s profile
  • Navigation menu (Projects, Blog)
  • Monospace Courier New typography
  • Tailwind CSS styling with the custom color palette
The Vite development server includes fast hot module replacement (HMR). Any changes you make to source files will be reflected instantly in the browser.

​
Building for Production

When you’re ready to build the optimized production bundle:
1

Run the build command

Execute the build script which generates reading times and compiles the application:
bun run build
This command:
  1. Runs scripts/reading-times.mjs to calculate reading times for blog posts
  2. Compiles TypeScript using tsc -b
  3. Builds the optimized production bundle with Vite
The output will be in the dist/ directory.
2

Preview the production build

Test the production build locally before deploying:
bun run preview
This serves the production build locally for testing. Access it at http://localhost:4173.

​
Available Scripts

ScriptCommandDescription
devviteStart development server with HMR
buildnode scripts/reading-times.mjs && bunx tsc -b && bunx vite buildBuild optimized production bundle
linteslint .Run ESLint to check code quality
previewvite previewPreview production build locally

​
What’s Running?

When you start the development server, Vite configures:
  • React 18 with Fast Refresh for instant updates
  • TypeScript type checking
  • Tailwind CSS 4 with the @tailwindcss/vite plugin
  • MDX processing for blog posts with:
    • rehype-prism-plus for syntax highlighting
    • remark-gfm for GitHub-flavored markdown
    • remark-emoji for emoji support
  • Path aliases (@/ maps to src/)
  • Sitemap generation for https://www.bennett-eghan.com
See vite.config.ts:15-40 for the complete Vite configuration.

​
Next Steps

Customize Content

Remove personal information and add your own blog posts and projects

Manage Projects

Add and manage your project showcase

Explore Components

Learn about the React component architecture

Styling System

Understand the Tailwind CSS configuration
Important: Before deploying your own version, please remove all personal information including blog posts, resume data, images, and project details. Review the LICENSE for usage terms.

​
Troubleshooting

If another process is using port 5173, Vite will automatically try the next available port (5174, 5175, etc.). Check the terminal output for the actual URL.
Run bunx tsc --noEmit to check for type errors without building. Fix any errors in your source code before running the build again.
Ensure your MDX files have valid frontmatter and proper JSX syntax. Check vite.config.ts:18 for MDX plugin configuration.
The project uses path aliases with @/ mapping to src/. If you see import errors, verify the path alias configuration in vite.config.ts:42-46.

​
Need Help?

Build docs developers (and LLMs) love

Get started for freeTalk to us