23.05.15 웹개발_솔로프로젝트(Footer 만들기)

Yeondong Choe·2023년 5월 15일
0

회고 Tip
1. 지금 현재, 기분과 느낌을 표현(구체적)
2. 오늘 학습한 내용의 단어를 모두 나열
3. 나열한 단어를 하나씩 설명
4. 설명하기 어려운 단어가 있다면 그 이유를 생각
5. 스스로 설명하기 위해 질문한다면 어떻게 질문할것인가 생각

웹개발_솔로프로젝트 데일리 후기

오늘의 목표는 Header와 Footer 즉 GNB를 완성하는게 목표이다. 주말에 Header를 다 작업했다보니 Footer를 완성하고 이후의 단계까지 해볼 수 있을거같다.
Header와 비슷한 부분이 있다보니 만드는것이 어렵지는 않았고 Header에 비하면 기능 구현도 쉽긴했다보니 시간이 훨신 많이 단축되었다.

기억해둘 코드

  1. box-shadow: 0px -1px 1px rgba(0, 0, 0, 0.1)
  1. Footer 바 구현
  • 어느 페이지에 가더라도 footer는 존재

  • Footer bar 상단 border 주기

  • text-align: center

  • color: #888888

  • font-size: 12px

마주했던 에러(1)

Footer bar의 상단에 border를 줘야 하는데 Header와 똑같을 거라고 착각한 나머지 그림자처럼 만들어주려고 했다.
그과정에서 그림자를 위쪽으로 주기 위해서 box-shadow: 0px -1px 1px rgba(0, 0, 0, 0.1)로 적으므로 그림자 수평은 0, 수직은 -1을 주어 한다는 것도 상기시킬 수 있었다.

기능을 다 구현하고 github에 나 나름 멋지게 명령어를 작성하여 add -> commit -> push했고 pr을 한 후 merge를 했다. 그러고나서 다시 한번 기능구현 요구사항을 보니 Footer bar의 상단에 그림자가 아닌 border로 되어있는것을 발견했다...!

지금은 솔로 프로젝트다보니 큰 문제없이 다시 수정할 수 있지만 만약 회사에서 입사 한후 신입개발자로서 첫프로젝트에서 나온 실수라고 한다면... 감정이 복잡미묘할거같다..
꼼꼼히 체크하지 않은,,, Header를 구현해봤다는 자신감에 신중하지 못했던,,, 나 자신이 불러온 얄팍한 지식의 함정이기때문이다.

이또한 여러므로 좋은 경험이였던거같다 box-shadow를 마이너스로 주는방법도 상기했고 무엇보다 기술 구현 전 요구사항을 한번 더 주의깊게 읽어야 한다는 교훈을 얻었다.

오늘은 남은 시간동안 다음 티켓을 진행해보며 꾸준히 블로깅 해야겠다.

profile
개발자 동동

0개의 댓글