36번 개발일지(대구AI스쿨 71일차)

학습한 내용

React 5일차. React를 사용해서 날씨를 보여주는 사이트를 만들었다. OpenWeather에 있는 api를 사용해서 날씨를 받아왔다.

학습소감

처음에는 아래 박스에 검정색 배경이 아닌 흰색 배경으로 나와서 'CSS가 왜 적용이 안되지'라고 생각했다. 그래서 개발자 도구를 통해서 어떤 CSS가 적용됐는지 확인해보니 react-bootstrap의 CSS가 적용되고 있었다. 그래서 구글링을 하다가 CSS에 우선순위가 있다는 걸 알게 됐다.

여러 개의 CSS파일이 import 되어있을 때 가장 뒤에 있는 CSS파일의 속성들이 우선 적용된다는 것이다. 흰색 배경일 때 확인해보니 react-bootstrap의 CSS가 아래에 있어서 순서를 변경해줬다.

참고자료

CSS우선순위 - Creative_Lee님의 블로그