안녕, heed

이 블로그는 기술 글과, 글 안에서 직접 만져 볼 수 있는 작은 데모를 위한 공간입니다. 화려한 기능보다는 읽는 흐름을 방해하지 않는 것을 우선하고, 글이 길어지더라도 한 줄 한 줄이 편하게 읽히도록 폭과 행간을 신경 써서 다듬어 갈 생각입니다.

빌드는 Astro로 하고, 본문에서 getCollection처럼 API 이름을 언급할 일이 자주 있을 겁니다.

이런 코드가 나옵니다

const posts = await getCollection("posts");
const sorted = posts.sort(
  (a, b) => b.data.date.valueOf() - a.data.date.valueOf(),
);
console.log(sorted.length);

이런 데모도 들어갑니다

같은 거리를 같은 시간 동안 움직여도 이징 곡선에 따라 느낌이 꽤 달라집니다. 재생을 눌러 비교해 보세요.

linear

ease-out

ease-in-out

back-out

재생지속 시간

800ms

앞으로 천천히 채워 나가겠습니다.