Thumbnail
BEST 개발 · 프로그래밍 프로그래밍 언어
견고한 JS 소프트웨어 만들기
(4.8)
81개의 수강평 ∙ 929명의 수강생

27,500원

지식공유자: 김정환
총 19개 수업 (1시간 11분)
수강기한: 무제한
수료증: 발급
난이도:  입문-초급-중급이상
지식공유자 답변이 제공되는 강의입니다
폴더에 추가 공유
중급자를 위해 준비한
[웹 개발, 프론트엔드] 강의입니다.

같은 기능을 만들더라도 자바스크립트 문법을 이제 막 뗀 주니어 개발자와 경험 많은 시니어 개발자의 코드는 상당히 다릅니다. 물론 결과물은 같더라도 말이죠. 후자의 코드가 인정받는 이유는 짜임새 있는 설계와 변화에 대응할수 있는 확장성 때문일거에요. 이 강의는 그런 좋은 코드를 만들어 내는 방법에 대해 알아봅니다.

✍️
이런 걸
배워요!
TDD(테스트 주도 개발)
자바스크립트 디자인 패턴

좋은 코드를 알면,
좋은 소프트웨어를 만들 수 있어요.

견고한 소프트웨어 만들기

같은 기능을 만들더라도 자바스크립트 문법을 이제 막 뗀 주니어 개발자와 경험 많은 시니어 개발자의 코드는 상당히 다릅니다. 물론 결과물은 같더라도 말이죠. 후자의 코드가 인정받는 이유는 짜임새 있는 설계와 변화에 대응할 수 있는 확장성 때문일거에요. 이 강의는 그런 좋은 코드를 만들어 내는 방법에 대해 알아봅니다.


이 강의의 특별한 점 

  • 테스트주도 개발 방법으로 견고한 프론트엔드 코드를 설계하고 코딩할 수 있어요.
  • 소프트웨어 공학 원칙과 디자인 패턴을 학습할 수 있어요.

먼저 자바스크립트의 특성과 왜 TDD(테스트 주도 개발) 가 필요한지에 대해 짚어 봅니다. 실무에서 흔히 사용되는 코드 예제로 진행하는데요. 코드의 문제점을 함께 진단해 보고 단계적으로 개선해 나가는 과정을 함께 할 거에요. 그리고나서 TDD와 디자인 패턴에 대한 이론을 살펴보구요. 이를 리팩토링에 적용해 보면서 결국에는 좋은 품질의 코드를 만들어 낼 수 있습니다.

각 강의는 10분 미만으로 짧아서 언제라도 다시 시작할 수 있습니다. 영상 중간에 준비한 브랜치들은 실습하지 못한 분들을 위한 작은 배려입니다. 그렇지만 직접 한 땀 한 땀 코딩하면서 수업에 참여하시는 것을 적극 권해드립니다.


이런 분들이 들으면 좋아요!

“자바스크립트 문법은 아는데 어떻게 개발해야 할지 모르겠어요”

“TDD는 들어봤는데 어떻게 하는 건지 궁금해요"

“요구사항이 변경되더라도 코드는 조금만 수정했으면 좋겠어요"

🔹 미리 보는 학습 환경

  • 편집기: VS Code
  • 코드 저장소: Github
  • 브라우저: Chrome
  • 테스프 프레임웍: Jasmine

저를 소개합니다 🧑‍🏫

김정환

웹 기술을 학습하고 정리하는 걸 좋아하는 실무 개발자
웹 기술 및 개발자로서의 생각을 담은 기술 블로그를 운영하고 있어요.

학습한 기술과 실무에서 배운 노하우를 모아 발표나 강의 형식으로 공유하는 활동도 하고 있어요.

우아한형제들에서 프론트엔드 개발자로 일하고 있어요.

리액트 기술과 관련된 컨텐츠도 작성했어요.


안녕하세요
김정환 입니다.
김정환의 썸네일

👋🏼 안녕하세요 인프런에서 강의하는 김정환입니다.

수업 중 궁금한 사항은 질문 사항에 올려주세요.
매일 점심 시간마다 확인하고 답변 드리겠습니다.

커리큘럼 총 19 개 ˙ 1시간 11분의 수업
이 강의는 영상이 제공됩니다. 미리보기를 통해 콘텐츠를 확인해보세요.
섹션 0. 1. TDD 이론 및 패턴 소개
섹션 1. 2. 모듈패턴으로 기존 코드 개선하기
클릭카운터 모듈 - 스펙1 05:00
클릭카운터 모듈 - 스펙2 05:00
클릭카운트뷰 모듈 - 스펙1 미리보기 05:00
클릭카운트뷰 모듈 - 스펙1 (계속) 03:00
클릭카운트뷰 모듈 - 스펙2 07:00
클릭카운트뷰 모듈 - 스펙 3 06:00
섹션 2. 3. 중간 정리, 뭐가 개선된거죠?
모듈 이용해서 화면 만들기 03:00
개선된 점 04:00
섹션 3. 4. 추가 요구사항도 쉽게 받을수 있는 코드 만들기
클릭카운터 모듈 - 스펙3 06:00
클릭카운터 모듈 - 스펙4 04:00
섹션 4. 5. 정리
화면에 붙여보자 04:00
정리 - 스펙4 01:00
강의 게시일 : 2018년 05월 30일 (마지막 업데이트일 : 2018년 08월 30일)
수강평 총 81개
수강생분들이 직접 작성하신 수강평입니다. 수강평을 작성 시 300잎이 적립됩니다.
4.8
81개의 수강평
5점
4점
3점
2점
1점
VIEW 좋아요 순 최신 순 높은 평점 순 낮은 평점 순 평점 순 높은 평점 순 낮은 평점 순
김호균 thumbnail
아주 쉽게 TDD에 대해서 설명해주시네요 TDD에 대한 개념을 아주 쉽게 설명해 주셔서 재밌게 봤습니다. 만드시는 소스 스타일이 React나 Vue랑 비슷한거 같네요. 궁금한 점이 있습니다. 아직 ES6를 사용하지 못하는 프로젝트에서는 ES5로 변환해서 배포해야 할텐데 ES6에서 테스트한 코드는 ES5로 변환한 후에도 테스트에서 통과한 내용을 모두 보증할 수 있나요? 좋은 강의 감사합니다. 다른 강의도 유익하게 보겠습니다!
2018-12-24
지식공유자김정환
그렇지 않습니다 어플리케이션 코드와 버전을 맞추는 것이 좋습니다. es5로도 얼마든지 테스트 코드 작성할 수 있거든요.
2018-12-24
휴식중인 불가사리 thumbnail
재미있어요. 간단하지만 많은 내용이 들어가 있습니다. TDD부터 자바스크립트 개발시 주의할점. 거기에 객체개념까지... 강사님은 자연스럽게 그런것들을 적용하는것 같은데 전 아직 그정도는 아닙니다. 많이 배우고 갑니다.
2019-01-09
지식공유자김정환
저도 아직 배워야할것 들이 많아요ㅜㅜ
2020-03-21
sugbong2 thumbnail
깔끔하네요
2019-07-03
지식공유자김정환
👍
2020-03-21
Heedo Kim thumbnail
문제가 있는 코드를 개선하고, 과정마다 테스트를 하나씩 추가하는 과정을 하나씩 밟을 수 있습니다. 단순히 코드만 설명하지 않고 개발 관련 개념도 같이 설명합니다. TDD를 처음 공부하면서 큰 도움이 되었습니다. 하지만 강의 자료에 오타가 많고, 오타가 발생해서 수정하는 부분까지 동영상에 포함되어 있습니다. 처음부터 세 번째 영상까지는 소리 출력이 불안정했습니다. 영상을 전체적으로 검수하고, Jasmine 테스트 결과를 좀 더 자세히 분석해주시면 좋겠습니다.
2019-10-15
지식공유자김정환
영상이 좀 불안정했었군요. 그래도 끝까지 들어주셔서 고맙습니다.
2020-03-21
HYUNJUN KIM thumbnail
김정환 님의 강의 덕분에 좋은 코드를 작성하는 게 어떤 것인지 감을 잡을 수 있었습니다. 저는 비전공자로 프로그래밍에 입문한 지 몇개월 안된 수강생입니다. 사람들이 항상 좋은 코드, 클린 코드 말하는 것만 듣고, 그게 정확히 어떤 것인지 감이 잘 안 잡혔습니다. 그러던 와중에 저의 멘토분께서 항상 TDD로 코딩 해보는 것을 추천해주셨습니다. 일을 매우 작은 단위로 추적하는 것을 습관화하는데 도움이 된다는 말과 함께요. 그래서 김정환 님의 강의를 찾아 들었습니다. 작은 단위로 생각하는 것과 더불어, 맨날 말로만 들었던 DRY 한 코드가 어떤 것인지 조금이나마 감을 잡게 된 것 같습니다. 이 강의 뿐만 아니라, 노드 TDD 개발이나 블로그에 써주시는 글도 너무 좋은 것 같습니다. 좋은 강의 자료 제공해주셔서 감사합니다.
2019-06-30
지식공유자김정환
강의, 블로그까지 찾아주시다니 고맙습니다.
2020-03-21
연관 로드맵
이 강의가 포함된 잘 짜여진 로드맵을 따라 학습해 보세요!
지식공유자 되기
많은 사람들에게 배움의 기회를 주고,
경제적 보상을 받아보세요.
지식공유참여
기업 교육을 위한 인프런
“인프런 비즈니스” 를 통해 모든 팀원이 인프런의 강의를
자유롭게 학습하는 환경을 제공하세요.
인프런 비즈니스