1. 계획
1) nomad coder에서 진행했던 예시를 가지고 clone coding을 한다.
2) 먼저 어떻게 구성되어있는지, 공통적인 부분들은 어떤 것인지 파악한다.
3) 분석한 것을 바탕으로 html을 작성한 후, css를 하나하나 해 나간다.
4) html 작성 시 공통된 부분을 올바른 naming을 한다.
추가 part
1. friends list에 (horizontal) scroll bar 추가하기
2. menu icon에 dropdown형식으로 [edit | delet]를 추가하기
3. mainone page에 footer navigation bar의 animation을 추가하기
- :hover시에 좌측의 '다이아몬드' icon이 한 바퀴 도는 동안 줄어들어있던 nav bar가 늘어나기
4. 전체적으로 화면 animation추가하기
5. Media Quary 넣기
어려웠던 부분
1. 선택자에 대한 공부를 좀 더 해야 할 것 같다. 어째 어째 돌아가게는 했지만 왜 문제가 있었는지 완전히 이해가 되지 않은 부분들이 있다.
2. shadow부분이 조금 어려웠다. 나만의 shadow를 만들어 보고 싶다.
3. navigation bar를 고정하는 것 fixed와 z-index를 이용하는 것이 생각보다 쉽지 않았다. 좀 더 학습이 필요했다.
앞으로의 계획
1. 현재 있는 clone coding을 마무리 짓기
2. 여러 홈페이지들을 각 예제마다 다른 방식(flex box | grid ) 방식으로 최소 10개 이상의 예제를 만들어 보기