Week 1 위클리 미션 학습 기록
·
카테고리 없음
Week 1 위클리 미션 템플릿 코드를 새로운 파일에 카피해 적으며 내가 쓴 코드와 템플릿 코드를 비교해 보았다. 스스로 피드백 해 본 내용 태그를 남발하지 말자. 다른 페이지로 연결되는 버튼들은 태그가 아니라 태그로 감싸자. , , 같은 태그들에 클래스를 주자. 굳이 불필요한 로 감쌀 필요가 없다. 반복되는 특징들은 하나의 클래스로 묶자. (센스 있게 하려면 연습이 필요할 듯) 텍스트들에 최대한 시맨틱 한 태그를 사용하자. 아무 텍스트에나 같은 태그 갖다 붙이지 말자. grid로 배치할 때 grid-area로 각각 요소에 이름을 준 후에 grid-template으로 배치하는 것에 익숙해져 보자. :nth-of-type(odd), nth-of-type(even)도 활용해보자. 새롭게 알게 된 것들 1. ..
[CSS] Flexbox 속성 배우기 게임, Flexbox Froggy 🐸
·
Frontend/HTML ∙ CSS ∙ JavaScript
스프린트 우리 팀 팀원분께서 공유해주신 "Flexbox Froggy"라는 교육용 코딩 게임. CSS의 flexbox를 이용해서 같은 색깔의 개구리와 연잎을 매치시켜주는 게임이다. 이제 막 flexbox 개념을 배웠다면 쉽고 재미있게 flex와 친해질 수 있는 게임이다.  Flexbox FroggyA game for learning CSS flexboxflexboxfroggy.com 공부하다가 머리 환기 시킬 겸 해봤는데 재미있고,유익하고,귀엽다!  끝까지 완료해보니 같은 팀에서 개발한 여러가지 다른 게임들도 있다. CSS 뿐만 아니라 HTML, JS,  SQL도 재미있게 학습해볼 수 있다. (다만 대부분 유료이고, 앞서 언급한 Flexbox 속성 게임과 Grid 속성 게임은 무료로 풀려있다.)  Code..