zero-base 프론트엔드 스쿨 ⛪️

20221216 네 번째 mission❗

엄성준 2022. 12. 16. 21:57

네 번째 미션을 진행하면서 학습한 점에 대해서 적어보겠습니다.

 

일단 이번 미션을 진행할 때 피그마로 시안을 봤을 때는 굉장히 쉽겠다라고 생각을 했었는데 flex로만 layout구조를 잡다 보니 grid는 좀 생소해서 이번 기회에 제대로 복습을 한 것 같습니다. 또한 JS를 이용한 Toggle이 구현되어 있었는데 그 함수 안에 동작을 추가해서 구성하는 줄 알았으나 이미 구현된 JS에 css를 통해서 미션을 해결해야 된다는 생각이 들어서 가상 요소 before after를 이용해서 문제를 해결했습니다.

 

또한 아래는 제가 이번 미션을 하면서 참고한 사이트 입니다. 

 

https://projects.verou.me/bubbly/

 

Bubbly — CSS speech bubbles made easy

 

projects.verou.me