본문 바로가기
Mira Kwon
← 노트

· 1 분 분량

주말 동안 이 사이트를 다시 만들며

정적 HTML, 설정 파일 하나, 가변 폰트. 개인 사이트를 작게 유지하는 법.

  • 웹
  • 메타

규칙은 하나였습니다. 서버가 필요한 기능은 넣지 않는다.

  • Astro가 모든 페이지를 정적 HTML로 만듭니다. 자바스크립트는 히어로와 테마 전환에만 씁니다.
  • 설정 파일 하나에 이름, 링크, 색상이 모여 있어서 리디자인은 대부분 색 바꾸기로 끝납니다.
  • 히어로는 가변 폰트가 다 합니다. 커서를 따라 글자 굵기가 바뀝니다.
// 히어로 인터랙션 전체가 40줄 남짓
const weight = 400 + 500 * Math.max(0, 1 - distance / radius);

작은 사이트는 고치기 쉬워서 오래 살아남습니다.