본문 바로가기

개발 기록/개발 로그

Ep 3. HTML / CSS 입문 30일 챌린지(마무리) - 독학 개발 공부

유튜브 영상: 링크

HTML / CSS 입문을 위한 30일 챌린지를 진행하였고, 진행하면서 배웠던 점과 내용들을 공유를 해볼게요 :)

HTML / CSS 30일 챌린지를 통해서 배운 점

  1. HTML / CSS를 활용하여 웹 페이지를 만들 수 있다.
  2. 정말 어설프게 알고 있던 HTML/CSS 지식을 학습할 수 있었다. (e.x, block 태그, inline 태그의 특징 / 이미지는 지정하지 않을 시 원본 크기 / width와 height 기준 등등)
  3. 기준이 생겼기에 모르는 내용은 찾아서 학습을 할 수 있다. 
  4. 자연스럽게 생긴 HTML / CSS의 자신감

연습 페이지 (결과물)

2주 차에서 만든 링크트리 보다 난이도를 올렸습니다. MDN을 통해서 개념정리를 하고 3개의 웹 페이지를 더 만들면서 연습을 해봤는데요. 만들어 본 페이지는 다음과 같습니다 :)

 

  1. 랜딩페이지
  2. 구글
  3. 당근 마켓

역시나 직접 만들어 봐야 이해가 더 잘 되고 내 실력이 늘고 있는 모습을 볼 수 있습니다.

우리 모두는 지식을 쌓고 직접 활용을 해보셔야 돼요!!

만들면서 하나씩 하나씩 만드는 재미도 있고, 다 만들고 나면 이 뿌듯함도 격하게 느끼실 수 있어요 😀

구글 페이지는 다 만들고 나서도 실제하고 비슷해서 깜빡 속았답니다 ㅠ.ㅠ

직접 만들어 본 사이트

독학으로 진행했던 HTML / CSS 챌린지 진행 방법

  1. MDN 문서를 통해서 HTML / CSS 내용을 익힌다. 이때 직접 타이핑을 하고 여러 실험을 해본다.
  2. 전반적인 기본기를 다졌으니 쉬워 보이고 내가 만들어 볼만한 사이트를 고른다.
  3. 개발자 도구를 열어서 구조 분석을 하면서 직접 사이트를 클론 하며 경험치를 쌓는다.

개념 학습만 했다고 원하시는 사이트를 바로 만드실 수 없어요. 웹 페이지 제작을 하기 위한 경험치가 부족하기 때문입니다. 그런 이유로 유명한 사이트나, 만들어 볼만한 사이트를 선택하여 직접 만들어 보시면서 경험치를 쌓으셔야겠습니다.

 

프런트까지 개발하는 풀스택을 원한다?

HTML / CSS를 직접 활용하고 싶다?

HTML / CSS 책을 여러 권 봤는데도 감이 안 잡힌다?

-> 반드시 MDN 문서를 읽어 보며 학습을 할 것!!!

 

MDN 문서: 링크

온라인 강의: 링크

MDN 문서를 읽으면서 독학이 어려우시다면, 강의도 수강을 해보실 수 있어요!! 문서의 내용이 너무 좋아서 강의도 제작을 하였습니다. 참고해 주세요 :)