댕구 공부공간

강의를 보며

강의를 하면서 만드는데도 자꾸만 어긋나 버리기에 border로 영역도 확인해 보고 검사도 해보고도 이상한 부분은 없었는데 문제가 발생해 너무 답답하고 힘들었다.

그러나 문제가 발생한 이유는 html안에 글을 덜 적어서 생긴 문제였다. 저런 부분이 크게 문제가 될 것이라고 생각하지 않았는데 내가 너무 안일하게 생각했다는 사실을 깨달았고 반성을 하는 계기가 되었다. 

중간배너 부분

중간 배너 부분을 확장성 있게 만들기 위해 ul을 전체로 잡아 중간에 놓고 정지는 고정을 시켜야하기에 position을 이용해 고정시켜야한다 라고 알려주어 좋았다.

완성

강의를 마치며

전체적으로 어떤 식으로 공간을 잡아야 할지 감을 익힐 수 있게 해주는 부분이었던 것 같다.

유용한 크롬 확장프로그램

크롬 확장프로그램인 image downloader라고 강의에서 추천해 준 것입니다. 이미지를 어떻게 해야할 지 몰랐었는데 이를 이용해서 웹 사이트의 이미지를 추출 가능했습니다.

메인 헤더 영역 제작

현재 강의를 보면서 웹 페이지 헤더를 제작했어요. 로고는 나와도 되는지 잘 몰라 잘랐습니다!!

강의를 보면서

웹 페이지를 만들 때 픽셀 크기와 사용되는 색상 등을 세밀하게 확인하고 들어가서 정확하게 웹 페이지를 만들 수 있었습니다. 강의를 처음 들을 때는 한 꺼번에 들어오는 내용이 많아 여러 번 돌려보며 이해하며 넘어갔습니다. 

또한 header .inb li a:hover span:after 이런 식으로 사용되는 부분이 너무 헷갈려서 css를 계속 쓰면서 익숙해져야 겠다고 느꼈습니다. 

부족한 부분 : position, after

시작일은 12월 30일이었는데..

핳.. css 끝내고 나서 강의 내용에 따른 결과물을 티스토리에 올리기로 했는데... 그만 블로그에 내용 올리는 걸 깜빡해 버렸습니다. 그래서 지금 올려요... 몇 개가 줄줄이 올라갈 것 같네요.. 

오리엔테이션

css등장 이전의 어떤 상황이었는지 왜 css가 나와야 했는지 실습을 통해 보여주어 이해하기 더 좋았다

font tag - 글자의 스타일을 바꿔주는 태그

css의 등장

내가 쓰는 언어를 왜 사용해야 하는지 한 번쯤 생각해야할 부분을 이 강의를 통해 다시 한번 생각하게 되었다.

css는 위의 font tag를 대신함.

css는 왜 사용하나?

font tag를 사용했을 경우

1. 수작업으로 고쳐야 함

2. 코드작성자의 의도와는 다르게 수정될 가능성 농후

css를 사용했을 경우

1. 한 번에 고치는 것이 가능해짐,

2. 같은 성격의 것을 묶어 스타일을 입히기에 의도와 다르게 수정될 가능성↓ 

css 효과

1. 웹페이지 유지보수 편리

2. 가독성 증가

박스모델

박스모델을 만들기 위한 기본적인 개념에 대해서 알려준다. 

그리드

그리드를 어떻게 사용하는지에 대해 알게 된 듯 하다

그리고 css를 얼마나 채택하고 있는지 통계를 내주는 아주 유용한 사이트를 소개 받았다

caniuse.com/

미디어 쿼리

반응형 웹에 대한 내용을 배우긴 했지만 직접 만들 때 많은 어려움을 겪었던 부분이었는데 이 강의를 보면서 감 잡기에 유용했다.

정리

전체적으로 기본적인 부분을 다루고 있어 쉽게 넘어갔다. css를 사용하기 위해 어떻게 해야하는지 틀을 잡아주는 강의라고 많이 느꼈다. 

web1은 현재 빠르게 끝냈고 다음으로 web2를 시작할 것이다.

스터디를 시작했고 현재 계획은 web2를 빠르게 끝내고 리액트로 넘어갈 수 있게 하는것입니다.