Refactoring

  • 정의: 단순한 변형 및 추가와는 조금 거리가 있는, 동작은 변하지 않고 (테스트로 보장) quality는 높이는 작업
  • 코드 품질: SOLID, DRY, KISS, GRASP, YAGNI
    • 현재 내가 생각하는 code quality: clean naming, DRY (Don`t Repeat Yourself), KISS (Keep It Simple, Stupid), low dependency
  • Questions
    • HTML에서는 어떻게? JavaScript library나 templete을 쓰는 게 맞는건가?

CSS

Display

  • Box 모델은 웹 레이아웃의 기초인데, box의 종류는 display로 정의함.
  • block level element인 경우 display: block이 default
    • block: width와 height를 갖는 분리되지 않는 단위
    • inline: width와 height를 무시하며, flow, 즉 surrounding contents에 의해 결정됨.
    • inline-block: 왜 block이 나중일까? block이 명사인 것도 있겠지만 결국에는 block처럼 자신을 분리히지 않는 property를 가지기 때문이라고 생각함. block이므로 분리되지는 않으나, inline처럼 flow 속에 파묻힐 수 있음.

Float

  • 해당 element가 normal flow에서 제외된 뒤, 먼저 속성 값 (left, right)에 따라 float element를 배치하고 나머지 flow는 이들 자리를 피해서 배치.
    스크린샷 2018-11-03 오후 2.21.12.png
  • flow에서 스스로를 제외하며 surrounding text를 무시하게 되므로 위치를 결정할 input이 없거니와 필요도 없으므로 displayinline일 때 inline 속성이 당연히 사라짐.