온라인 강의 사이트 소개

개발관련  대표적인 온라인 강의사이트 top 10——————-

이 사이트들의 특징은 유튜브처럼 그냥 동영상을 시청하는게 아니라, 직접 코딩을 하면서 배운다는 것이다.

1. FreeCodeCamp

무료.

YouTube 에 최신기술로 가득찬 강의가 모두 무료로 공개되어있다.

2.TreeHouse

유료(Basic: 25$, Pro: 49$)

2. CodeAcademy

무료

4. CodeSchool

유료/무료

5. Cosera

무료/유료

6. EDX

유료/무료

7. UDACity

유료/무료

8. LiveCoding.TV

무료

9. EggHead.io

유료/무료

10. Kahn Academy

무료

여기서 유료사이트인 TreeHouse와 무료 사이트 FreeCodeCamp에 대해서 소개한다.

개발자가 될려면 TreeHouse를 권장한다. 한달 25$는 아깝지 않다고 생각될 것이다.

그래도 돈이 없다라고 하신는 분들을 위해서 FreeCodeCamp도 소개해 드리지만 대부분의 무료 사이트는 아주 초급자를 위한 사이트이다.

정말 아무것도 모른다면 FreeCodeCamp부터 시작해도 좋을것이다.

1.  TreeHouse

유료사이트이다. Basic: 25$, Pro: 49$

일주일은 무료이니 사용해보고 결정할수 있다.  일주일동안 사용해보고 아무 액션을 취하지 않으면 자동과금이 일어나게 되니,

만일 사용을 원치않는다면 프로파일 > subscription에 가서 stop을 하거나 pause를 해야 과금이 일어나지 않는다.

TreeHouse의 모토는 누구나 개발자가 될 수 있다이다. 나는 예전에 유튜브에서  TreeHouse 동영상광고를 굉장히 많이 본 기억이 있다.

각분야 전문가들로 구성된 강사의 web design, coding 등 1000개가 넘는 동영상 컨텐츠가 있으며 동영상에 영어 자막도 제공이 되고 있다.

또한, 가장 최신 기술들로 구성된 웹기술들이 자주 업데이트가 된다.

그냥 동영상을 보고 끝나는게 아니라 동영상을 보고 퀴즈를 풀면서 직접 코딩을 하면서배운 것을 복습한다.

Tracks 메뉴에서 특정 주제를 선택해서 학습코스를 짤 수도 있고, 자기가 원하는것을 직접 고를수도 있다.

만일 web design 트랙에 관심이 있다면 Track에서 44시간짜리 Web Design을 선택한다.

Introduction To HTML and CSS (2hours) 부터 시작해서 난이도별로  44시간 분량의 강의가 쭉 나열되어있다

하나의 Track에 여러가지 Course가 포함되어있는 구조이다.

HTML Basics(3 hours)

Bootstrap 4 Basics (2 hours)

Animating SVG with CSS (85 min)

Sass Basics (4 hours)

자기가 관심이 있는 Course를 선택하고 학습을 시작하자.

예로, Bootstrap 4 Basics를 선택해보겠다.

강의는 주로 실습 위주로 진행이되고 자막을 켜서 볼 수 있다… 영어 자막이 제공되는 사이트는 많지않다.

강사가 사이트를 만들면서 진행하면 동일하게 코딩을 하면서 실습을 할 수 있는 workspace 공간을 제공해준다.

우측 아래 Launch Workspace를 누르자. 그러면 클라우드 환경의 웹사이트가 하나 열린다.

별도의 개발환경을 갖출 필요없이,강사가 코딩을 할때 같이 라이브 코딩을 하면서 따라 할 수 있다.

파이썬, php 등 모든 강의가 이렇게 Course별로 Workspace가 제공된다.

각 챕터가 끝나면 복습을 하는 퀴즈 Course가 열린다. 퀴즈는 때때로 객관식일수도 있고 짧은 주관식, 혹은 긴 주관식일수 있다.

종종 어려운 문제가 나오기도 하는데, 이 때는 Community에 질문을 할 수도 있고 검색하면 이미 Community에 누군가 질문한걸 찾을수 있을것이다.

2. FreeCodeCamp

대부분의 무료사이트들의 특징은 초급자 레벨이다.

상단 커리큐럼을 누르면 7가지  트랙이 나온다.

여기서 Responsive Web Design Certification (300 hours) 을 펼쳐보자.

8가지 Course가 있고 그중에 Css Flexbox를 펼치고 Use the flex-direction Property to Make a Column 을 클릭하고 들어가보자.

그러면 아래와 같이 3가지 부분으로 구성된 화면이 열린다. 맨 왼쪽은 설명과 함께 문제가 제시되어있고, 중간은 코딩영역 오른쪽은 코딩 결과화면이 보인다.

왼쪽 설명을 읽어 보고 문제를 푸는데 만일 설명을 듣고 싶다면 왼쪽에 Watch a Video를 눌러서 동영상을 볼수 있다.

그러나 자막은 제공되지 않는다.

맨 왼쪽 아래쪽에 삼각형으로 된 부분이 문제이고 그 문제에 따라서 중간영역에 코딩을 수행한다.

한 줄을 넣었더니 오른쪽 사각형이 세로로 배치된게 보일것이다.

이제 코드가 제대로 되었는지 왼쪽에 Run the Tests를 클릭한다. 정답이 틀렸으면 아래쪽에 머가 틀렸는지 제시해주고

정답이면 아래와 같이 나온다.