나혼자 하는 코딩독학서, 코딩-레벨-업

'코딩-레벨-업(입문-봄)' 책 교재를 보면서 공부합니다. 추가 보강영상으로 복습 및 예습을 진행합니다.

클래스 소개
난이도
쉬움
카테고리
웹 프로그래밍 - 프로그래밍
태그
자바스크립트, CSS, HTML, DOM
소요 시간
약 7시간 28분
추천 학습대상
- 프론트엔드 코딩이 처음이신 분
- HTML,CSS,Javascript를 처음 배우시는 분
- 개념부터 이해하며 실습을 통해 배우고 싶으신 분


하하하... 조금 오그라들죠...? 첫 소개를 웹툰처럼 해보고 싶었어요!! ^^










[코딩-레벨-업]은 제가 아는 것들을 천천히 풀어보듯이 만들었습니다. 


제가 공부했던 방식 이기도 하구요, 누군가에게는 저의 방식이 도움이 되지 않을까 하는 마음에 만들게 되었습니다. 

온, 오프라인으로 많은시간 학생들을 가르치면서 배우는 순서가 얼마나 중요한지도 알게되었습니다. 


입문으로 '봄-여름-가을-겨울' 총 4개의 시리즈로 담을 예정입니다. 







입문자분들이 어려워할 1, 2장은 영상에서 교재의 내용을 차례대로 수행하는 것을 강의합니다. 

3장부터는 교재를 풀기 전,후에 보시면 좋을 추가보강 영상입니다.

책에서 예제를 한번 해보고, 영상을 보면서 다른 예제도 연습해 보실 수 있습니다.


중간중간 MISSION을 세 개의 챕터로 나누어 제공합니다.

"따라하기 미션" 또는 "풀기 미션"이 있습니다.


★ 예제소스 다운로드 주소 




👻 코딩고스트에서 만든 프론트엔드 코딩 기초 입문서 중 '봄' 시리즈가 포함되어있는 강좌입니다. 





VScode 설치부터, 웹브라우저와 웹문서에 대한 이해부터 시작하여 HTML,CSS,Javascript를 천천히 시작해 봅니다. 



모두 오늘도 즐~코하세요!





교육 과정
모두 펼치기
  • 01
    시작하기
  • Cover
    인사말 및 목차
  • 02
    01 - 개발환경세팅
  • 교재 - 개발환경 세팅
    개발환경 준비 영상보기
  • 03
    02 - HTML,CSS,JavaScript 개념익히기
  • 교재 - Html,Css,JS 개념익히기!
    프로젝트 시작하기
    프로젝트 폴더구조 만들기
    웹브라우저/웹문서 이해하기
    HTML 문서 만들어보기
    CSS 스타일링 해보기
    Javascript로 동적인 효과 적용해보기
  • 04
    03 - 처음만들어보는 웹페이지
  • 교재 - 처음만드는 웹페이지
    CSS box-model 연습하기 1
    CSS box-model 연습하기 2
    JS로 DOM 다루기 1
    JS로 DOM 다루기 2
    JS로 DOM 다루기 3
    JS로 DOM 다루기 4
    JS로 DOM 다루기 5
    JS로 DOM 다루기 6
  • 05
    MISSION 01
  • 교재
    01 - 크기,여백,정렬 연습
    02 - 모서리 둥글기 연습
    03 - 프로필 이미지 만들기(따라하며 익히기)
  • 06
    04 - My Album 만들기
  • 교재 - My Album 만들기
    레이아웃 연습하기 1
    레이아웃 연습하기 2
    레이아웃 연습하기 3
  • 07
    MISSION 02
  • 교재
    04 - 버튼 및 :hover 스타일링
    05 - 포털사이트 버튼 따라해보기
  • 08
    05 - 카드형 레이아웃 만들기
  • 교재 - 카드형 레이아웃 만들기
    Font, WebFont - 1
    Font, WebFont -2
    Font, WebFont -3
    px, em, rem - 1
    px, em, rem - 2
  • 09
    MISSION 03
  • 교재
    06 - Flex-box 연습하기
    07 - Naver 네비게이션 따라하기
    08 - Naver 광고영역 따라하기
  • 10
    06 - OTT 사이트 따라해보기!
  • 교재 - OTT 사이트 만들기
    Class 속성 다중으로 지정하기
    JS로 Class 제어하기
    시맨틱태그로 이해하기
    목록태그 UL 이해 및 활용법
    Overflow 속성 알아보기, 프로필, 스크롤 영역 만들기~!
    CSS Transform 속성과 Transition 사용하기
    CSS Position 이해하기
  • 11
    Last Mission
  • 예제완성파일 및 마지막 미션시작
    인사 및 마지막예제 part2(넷플릭스 컨텐츠 부분 따라해보기)
  • 12
    미션해설 및 부록
  • 미션해설노트
    부록
    마지막장
마지막 업데이트|2025년 03월 10일
강의자 소개
안녕하세요. 저는 프로덕트 디자인과 코딩을 같이 하고 있는 1인 기업 프리랜서 입니다. 수많은 웹서비스와 하이브리드 앱, 네이티브 앱을 기획부터 런칭까지 하였습니다. 몇년전 제주에 와서 터를 잡으며, 그동안 쉼없이 달려온 저에게 잠시 쉼을 주고, 그동안 온/오프라인으로 강의했던 것들과 쌓아온 지식들을 하나하나 발자취를 남기고 있습니다. 강의를 만들면서, 천천히.. 쉬웠으면 좋겠다. '아, 이거 할만하네?'라는 생각이 들게 하는 것을 항상 잊지않으려고 합니다. 또한, 예제를 만들어보면서 성취감을 느껴보게 하는 것 또한 저의 계획의 일부입니다 ^^:: 우리 오늘도 한줄 더 코딩하고 잠자리에 듭시다. 여러분, 응원합니다~! 2025 나혼자 하는 코딩독학서, '코딩-레벨-업' 저자 유튜브 '코딩고스트'와 프리랜서 인스타툰 '이랑이'를 운영하고 있습니다.(하단 링크 참조)

강좌 후기
18,900
17,010
(10%)

평균평점
0.0
난이도
쉬움
수강기간
평생 무제한
소요 시간
약 7시간 28분