Thumbnail
BEST
개발 · 프로그래밍 풀스택

풀스택을 위한 탄탄한 프런트엔드 부트캠프 (HTML, CSS, 바닐라 자바스크립트 + ES6) [풀스택 Part2] 대시보드

(4.9)
149개의 수강평 ∙  2,327명의 수강생
82,500원

월 16,500원

5개월 할부 시
지식공유자: 잔재미코딩 DaveLee
총 78개 수업 (20시간 35분)
수강기한: 
무제한
수료증: 발급
난이도: 
입문
-
초급
-
중급이상
지식공유자 답변이 제공되는 강의입니다
폴더에 추가 공유

입문자를 위해 준비한
[프론트엔드, 웹 개발] 강의입니다.

현업에서 실제 웹서비스를 개발한 경험을 기반으로, 입문자를 위한 실제 상용화도 가능한 수준의 웹과 앱서비스를 개발하는 것을 목표로 하는 풀스택 시리즈 강의입니다. 이를 위한 Part2 강의로 다양한 기술이 존재하는 프런트엔드 기술에서 반응형, 호환성까지 고려한 최신 HTML5, CSS3, 바닐라 자바스크립트 (Javascript) + ES6 를 모두 견고하게 싹 정리하는 강의입니다.

✍️
이런 걸
배워요!
쉽고 견고하게 프런트엔드 기본기 쌓기
반응형, 크로스 브라우징 웹서비스 개발
상세한 모던 HTML 과 CSS 기능
호환성까지 고려한 VanillaJS (Javascript)
최신 상용화 서비스 개발을 위한 HTML/CSS/JS+ES6 풀세트

네카라쿠배도 사내 강의로 선택하는 공식 강의! 
입문자를 위한 프런트엔드 웹기술 기본기를 다져줄 
완성도 높은 강의 시리즈 (풀스택 Part2)

본 강의는 풀스택 강의 시리즈 Part2 강의로 파이썬 백엔드 (Part1) 강의에 이어서, 풀스택을 위한 탄탄한 프론트엔드 기본을 익히는 강의입니다. 상용화도 가능한 웹서비스 개발을 위한 HTML5, CSS, Javascript (VanillaJS, 바닐라 자바스크립트) + ES6 을 상세히 정리하고 익히는 강의입니다.

일반적인 IT 강의보다는 최대한 수강자 입장을 고민해서 만든 특별한 강의입니다. 다양한 자료, 다양한 예제로 관련 기술을 모른 상태부터 시작해서, 관련 기술을 내 이력서에 기재할 수 있을 정도로 핵심적인 기술을 견고하게 익히는 강의입니다

본 강의는 지금까지 많은 분들께서 익히고, 좋은 의견을 주고 계신 검증된 강의입니다.
혹시라도 이슈가 있으면, 지금처럼 이후에도 수시로 업데이트될 수 있습니다.

프론트엔드 기본기를 제대로 쌓고자 한다면?
프론트엔드 기본 기술을 탄탄히 정리해야 합니다. 프론트엔드 기본은 HTML, CSS, Javascript 입니다. React 를 익히더라도, 프론트엔드 기본이 필요합니다. 탄탄한 프론트엔드 기본기가 핵심입니다. 꼼꼼하게 잘 쌓은 기본기 위에, React 든 Flutter 든 익히면 프론트엔드를 원하는대로 만들 수 있습니다. 여기에 최신 웹페이지는 반응형, 호환성등 정리해야할 배경지식과 관련 지식이 있고, 오래전 기술인 Jquery 를 깔끔한 Javascript 로 대체해야 합니다.

본 강의는 HTML, CSS, Javascript, 반응형, 호환성, ES6 등

꼭 알아야 할 흩어진 프론트엔드 기본 기술을 꼼꼼히 다룹니다!
대충 알고는 있는데 정리가 안되는 것 같아요

HTML, CSS, Javascript 대충은 쓸 것 같은데, 실제로 써보면 원하는대로 다루기 어렵습니다. 반응형, 호환성, ES6 등 흩어져 있는 수많은 문법과 기술, 특히나 프론트엔드는 한번 잘 정리하지 않고서는 생각보다 어렵습니다.

풀스택이 되면 웹서비스를 혼자서도 만들 수 있다던데...

웹이든 앱이든 최근 서비스는 구현을 위해, 백엔드, 프론트엔드, 배포 기술이 필요합니다. 이를 풀스택이라고 합니다. 풀스택이 되면 혼자서도 최신 웹서비스를 만들 수 있고, 경쟁력 있는 개발자도 되실 수 있습니다.

이를 가장 효과적으로 실질적으로 진행하려면, 풀스택 강의 Part1 에서 파이썬과 백엔드 기술을 익히고, Part2 에서 프런트엔드 기본기를 닦아야 합니다. 기본기가 잘 갖춰져야! 단순히 강의에서 나온 웹서비스를 그대로 따라 치는 것이 아니라, 제대로 풀스택이 될 수 있습니다. 본 강의는 프런트엔드 기본기를 탄탄히 갖출 수 있도록, HTML5, CSS, Javascript (바닐라 자바스크립트, VanillaJS) + ES6 를 상세히 다릅니다.

전체 가장 빠른 최신 풀스택 로드맵을 유투브 영상으로 요약하여 만들었습니다. 해당 영상을 참고하시면, 본 기술을 넘어서, 혼자서도 짧은 시간에 웹/앱 개발을 할 수 있는 로드맵도 이해하실 수 있습니다.

 

탄탄하고 실질적인 프런트엔드 기본기를 위해 만들었습니다.

수없이 많은 문법과 기능들로, 프런트엔드의 출발은 정리라는 키워드부터 시작해야 합니다.
그 많고 다양한 문법과 지식을 다음과 같은 조건 하에 정리하였습니다.

  • 최신 웹사이트 개발을 위한 배경지식은 싹 정리하고
  • 그럴듯한 웹페이지를 위해 꼭 필요한 CSS 를 꼼꼼히 정리하고
  • 최신 웹페이지에서는 쓰지 않는 Jquery 는 다루지 않고
  • 모두 표준 Vanila Javascript + ES6 로 대체해 다루고
  • 반응형을 지원하고
  • 호환성까지 고려합니다

HTML 태그는 가볍게 시멘틱 태그까지 꼭 필요한 태그만을 중심으로 정리하고, 
그럴듯한 웹페이지 구현에 꼭 필요한 반응형, 호환성까지 고려해 상세한 CSS 기능을 다루고, 
VanillaJS (바닐라 자바스크립트) 라고 불리우 듯이, 최근 트렌드는 jQuery 를 사용하지 않으므로, 호환성까지 고려한 Javascript + ES6 문법만으로 웹페이지를 구현합니다. 
각 기능별로, 호환성 이슈로 쓸 수 없는 극최신 문법, 대체 가능한 기술은 제외하고, 핵심 기술에 집중합니다.

시간을 낭비하지 마세요!
우리는 정보가 없어서 못하는 것이 아닙니다!
검증된 강의로 익히면, 빠르게 정리할 수 있습니다!

Javascript만 배우면 되지 않나요?

풀스택 개발에 있어 가장 큰 병목점은 CSS입니다. HTML, CSS는 중학생도 안다고 이야기합니다.
그러나 웬만한 프런트엔드 개발자가 아니고서는 반응형, 호환성 그리고 그럴듯한 최신 웹페이지를 만들 수는 없습니다.
수없이 많은 세부적인 CSS 기능을 정리해야 합니다. HTML도 표준에 맞춰서 한번은 정리해야 합니다.
또 국내에는 퍼블리셔라는 직업이 있지만, 국외에는 프런트엔드 또는 풀스택 개발자가 CSS까지 모두 다룹니다.
경쟁력 있는 프런트엔드/풀스택 개발자가 되기 위해, 상세히 CSS 기능을 정리하는 것은 필수입니다.

 
React, Vue를 익혀야 웹서비스를 만들 수 있지 않나요?

해당 프레임워크는 Javascript의 아쉬운 점을 개선해서, Javascript로 작성된 프레임워크입니다. 해당 프레임워크들을 쓸 때에도 Javascript를 쓰기 때문에, 어떤 프레임워크라도 Javascript 기본 문법을 잘 정리해서 익혀놓아야 합니다. 매년 달라지는 프레임워크 속에서 빠르게 새로운 기술을 익히고 활용하려면, Javascript 기본기가 잘 갖춰져야 합니다.
그래서 본 강의는 프런트엔드 기본기에 집중하는 강의입니다. 본 강의는 탄탄한 기본기를 쌓기 위해, 관련 기술중 꼭 필요한 기술을 싹 정리하고 연습합니다. 추후 이를 기반으로 이후 강의에서 최신 트렌드에 맞춘 프레임워크도 다룹니다.

 

입문자도 할 수 있을까요?

입문자도 들으실 수 있도록, 상세히 차근차근 설명드리는 강의입니다.
IT강의에서 가장 어려운 강의는 프로그래밍을 전혀 모르는 분들께 프로그래밍을 가르치는 것입니다. 이런 분들도 제가 오픈한 파이썬입문과 크롤링기초 부트캠프 강의를 통해 프로그래밍뿐만 아니라 크롤링 기술을 익히셨습니다. 합리적이고 서로 배려할 수 있는 분들이라면, 충분히 가능합니다.

프런트엔드 기술만 빨리 정리하고 싶으시다면, 본 강의만을 수강하셔도 좋습니다. 다만, 프로그래밍을 한번도 다뤄보지 않은 완전 입문자시라면, 파이썬입문과 크롤링 부트캠프 강의와 함께 풀스택 강의를 로드맵을 통해, 차근차근 익혀보시기를 추천드립니다. 보다 차근차근 필요한 역량을 쌓으실 수 있습니다.

입문자도 이해할 수 있도록
간결하면서도, 꼼꼼히 작성된 자료를 기반으로,
강의 중, 각자 테스트도 해볼 수 있도록
기능별 샘플코드와 테스트까지 바로 하실 수 있습니다

• 각 기능별 샘플코드를 프로젝트로 작성하여 제공해드리며, 실전 웹페이지 코드파일을 제공해드립니다.
• 강의 자료는 온라인에서 언제든 확인하실 수 있도록 제공해드립니다. (단, 복사 및 다운로드는 저작권 이슈로 제한하였습니다.)

 

체계적으로 익힐 수 있을까요?

입문자에서 시작해서, 풀스택이 되기까지 전 과정을 조금씩 난이도를 높여가며, 상세하고, 체계적으로 익힐 수 있도록 강의를 만들고 있습니다. 해당 문법과 지식 이해를 돕기 위해, 간결한 코드와 충분한 설명을 하되, 이해가 필요한 부분은 그때그때 컴퓨터 공학까지 설명드려서, 좋은 개발자가 될 수 있는 기본기를 닦으실 수 있습니다.

본 강의는 전체 풀스택 강의 시리즈 Part2로, 본 강의 안에서는 다음 서비스 개발을 위한 특정 웹페이지를 선택하여 어떤 프레임워크와 라이브러리도 쓰지 않고, 빈 파일부터 시작하여 HTML, CSS, Javascript + ES6 를 사용해서 한땀한땀 코드 완성까지 함께 해봅니다.

'아! 진짜 다르구나!' 라고 느낄 수 있도록
고민해서 만드는 강의입니다
그대로만 따라오시면, 됩니다!


IT 를 잘하려면, 체계적으로 익히세요

IT 기술은 연계되어 있고, 기술을 연결하였을 때, 비로소 그럴듯한 서비스나, 데이터 과학 기술이 가능합니다.
연결된 기술 전반을 난이도를 차근차근 올리며, 핵심을 익히시면, 짧은 시간에 효율적으로 깊이있게 익힐 수 있고,
시스템과 데이터 전반이 드디어 이해가 되고, 각 기술에 대한 이해의 깊이도 달라집니다.

이러한 깊이와 눈을 가지면, 비로소 개발자와 데이터 커리어에서 경쟁력을 갖츨 수 있고, 시니어 레벨도 가능합니다.

이를 위해 각 분야의 핵심 기술을 짧은 시간에 정리할 수 있는 로드맵을 만들고 있습니다.

잔재미코딩 개발자, 데이터 분석가/과학자 커리어 로드맵
입문자부터 쉽게 시작해서, 난이도를 조금씩 올리며,
짧은 시간에 웹/앱 전과정과 데이터분석+AI까지 탄탄한 기본기를 쌓을 수 있는 로드맵입니다

데이터 분석/과학 코스: 데이터 분석가/과학자를 위한 탄탄한 기본기 쌓기 

익히는 순서에 따라 번호를 붙여 놓았습니다.

  1. 파이썬 입문과 데이터 수집(크롤링) 기본 [파이썬, 웹, 데이터 이해 기본까지]
  2. 처음하는 SQL과 데이터베이스(MySQL) 부트캠프 [입문부터 활용까지]
  3. 처음하는 MongoDB(몽고DB) 와 NoSQL 데이터베이스 부트캠프 [입문부터 활용까지]
  4. 처음하는 파이썬 데이터 분석 (데이터 전처리와 pandas, 최신 시각화) [데이터과학 Part1]
  5. 처음하는 파이썬 머신러닝 부트캠프 (쉽게! 실제 문제로 개념/활용 익히기) [데이터과학 Part2]
  6. 처음하는 딥러닝과 파이토치 부트캠프 [데이터과학 Part3]

* 현재까지의 데이터 과학 강의 패키지를 할인된 가격으로도 제공합니다 (할인율은 곧 축소 예정입니다)
[입문~초급] 취업을 위한 데이터 과학 기본 기술 쉽게! 꼼꼼하게 익히기  (바로가기)

 

풀스택 코스: 혼자서도 그럴듯한 웹/앱 개발을 위한 탄탄한 기본기 쌓기

익히는 순서에 따라 번호를 붙여 놓았습니다.

  1. 파이썬 입문과 데이터 수집(크롤링) 기본 [파이썬, 웹, 데이터 이해 기본까지]
  2. 처음하는 SQL과 데이터베이스(MySQL) 부트캠프 [입문부터 활용까지]
  3. 처음하는 MongoDB(몽고DB) 와 NoSQL 데이터베이스 부트캠프 [입문부터 활용까지]
  4. 가장 빠른 풀스택: 파이썬 백엔드와 웹기술 기본 [풀스택 Part1-1]
  5.  가장 빠른 풀스택: 파이썬 백엔드 FastAPI 부트캠프 [풀스택 Part1-2]
  6. 견고하게 익히는 프론트엔드 기본: javascript (Vanilla JS와 ES6+) 와 최신 웹기술 [풀스택 Part2]
  7. 도커와 최신 서버 기술(리눅스, nginx, AWS, HTTPS, flask 배포) [풀스택 Part3]
  8. 처음하는 풀스택을 위한 Flutter 부트캠프 [풀스택 Part4]

* 현재까지의 풀스택 강의 패키지를 할인된 가격으로도 제공합니다. (할인율은 곧 축소 예정입니다.)
[입문~중급] 가장 쉽고, 가장 최신 기술로 익히는 풀스택 로드맵 (바로가기)

이런 분들께 추천드려요!

🎓
학습 대상은
누구일까요?
풀스택 개발을 위한 Part2 강의
프런트엔드 기본기를 쌓고자 하시는 분
최신 상용화도 가능한 웹서비스를 개발하고자 하시는 분
반응형, 호환성등 다양한 프런트엔드 기술 정리가 필요하신 분
프런트엔드 입문
📚
선수 지식,
필요할까요?
가능하다면, 풀스택 Part1 강의와 병행 수강을 강추드립니다.

안녕하세요
잔재미코딩 DaveLee 입니다.
잔재미코딩 DaveLee의 썸네일

잔재미코딩, Dave Lee

  • About 잔재미코딩 소개 블로그 [클릭]

  • 주요 경력: 쿠팡 수석 개발 매니저/Principle Product Manager, 삼성전자 개발 매니저 (경력 약 15년)

  • 학력: 고려대 일어일문 / 연세대 컴퓨터공학 석사 (완전 짬뽕)

  • 주요 개발 이력: 삼성페이, 이커머스 검색 서비스, RTOS 컴파일러, Linux Kernel Patch for NAS

  • 저서: 리눅스 커널 프로그래밍, 리눅스 운영 체제의 이해와 개발, 누구나 쓱 읽고 싹 이해하는 IT 핵심 기술, 왕초보를 위한 파이썬 프로그래밍 입문서

  • 운영 사이트: 잔재미코딩 (http://www.fun-coding.org) [클릭]

  • 풀스택/데이터과학 관련 무료 자료를 공유하는 사이트입니다.

  • 기타: 잔재미코딩 유투브 채널 [클릭] 

    • IT 학습에 도움이 되는 팁/ 짧은 무료 강의를 공유하고자, 조금씩 시작하고 있습니다~

최신 현업과 IT 강의를 병행하며, 8년째 꾸준히 견고한 풀스택과 데이터과학 강의를 만들고 있습니다.

 

커리큘럼 총 78 개 ˙ 20시간 35분의 수업
이 강의는 영상, 수업 노트, 첨부 파일이 제공됩니다. 미리보기를 통해 콘텐츠를 확인해보세요.
섹션 0. 강의 준비
모던 프런트엔드 부트캠프 강의 소개 미리보기 05:02 강의전 꼭 들어주세요! 미리보기 18:21 수업 진행 과정과 수업 준비 미리보기 14:18
수업 자료 권한 신청 방법과 활용 팁 (실전 코드 자료 본 챕터에서 바로 다운로드해주세요!) 04:42
학습 효과를 높일 수 있는 꿀팁과 공유사항 18:32
섹션 1. 모던 웹 기본 기술 이해
웹 기본 기술 이해와 정리 미리보기 18:38
모던 HTML 기능과 배경지식 이해 11:01
HTML5 기본 템플릿 코드 이해 19:37
HTML5 주요 태그 이해와 정리1 19:12
HTML5 주요 태그 이해와 정리2 17:32
모던 웹을 위한 웹접근성, 크로스 브라우징, 이미지 포맷 이해 18:24
섹션 2. 모던 웹의 핵심 상세한 CSS 기본
모던 웹을 위한 모던 CSS 배경 지식 이해 미리보기 14:28
모던 웹을 위한 모던 CSS 단위 이해 및 정리 21:29
모던 웹을 위한 상세한 모던 CSS Selector 정리1 22:15
모던 웹을 위한 상세한 모던 CSS Selector 정리2 16:57
모던 웹을 위한 상세한 모던 CSS Selector 정리3 21:25
섹션 3. 모던 웹의 핵심 상세한 CSS 기본 프로퍼티
모던 웹을 위한 CSS 박스모델 이해1 16:38
모던 웹을 위한 CSS 박스모델 이해2 21:02
모던 웹을 위한 상세한 CSS background 이해1 15:40
모던 웹을 위한 상세한 CSS background 이해2 08:37
모던 웹을 위한 상세한 CSS block과 inline 이해 17:39
모던 웹을 위한 상세한 CSS font 이해1 18:59
모던 웹을 위한 상세한 CSS font 이해2 11:35
섹션 4. 모던 웹의 핵심 상세한 CSS 배치와 애니메이션
모던 웹을 위한 상세한 CSS position 이해 13:05
모던 웹을 위한 상세한 CSS transition 이해 10:27
모던 웹을 위한 상세한 CSS animation 이해 09:56
모던 웹을 위한 상세한 CSS transform 이해 11:33
모던 웹을 위한 상세한 CSS float 이해 20:02
섹션 5. 모던 웹의 핵심 중급 CSS와 반응형 기능
모던 웹을 위한 상세한 CSS 상속 이해 18:44
모던 웹을 위한 상세한 반응형 배경지식 이해 15:18
모던 웹을 위한 상세한 CSS 미디어 쿼리 이해 13:47
섹션 6. 모던 웹과 레이아웃 핵심 CSS flexbox
모던 웹을 위한 상세한 CSS flexbox 이해1 18:14
모던 웹을 위한 상세한 CSS flexbox 이해2 17:08
모던 웹을 위한 상세한 CSS flexbox 이해3 21:07
섹션 7. 모던 HTML/CSS 로 상용화도 가능한 모던 웹페이지 만들어보기
모던 HTML/CSS 로 상용화도 가능한 반응형 모던 웹페이지 만들기1 14:11
모던 HTML/CSS 로 상용화도 가능한 반응형 모던 웹페이지 만들기2 19:16
모던 HTML/CSS 로 상용화도 가능한 반응형 모던 웹페이지 만들기3 18:53
모던 HTML/CSS 로 상용화도 가능한 반응형 모던 웹페이지 만들기4 10:38
모던 HTML/CSS 로 상용화도 가능한 반응형 모던 웹페이지 만들기5 15:45
모던 HTML/CSS 로 상용화도 가능한 반응형 모던 웹페이지 만들기6 20:54
모던 HTML/CSS 로 상용화도 가능한 반응형 모던 웹페이지 만들기7 10:41
모던 HTML/CSS 로 상용화도 가능한 반응형 모던 웹페이지 만들기8 14:05
모던 HTML/CSS 로 상용화도 가능한 반응형 모던 웹페이지 만들기9 12:36
모던 HTML/CSS 로 상용화도 가능한 반응형 모던 웹페이지 만들기10 09:00
모던 HTML/CSS 로 상용화도 가능한 반응형 모던 웹페이지 만들기11 12:22
섹션 8. 모던 웹을 위한 최신 Javascript (VanillaJS) 기본 지식과 변수/조건문
모던 웹을 위한 최신 Javascript / VanillaJS / ES6 이해 12:10
모던 웹을 위한 최신 Javascript 문법 이해를 위한 기본 지식과 준비 19:39
모던 웹을 위한 최신 Javascript 변수와 데이터 타입 이해 20:50
모던 웹을 위한 최신 Javascript 데이터 타입 변환과 조건문 이해 21:58
섹션 9. 모던 웹을 위한 최신 Javascript (VanillaJS) 함수와 객체
모던 웹을 위한 다양한 Javascript+ES6 함수 선언 기법 이해 12:38
모던 웹을 위한 다양한 Javascript+ES6 객체 선언 기법 이해1 19:40
모던 웹을 위한 다양한 Javascript+ES6 객체 선언 기법 이해2 20:44
모던 웹을 위한 다양한 Javascript+ES6 객체 선언 기법 이해3 20:09
섹션 10. 모던 웹을 위한 최신 Javascript (VanillaJS) 반복문/배열
모던 웹을 위한 다양한 Javascript+ES6 반복문 이해1 13:52
모던 웹을 위한 다양한 Javascript+ES6 반복문 이해2 13:21
모던 웹을 위한 다양한 Javascript+ES6 배열 문법 이해1 17:16
모던 웹을 위한 다양한 Javascript+ES6 배열 문법 이해2 18:41
섹션 11. 모던 웹을 위한 최신 Javascript (VanillaJS) 중급
모던 웹을 위한 다양한 Javascript+ES6 추가 문법 이해1 21:29
모던 웹을 위한 다양한 Javascript+ES6 추가 문법 이해2 16:23
모던 웹을 위한 Javascript+ES6 호이스팅 이슈와 해결방법 이해 13:33
모던 웹을 위한 Javascript+ES6 스코프 이해 12:40
모던 웹을 위한 Javascript 동기 / 비동기 처리 이해 16:25
모던 웹을 위한 Javascript+ES6 비동기 처리를 위한 Promise 이해1 18:34
모던 웹을 위한 Javascript+ES6 비동기 처리를 위한 Promise 이해2 16:43
섹션 12. 모던 웹 제어를 위한 최신 Javascript (VanillaJS)
모던 웹을 위한 Javascript(VanillaJS) 와 DOM / BOM 이해 19:05
모던 웹을 제어하기 위한 Javascript(VanillaJS) DOM CRUD 이해1 19:55
모던 웹을 제어하기 위한 Javascript(VanillaJS) DOM CRUD 이해2 15:29
모던 웹을 제어하기 위한 Javascript(VanillaJS) 이벤트 처리 이해 12:55
섹션 13. 모던 프런트엔드 기술로 상용화도 가능한 모던 웹페이지 만들기
모던 HTML/CSS/VanillaJS+ES6 로 상용화도 가능한 반응형 모던 웹페이지 만들기1 14:47
모던 HTML/CSS/VanillaJS+ES6 로 상용화도 가능한 반응형 모던 웹페이지 만들기2 14:39
모던 HTML/CSS/VanillaJS+ES6 로 상용화도 가능한 반응형 모던 웹페이지 만들기3 17:23
모던 HTML/CSS/VanillaJS+ES6 로 상용화도 가능한 반응형 모던 웹페이지 만들기4 18:31
모던 HTML/CSS/VanillaJS+ES6 로 상용화도 가능한 반응형 모던 웹페이지 만들기5 08:37
모던 HTML/CSS/VanillaJS+ES6 로 상용화도 가능한 반응형 모던 웹페이지 만들기6 12:25
섹션 14. 강의 마무리와 추가로 참고하면 좋을 기능 구현
추가로 참고할만한 반응형 모던 웹페이지 기능1 11:33
추가로 참고할만한 반응형 모던 웹페이지 기능2 18:29
추가로 참고할만한 반응형 모던 웹페이지 기능3 06:30
백엔드와 프런트엔드 통신 기능 구현과 마무리 18:36
강의 게시일 : 2020년 12월 16일 (마지막 업데이트일 : 2023년 07월 19일)
수강평 총 149개
수강생분들이 직접 작성하신 수강평입니다.
4.9
149개의 수강평
5점
4점
3점
2점
1점
VIEW 추천 순 최신 순 높은 평점 순 낮은 평점 순 평점 순 높은 평점 순 낮은 평점 순
MIKE.aeon thumbnail
5
안녕하세요. 웹 관련 개발에 관심이 있어서 여기저기에서 강의 듣다가 정착한 강좌가 잔재미코딩님 강좌입니다. 웹 관련 기술이 관련 분야도 많고 배워야 할 부분도 다양해서 제대로 하려면 할 것이 너무 많아서 그동안 조급한 마음에 여기저기 강좌를 듣는 등 어려움이 많았습니다. 강좌를 들으면서 특히 좋았던 부분은 내가 배운 걸 어떻게 사용할 수 있고, 다음 단계로 넘어갈 때 내가 뭘 배워야 하는지 등, 풀스택으로 가는 중심을 잡을 수 있어서 개인적으로 도움이 많이 되었습니다. 파트1에서는 서버쪽에 관한 기술에 조금 더 집중했다면 파트2에서는 UI단의 다양한 기술을 배울 수 있어서 좋습니다. 화려하지 않아서 실망할 분들도 있겠지만, 화려한 기술들은 기본이 잘되어 있으면 금방 배울 수 있다고 생각합니다. HTML/CSS에 대한 깊이도 충분히 깊게 알려주셔서, CSS로 구현하지 못한 부분을 자바스크립트로 커버하려고 여러가지 꼼수나 프레임워크를 사용하지 않아도 되어서 좋았습니다. 웹기술이 다양하다보니, 약한 부분을 다른 기술이나 프레임워크로 매우는 경우가 종종 생길수 있다고 생각하는데, 기본에 집중한 설명과 실습이 있어서 좋았습니다. 자바스크립트도 필요한 부분을 간결하게 설명을 해주셔서 이해가는데 도움이 되었습니다. 물론 개인적으로 추가로 더 공부가 필요하지만 실습과 연계되니 기억하는데, 도움이 되었습니다. 강의에서 구현한 실습이 작아서 현직자 같은 경험이 적을수는 있지만, 기본적인 기능에 대한 구현 방법이나 아이디어를 얻을수 있어서 좋았습니다. 상반기에 오픈 예정인 Vue도 기대하겠습니다. 바닐라 JS로 구현하는 부분을 Vue로 사용하면 어떻게 편하게 구현할 수 있는지 비교하는 방식으로 강의를 만들어 주시면 저 같은 초심자들이 배우기에 도움이 많이 될 것 같습니다. 꼭 반영해 주시면 좋겠습니다. ^^ 참고로 개인적인 경험을 말씀드리면 파이썬 기본강좌 들으시고, 파트1, 파트2 순으로 들으시는걸 추천드립니다. 그후에 웹서버에 크롤링이나 데이터분석등의 기능을 추가하고 싶으시면 해당 관련 강좌를 들으시면 좋을것 같습니다.
2021-01-29
지식공유자 잔재미코딩 DaveLee
좋은 수강평 감사합니다. 본 강의는 거의 밑바닥부터 한땀한땀 그럴듯한 모던 웹페이지를 만드는 것이라서, 이미 만들어져있는 한두줄의 코드로 화려한 UI를 따라서 만드는 강의와는 다르기는 해요. 그런 기술들은 이후에 필요할 때, 사용하면 되지만, 현업에서 그런 기술을 사용하지는 않습니다. 특히나, 규모가 있는 웹페이지를 만들때는요. 완벽하게 만들어보기 위해, 한땀한땀 만들어보며, 기본기를 탄탄히 쌓아야 하고, 그런 부분이 꼭 도움이 되었으면 좋겠습니다. 너무 IT 관련 정보가 많고, 강의가 많고, 광고가 많다보니, 단지 따라서 코드를 치면, 이런 화려한 것이 된다? 라는 강의도 많은데, 저도 그런 강의 예전에 들어봤는데, 저에게 남는 것이 하나도 없더라고요. 그래서 완전히 따로 다 오랜 시간 정리해가며 익혔었던 기억이 있습니다. 이런 학습 방법이 훨씬 좋고 역량있는 개발자가 되는 지름길이 되길 희망합니다.
2021-02-22
태효오옥이 thumbnail
5
앞 부분 css와 html만 보았으나, 실제 실무에서 적용하는 것 이상으로 세세하고 자세하며, 다양하게 알려주십니다. 추가로 강사님께서 수업에서 사용하시는 강의 자료의 질이 정말 좋습니다. 요즘은 실무에서 spa 라이브러리 혹은 프레임워크를 사용하기 때문에, jquery보다 순수 자바스크립트를 이용하여 ui를 조작하는 방법을 아는 것이 중요한데, 이 강의는 이 점에서도 강점이 있습니다. 더 이상 긴말 안하겠습니다. 이 정도 가격에 이정도 강의면 거저라고 생각합니다. 다른 클론코딩 강의 말고 이걸 들으세요
2021-01-02
지식공유자 잔재미코딩 DaveLee
이렇게 좋은 수강평을 남겨주셔서 감사합니다. 제가 예전에 이 부분을 익힐 때, 왜이렇게 세세한 기능이 많나 싶어서 지치기도 하면서도, 부득이 꼭 익혀놔야 하기 때문에, 한땀한땀 정리한 것이라서요. 제가 풀스택이 되기 위해, 익힌 방식을 그대로 강의로 만든 부분이긴 합니다. 세세한 기능이 생각이 안나실 때, 제공해드린 구글드라이브 폴더에 가셔서, 상단에 검색을 해보세요. 그러면 강의도 들으셨기 때문에, 관련 키워드를 가진 자료를 바로 보실 수 있으실꺼예요. 그러면 훨씬 빠르게 또 구현도 가능합니다. 이 부분은 추후 유투브로 제가 찍어서 별도로 공유해보려 합니다. 감사합니다.
2021-01-04
박상호 thumbnail
5
사랑합니다 선생님
2021-08-23
지식공유자 잔재미코딩 DaveLee
ㅎㅎㅎㅎㅎ 감사합니다. ㅎㅎ 위트가 있으시네요 ㅎㅎ
2021-10-28
나두원 thumbnail
5
다른 강사님의 프론트 강의를 듣고 프로젝트를 진행하려 하였으나 막막해였는데, 친구의 추천으로 잔재미강사님의 강의를 보게 되었습니다. 기초부터 천천히 강의해 주셔서 하나도 빠짐없이 이해하며 넘어갔어요. 그 결과, 막막했던 프로젝트도 깔끔히 마무리 하였고 덕분에 자신감도 얻었습니다. 아직 고민 중이시라면 꼭 듣길 추천드립니다!! 정말 감사합니다 강사님~!
2021-08-31
지식공유자 잔재미코딩 DaveLee
와우 정말 기쁩니다. 자신감 정말 중요합니다. 뭐 완벽하지는 않을지라도, 나도 이제 할 수 있을 것 같고, 이대로만 꾸준히 한다면, 잘할 수 있을 것 같다라는 자신감! 이것이 느껴지셨다면 정말 큰 단계를 넘으신거예요. 정말 축하드리고, 도움이 되어서 저도 굉장히 기쁩니다. ㅎㅎ
2021-10-28
spiderman thumbnail
5
잘 들었습니다! 프론트엔드 개발자로 취준 중인데 많은 도움이 되었습니다 이제 제것으로 만들기 위해 복습을 열심히 해야겠습니다..ㅎ 다음 강의도 기대되네요!!
2021-09-01
지식공유자 잔재미코딩 DaveLee
맞습니다. 제것으로 만드시도록 연습도 해보시고, 또 이제부터는 비로소 프론트엔드 관련해서는 클론코딩? 같은 다른 강사님들의 강의도 한번 들어보신다면, 제 것으로 만드시는데 도움이 되시지 않을까 생각합니다.!!!!
2021-10-28