# 학습 전 나의 상태 바닐라 JS 챌린지를 신청하고 중간에 시간이 좀 남아서 신청했던 챌린지다. HTML보다 CSS에 대해 공부하고 싶어 신청하였고, CSS를 배우는 것이 가장 큰 목표였다. # 챌린지 회고 생각보다 많은 걸 깨닫고 내가 자만했음을 깊이 반성하는 시간이었다. HTML은 정말 쉽게 생각했는데 아니었다... 내가 모르는게 많았었다.. form과 input을 함께 사용해야하는 이유, 태그에 아이디 속성 없이 클래스 속성을 통해 구분하는 방법 등 정말 많은 걸 배울 수 있는 시간이었다. 그리고 내가 가장 중요하게 생각했던 CSS.. 이 챌린지를 통해 내가 확실히 배운건 display: flex 를 어디에 써야하는지.. 그리고 position 을 활용법에 대해 확실히 알게 되었다. 이전에 파이널..

# 학습 전 나의 상태 어제까지 배운 css 등을 보면 지금까지 내가 배운.. 또는 공부한 css는 진짜 아무것도 한게 아니었구나.. 하는 생각이 들었다. 노마더 코더를 통해서 이렇게 자세하게 배울 수 있어서 좋다. 이제야 개발자 분들이 css가 가장 힘들다는 말이 왜 그런지 알 것 같다.. 그래서 더 잘 정리하고 공부가 필요할 것 같다. 무튼.. 결론은 재미있다. # 오늘의 학습 내용 Media Queris body { display: flex; height: 100vh; align-items: center; justify-content: center; } div { background-color: steelblue; width: 200px; height: 200px; } /* 스크린 너비가 최소 60..

# 학습 전 나의 상태 오늘의 두 번째 시간이다. 나눠서 올리는 이유는 이번에 할 css가 약간 심화편인 것 같아서 나누게 되었다. 이 시간 이후 과제를 제출해한다. 이런 것들이 재밌다 어떤 과제일지 마지막에 과제 결과를 올려야지 # 오늘의 학습 내용 Transitions 어떤 상태에서 다른 상태로 가는 변화를 애니메이션화 하는 것 hover 같은 state 요소가 아닌 처음 것에 있어야 한다. transition 은 state 에 따라 바뀌는 property를 가지고 있으면 사용된다. transition: (어떤 것을 변화시킬 것인지) (얼마동안 별할 것인지(시간)) ease-in-out 예제 Go Home ​ ease-in-out ease-in function 이다. 브라우저에게 애니메이션이 어떻게 ..

# 학습 전 나의 상태 어제는 position, pseudo selectors, combinators 등을 배웠다. 난 특히 pseudo selectors 를 사용하는게 조금 어렵게 느껴졌었는데 강의와 과제를 통해서 어떻게 사용하면 되는지 많이 이해했다. nth-child에 대한 두려움이 사라졌달까? ㅎㅎ 아무튼 긍정적이다. 그동안 html, css는 그래도 한 번 쭉 봤으니까 할 수 있어라고 떵떵거렸던거 같은데 이번에 코코아 클론 챌린지를 하면서 나의 부족함을 느끼게 되었고, 또 그동안 잘 알지 못했던 개념들도 다시 보니 알게되는 것들이 많은 것 같다. 기본으로 돌아가기 위해 시작한 이번 챌린지.. 그리고 바닐라JS 챌린지까지.. 정말 이 시간이 너무 소중하다 JS에 경우 더 깊이 들어가서 공부해야겠지..

# 학습 전 나의 상태 코코아 클론 챌린지 2주차가 시작되었다. 동시에 바닐라 JS 챌린지 1주차도 시작이다! 기초를 다시 잡고 싶어 시작한 챌린지들이다. 거기에 코드스테이츠에서 진행하는 커뮤니티 스테이츠 개발클럽 활동을 하면서 모던 JS(https://ko.javascript.info/)의 내용도 함께 보고 있다. 왜 처음 시작했을 땐 이 모던 JS를 참고하지 않았을까..? 하는 후회? 아쉬움? 같은 것이 든다. 그치만 이렇게라도 다시 시작하고 있으니까! 긍정긍정긍정!! 나도 취업할 수 있고, 잘 할 수 있다~ !! # 오늘의 학습 내용 position 레이아웃보다 위치를 아주 조금 옮기고 싶을 때 사용 fixed: 하면 맨 앞 레이어로 이동하고 계속 그 자리에 위차한다. top, bottom, lef..