스프린트 미션

오늘은 스프린트 미션 3을 진행했다. 블로그에는 따로 적지 않았지만, 미션 1과 미션 2는 스타일 라이브러리 없이 순수 HTML과 CSS로 레이아웃과 디자인을 구현하는 과제였다. 이번 미션은 그 페이지에 media query를 적용해 반응형 디자인을 만드는 것이었다.

이번에는 내 작업 속도를 확인해 보고 싶어서 목표 시간을 2시간으로 잡고 시작했다. 평소에도 반응형 작업을 해왔던 터라 크게 어렵지 않을 거라 생각했는데, 예상보다 실수도 많았고 속도도 잘 나오지 않아 결국 3시간 정도 걸려 완성할 수 있었다. 앞으로는 작업 속도를 높이기 위해 타자 연습 같은 기본기도 함께 신경 써야겠다는 생각이 들었다.

심화 미션

스프린트 미션에는 항상 기본 미션과 심화 미션이 나뉘어 있는데, 이번 심화 미션은 SNS 공유 시 미리보기 기능을 제공하기 위해 메타데이터를 추가하는 것이었다.

이 작업은 예전에 메이플 헬퍼를 만들 때 해봤던 경험이 있어서 어렵지 않게 할 수 있었다. 그런데 또다시 문제가 된 건 디스코드였다. 디스코드에 링크를 공유했을 때 이미지가 제대로 로드되지 않았던 것이다.

처음에는 디렉토리 내부 경로를 그대로 쓰면 될 거라고 단순하게 생각했는데, 디스코드는 https://로 접근 가능한 경로여야 했다는 부분이 기억났고 결국 배포한 주소를 이용해 이미지 경로를 수정했고, 테스트 배포 후 미리보기 이미지가 정상적으로 표시되는 것을 확인했다. 덕분에 미션도 무사히 제출할 수 있었다.

마치며

처음에는 이미 해봤던 작업이라 만만하게 봤지만, 막상 해보니 실수도 있었고 생각보다 시간이 더 걸렸다. 역시 방심은 금물이라는 걸 다시 느꼈다.

앞으로도 12번까지 미션이 남아 있는데, 그 과정에서 인상 깊었던 이슈나 배움이 생기면 블로그에 계속 기록해 두려고 한다.

스프린트 미션 - 3