이 질문 뒤에 면접관이 확인하려는 것은 따로 있습니다.
포트폴리오 사이트를 직접 만들면서 CSS 플렉스박스로 모바일과 데스크톱 레이아웃을 동시에 대응하는 작업을 하였습니다.
처음에는 픽셀 단위로 크기를 고정하여 모바일에서 화면이 깨졌습니다. 미디어 쿼리를 공부하면서 768px 기준으로 레이아웃을 전환하는 방식을 적용하였습니다. 처음에 적용했을 때 텍스트가 버튼을 덮는 오류가 발생하였는데, 플렉스 방향을 column으로 바꾸니 해결되었습니다.
이 과정에서 CSS가 어떻게 화면을 잡는지 구조적으로 이해하게 되었습니다.
이 경험에서 CSS는 외워서 쓰는 것이 아니라 직접 만들어보면서 왜 그렇게 동작하는지 이해해야 실제로 쓸 수 있다는 것을 배웠습니다. 에러를 고치는 과정에서 더 많이 배웠습니다.
수업 과제에서 정적인 할 일 목록 HTML 페이지에 자바스크립트로 항목 추가·삭제 기능을 붙이는 작업을 했어요.
처음엔 버튼을 눌러도 아무 일이 안 일어났어요. document.getElementById를 잘못 쓴 게 원인이었는데, 오류 메시지를 읽고 콘솔 로그를 추가해서 어디서 멈추는지 찾았습니다. 3시간 만에 원인을 찾고 고쳤어요. 작동하는 걸 처음 봤을 때 제가 만든 게 움직인다는 게 신기했습니다.
이 경험에서 자바스크립트는 HTML·CSS와 어떻게 연결되는지를 직접 구현해봐야 이해된다는 걸 배웠어요. 콘솔 로그가 가장 빠른 디버깅 도구라는 것도 그때 배웠습니다.
웹 개발 수업에서 처음 HTML을 쓸 때 모든 걸 div로만 만들었어요. 코드 리뷰에서 '구조를 읽기 어렵다'는 피드백을 받았습니다.
header, nav, main, footer 같은 시멘틱 태그를 쓰면 어떻게 달라지는지 직접 바꿔봤어요. 코드가 짧아지지는 않았는데, 어디가 어느 영역인지 훨씬 빨리 파악됐습니다. 팀원이 같은 코드를 수정할 때도 '이제 어디 고쳐야 하는지 바로 보인다'고 했어요.
이 경험에서 HTML 구조는 브라우저뿐만 아니라 함께 작업하는 사람을 위해서도 명확해야 한다는 걸 배웠어요. 태그 이름이 의미를 담으면 협업이 쉬워진다는 것도요.
답변에서 흔히 빠지는 것들 — 빠져 있으면 꼬리질문이 깊어집니다.
이 질문에 이어 incross UX/UI 디자이너 면접관이 던질 가능성이 높은 후속 질문.
이 페이지의 질문·답변·꼬리질문은 유사 직군 채용 시장의 공개된 면접 후기·커뮤니티 게시물을 분석해 구성한 학습 자료입니다. 특정 회사가 실제로 이 질문을 출제했다는 것을 보장하지 않으며, 모든 예시는 우문현답이 직접 작성한 창작물입니다. 해당 회사의 공식 입장과는 무관합니다. 회사 측의 정정 요청이 있을 경우 24시간 이내에 응답·수정합니다.