~/paul-opmann/work/personal-website

paulopmann.com

> 개인 사이트 및 포트폴리오

이 사이트입니다. 터미널처럼 탐색하고 느껴지는 포트폴리오로, 정적으로 생성되는 Next.js 앱으로 만들었습니다.

개요

템플릿 대신 매일 쓰는 도구처럼 읽히는 포트폴리오를 원했습니다. 홈 페이지는 셸 세션처럼 구성되어 있습니다. 각 섹션은 파일이고, 경력은 git log, 기술 스택은 설정 파일입니다.

모든 페이지는 정적으로 생성되어 Vercel에서 제공됩니다. 콘텐츠는 타입이 지정된 모듈에 있어, 프로젝트를 추가하거나 문구를 고치는 일이 타입 검사기가 검증하는 코드 변경이 됩니다.

01
터미널 레이아웃
고정된 왼쪽 열에 이름, 목차, 링크가 있고 콘텐츠는 그 옆에서 스크롤됩니다. 섹션은 파일처럼 이름이 붙고, 경력은 현재 직무를 HEAD로 둔 커밋 그래프로 표시됩니다.
02
명령 팔레트
Cmd+K 또는 Ctrl+K로 키보드 중심의 메뉴를 열어 섹션과 케이스 스터디로 이동하고, 이메일 주소를 복사하고, 프로필을 열 수 있습니다. 입력하는 대로 명령이 필터링되고 Enter로 실행됩니다.
03
읽는 위치 추적
목차, 상태 표시줄, URL 해시가 지금 읽고 있는 섹션을 따라갑니다. 해시는 방문 기록을 늘리지 않고 갱신되며, 딥 링크는 페이지가 해당 섹션을 맨 위까지 스크롤할 수 없어도 유지됩니다.
04
타입이 지정된 케이스 스터디
각 케이스 스터디는 데이터입니다. 기능은 화면과 함께 한 번만 정의되고, 모든 언어가 일치하는 문구를 제공해야 합니다. 번역이나 기능 설명이 빠지면 누락된 채 배포되지 않고 빌드가 실패합니다.