뻘짓 노트

< 작성 이유 >
문제 해결글로 작성하기엔 너무 사소한..실수 목록
글로 정리해두고 같은 실수를 반복하지 않기 위해
나중에 보고 웃으려고(과연..?)

24.05.25 부터 정리

 

• 커맨드 창에서 단축키 사용 시 현재 입력 소스가 영문 키보드인지 확인하자
  • 커맨드 창에서 단축키 연습 중이었는데 갑자기 단축키가 먹히지 않음
  • 명령어가 작성되지 않아 키보드가 한글로 바뀌었는지도 몰랐음
  • 영문 키보드여야 단축키가 동작함

 

• display: inline, block, inline-block은 속성을 적용하고 싶은 주체 요소에 직접 쓰자
  • css에서 display: flex, grid 쓰다가 오랜만에 block 쓰려니까 부모 요소 안에 써버림
  • 그러고는 왜 <a> 태그에 너비랑 높이값이 적용되지 않는지 30분 고민함

 

•  justify-content는 여백이 있어야 잘 작동한다
  • div 박스 안에서 <a> 태그 속에 위치한 img를 가운데 정렬하려고 함
  • div 박스에 display: flex; justify-content: center; 를 작성했지만 동작하지 않음
  • <a> 태그에는 안 먹히나? img 태그에는 안 먹히나? 하면서 죄다 div로 감싸봄
  • 알고보니 위에 <a> 태그에 width: 100%를 줘서 좌우로 움직일 공간이 없던 거였음
  • 콘텐츠가 내부를 꽉 채우고 있으면 당연히 안 움직이겠지

 

• font-size에는 꼭 단위를 적어주자
  • 아마 font-weight랑 같이 쓰면서 단위를 잊은 거 같은데
  • font-size는 단위 안 쓰면 해당 사이즈가 반영되지 않음

 

• position: relative, absolute, fixed, sticky
  • ...display: absolute라 쓰고 이틀 고민함
  • ........
  • absolute는 position, absolute는 position, absolute는 position

 

• element.addEventListener("이벤트", 함수명)
  • addEventListener는 함수 호출 결과를 받는 게 아니라 함수 자체를 핸들러로 설정해야 함
  • 함수명()로 호출하면 안됨...
  • 앞에 addEventListener들은 잘 썼으면서 왜 마지막 거에만 () 씀?

 

• 리액트에서 js 파일에 대응되는 css 파일을 꼭 임포트하자
  • 임포트 안 해놓고 왜 적용 안되지 30분 고민함
  • 페이지 로딩에 실패해서 안 뜨는 줄 알고 Link만 열심히 쳐다보고 있었네
  • 리액트..외울 거 너무 많다
  • 뭐든 처음 배울 땐 어려우니까...✨

 

• label과 특정 input을 연결해주는 건 'id' 값이다
  • class 아니고, type 아니고, name 아니고
  • <label for="내꺼"><input id="내꺼">

 

• 임포트 시에 from '라이브러리'인지 '파일'인지 잘 보자
  • axios instance 파일 만들고 해당 파일을 계속 axios라는 이름으로 임포트 함
  • 중간에 임포트문 안 쓰고 바로 axios.get 이런 식으로 작성하니까
  • 자동완성으로 from "axios"가 돼 버림..
  • 이것도 모르고 스웨거만 닳도록 봄
  • 라이브러리랑 같은 이름으로 불러오지 말자.
  • 아님 헷갈리질 말던가^_^

 

•  

 

따봉 챗지피티야 고마워!

 

 

*** 뻘짓할 때마다 업데이트 ***