Skip to content

README.md

Latest commit

 

History

History
58 lines (37 loc) · 2.18 KB

README.md

File metadata and controls

58 lines (37 loc) · 2.18 KB
Raw

resume-portfolio

This repository is a modern, responsive portfolio built with HTML, Tailwind (Play CDN for prototyping), and vanilla JavaScript. It showcases projects, case studies, and contact info.

Development

  • Prototyping uses the Tailwind Play CDN (no build step required). Open index.html in a browser.
  • For a production build, install Tailwind locally and generate CSS: For a production build, install Tailwind locally and generate CSS. This repo includes a ready package.json and src/input.css.
# install dev dependencies
npm install

# build the production CSS
npm run build:css

# during development (auto-rebuild on changes)
npm run dev:css

The project expects the built CSS at dist/output.css. index.html already references this file for production.

Optimizing images

This repo includes a helper script that generates responsive image variants in assets/images using sharp.

# install dependencies (includes sharp)
npm install

# generate resized images (creates gabby-320.jpg, gabby-640.jpg, gabby-1200.jpg)
npm run images:optimize

If you prefer image tooling outside Node, you can use ImageMagick or an online optimizer to produce similar size variants.

Custom background images

You can add curated background images to replace the default Unsplash placeholders.

  • Place curated images at assets/images/bg-1.jpg and assets/images/bg-2.jpg (JPEG/PNG). The site will prefer these local files if present.

Notes: Use images that you have rights to and keep files optimized for web (small file sizes and modern compression).

Deployment (GitHub Pages)

  1. Push this repository to GitHub under gabskay/resume-portfolio.
  2. In the repository Settings → Pages, set the source to the main branch root (or gh-pages branch).
  3. Wait a minute — your site will be available at https://gabskay.github.io/resume-portfolio/.

Notes & Next Steps

  • Add interactive case study pages or link to GitHub repos for each project.
  • Consider adding animations with framer-motion or small CSS keyframes for micro-interactions.
  • If you want a production-ready build, I can add package.json scripts and a simple PostCSS pipeline.

resume-portfolio