resume-terminal-site-template

A terminal-style resume website built with React, TypeScript, and Vite.

Prerequisites

• Node.js (version 18 or higher recommended)
• npm (comes with Node.js)

Installation

Install the dependencies:

npm install

Development

Run the development server:

npm run dev

The site will be available at http://localhost:5173 (or another port if 5173 is in use).

Building for Production

Build the project:

npm run build

The built files will be in the dist directory.

Preview Production Build

Preview the production build locally:

npm run preview

Type Checking

Run TypeScript type checking:

npm run typecheck

Deployment

This is a static site built with Vite. Run npm run build first to generate the dist/ directory, then deploy using any of the platforms below.

Vercel (Recommended)

Vercel offers the simplest deployment experience and has first-class support for Vite projects.

Via the Vercel dashboard (no CLI required):

1. Push your code to a GitHub, GitLab, or Bitbucket repository.
2. Go to vercel.com and sign in.
3. Click Add New → Project and import your repository.
4. Vercel auto-detects Vite. Confirm the settings:
   • Framework Preset: Vite
   • Build Command: npm run build
   • Output Directory: dist
5. Click Deploy.

Every subsequent push to the default branch triggers a new deployment automatically.

Via the Vercel CLI:

npm install -g vercel
vercel login
vercel          # deploy (follow the prompts)
vercel --prod   # promote to production

---

Netlify

Netlify is another excellent option for static sites with a generous free tier.

Via the Netlify dashboard:

1. Push your code to a GitHub, GitLab, or Bitbucket repository.
2. Go to app.netlify.com and sign in.
3. Click Add new site → Import an existing project and connect your repository.
4. Set the build settings:
   • Build Command: npm run build
   • Publish Directory: dist
5. Click Deploy site.

Via the Netlify CLI:

npm install -g netlify-cli
netlify login
npm run build
netlify deploy --dir=dist          # preview deploy
netlify deploy --dir=dist --prod   # production deploy

Optional – netlify.toml config file (place in project root):

[build]
  command = "npm run build"
  publish = "dist"

---

GitHub Pages

GitHub Pages provides free hosting directly from your repository.

1. Install the gh-pages helper:

   npm install --save-dev gh-pages

2. Add a homepage field and deploy scripts to package.json:

   {
     "homepage": "https://<your-username>.github.io/<your-repo-name>",
     "scripts": {
       "predeploy": "npm run build",
       "deploy": "gh-pages -d dist"
     }
   }

3. If the site is served from a sub-path (e.g. /<repo-name>/), set the base in vite.config.ts:

   export default defineConfig({
     base: '/<your-repo-name>/',
     plugins: [react()],
   });

4. Deploy:

   npm run deploy

5. In your repository on GitHub, go to Settings → Pages and confirm the source is set to the gh-pages branch.

---

Heroku

Heroku is a general-purpose platform that can serve static sites using the heroku-buildpack-static buildpack.

Prerequisites: Heroku CLI installed and logged in.

1. Create a static.json file in the project root:

   {
     "root": "dist/",
     "clean_urls": true,
     "routes": {
       "/**": "index.html"
     }
   }

2. Add a package.json heroku-postbuild script so Heroku builds the site:

   "scripts": {
     "heroku-postbuild": "npm run build"
   }

3. Create the Heroku app and attach the static buildpack:

   heroku create <your-app-name>
   heroku buildpacks:add heroku/nodejs
   heroku buildpacks:add https://github.com/heroku/heroku-buildpack-static
   git push heroku main

4. Open the deployed site:

   heroku open