티스토리 뷰

#입문자코딩공부순서 #어떤언어부터배워야하나 #코딩의분야



저의 경험을 바탕으로 제작된 영상입니다.
저는 웹, 앱 서비스를 만들고 싶어서 프로그래밍을 시작하였습니다.
처음 배울 때 C언어가 가장 기본이라 하여 C언어부터 공부를 시작하였습니다. 그런데 너무 어려워서 저는 코딩에 재능이 없다고 생각했고 프로그래밍 공부를 접을까 생각도 하였습니다.
그러나 막상 웹을 배우고 나서는 만들고 싶었던 웹, 앱 서비스를 만드는데 C언어의 어려운 개념은 사용되지 않았고 훨씬 쉽고 재미있게 만들 수 있었습니다. 그래서 공부를 처음부터 웹을 중심으로 한다면 더욱더 흥미롭게 시작할 수 있지 않을까 싶어 이러한 영상을 제작하게 되었습니다.

INTRO. 여러분은 어떤 목적으로 코딩을 공부하려 하시나요?

아마 많은 분들이 코딩을 배워서 내가 만들고 싶은 게임이나 Facebook, 배달의민족 등 서비스가 있을 때마다 그것을 직접 만들어서 많은 사람들이 쓸수있게 배포하고, 돈도 많이 벌고 싶어하는 분들이 많을 것 같습니다.
그런데 아이러니하게도 그런 목적으로 코딩을 배우는 많은 분들이 일단 언어부터 알아야한다고 하면서 계산기 프로그램을 만들거나 콘솔에 별찍기 등 정작 만들고 싶은 웹, 앱 화면보다 검은 콘솔창을 더 많이 보셨을 것 같습니다.
이러한 공부는 물론 재대로 끝까지 한다면 결과적으로 큰 도움이 되겠지만, 초보자에게는 코딩에 자체에 대한 흥미 잃어버리기 쉽습니다. 이걸 배워서 뭐하나 라는 생각이 들기도 하고요.
그래서 저는 최대한 쉬운 것부터 그리고 일상에서 많이 접해본 익숙한 것을 직접 만들면서 배워야 한다고 생각합니다.
이에 맞는 코딩 학습방법입니다. 

1. 어떤 것을 해야할지 모르시겠다면, 웹(Web)으로 코딩 공부를 시작하세요.

웹은 우리가 인터넷 익스프로어, 크롬, 사파리 등 브라우저를 통해 접속할 수 있는 모든 사이트를 말합니다. 대표적으로 네이버나 구글 쿠팡 등이 있습니다.
초보자 분들에게 웹을 추천하는 이유는 정말 여러가지가 있는데요. 먼저 웹은 상대적으로 다른 어떤 개발에 비해 난이도가 낮고 개발을 도와주는 도구도 많습니다.
게다가 웹으로 개발한 서비스는 컴퓨터에서 이용할 수 있을 뿐만 아니라 스마트폰, 태블릿 PC 등인터넷 브라우저가 있다면 어디서든 이용이 가능하다는 장점도 있습니다.
그렇다면 웹 개발을 하려면 무엇부터 어떻게 공부를 시작해야할까요?
이를 설명드리기전에 기본적인 개발의 분야에 대해 설명드리겠습니다.

개발은 크게 프론트앤드와 백엔드로 나눌수 있는데요.
프론트 엔드는 여러분이 모니터나 핸드폰 화면으로 볼 수 있는 부분입니다. 말 그대로 프론트 앞부분입니다.
백앤드는 그 화면에 어떤 것을 보여줄지 정보를 저장하거나 가공하는 역할을 하는 부분입니다.
저는 프론트엔드를 먼저 배우는 것을 추천드립니다. 프론트엔드는 상대적으로 난이도가 낮고 코드를 작성한대로 화면에 바로바로 나타나서 재미있게 배울 수 있습니다. 이 중 프론트앤드는 웹, 앱, 윈도우 exe 등 다양한 형태가 있습니다. 이 중에서 가장 쉽고 빠르게 배울 수 있는 것은 웹입니다. 그래서 저는 프론트엔드 중 웹을 먼저 학습하는 것을 추천드립니다. 프론트엔드는 상대적으로 난이도가 낮고 코드를 작성한대로 화면에 바로바로 나타나서 재미있게 배울 수 있습니다.

2. 웹(Web) 프론트엔드 설명/공부 방법/순서

웹의 프론트엔드 즉, 여러분이 보는 인터넷 화면을 만들기 위해서는 어떤 것을 알아야할까요?
크게 3가지 HTML, CSS, javascript라는 언어 지식이 필요합니다.   
쉽다면서 무슨 3가지 언어나 써서 웹사이트를 만들어야 하나 라는 생각이 들 수 있는데요. 각각의 개념이 크게 어렵지 않고 서로 유기적으로 연결되어 있어 차근차근 배우다보면 어렵지 않습니다.
심지어 HTML, CSS는 마크업 랭귀지라고해서 개발자들 사이에서 개발 언어라고 취급도 못 받을 정도이니 너무 겁먹지 마세요
처음 듣는 분들은 어려울 수 있으니, 여러분이 그림을 그리는 상황에 비유해서 하나씩 설명해드리겠습니다. 먼저 HTML이라는 언어는 그림을 그릴 때 연필과 같습니다. 어떻게 그릴지 전체적인 밑그림을 그리는 언어입니다. 웹으로 생각해보면 홈페이지 제목은 뭘로 만들지 로그인창을 어디에 둘지, 등 기본적인 것을 뼈대를 작성해주는 언어입니다.
그 다음으로 CSS는 이를 색칠하는 물감과 같습니다. HTML로 그린 뼈대에 본격적으로 색을 칠하고 위치를 조금 씩 수정하면서 화려하게 만드는 역할을 하는 것이죠.
마지막으로 Javascript는 이 그림을 움직이게 만드는 플립북 처럼 웹사이트에서 움직이는 요소들을 만들 수 있습니다.
이들을 공부하시는 순서는 먼저 상대적으로 더 쉬운 HTML, CSS를 함께 공부하시면서 화면을 그려보시고, 그 다음으로 Javascript를 추가하여 공부하는 것을 추천드립니다.
참고로 javascript는 진정한 프로그래밍 언어이기에 공부할 양이 상당히 많습니다. 상대적으로 학문이 깊이가 깊기 때문에 웹의 요소를 선택하고 제어할 수 있는 간단한 정도만 공부하고 얼른 넘어갑니다.
프론트엔드의 기초만 할 줄 알아도 네이버/구글 지도, 실시간 채팅과 같이 프론트엔드에 한줄만 붙여도 나타나는 잘되있는 API도 많기 때문에 이런 것들만 잘 조합한다면 상당히 쓸만한 서비스를 만들 수도 있습니다. 앞으로의 영상들을 통해 저와 함께 배우면서 직접 그런 서비스를 직접 만들어 보도록 하겠습니다.

3. 프로그래밍 언어의 기초(만)를 배우세요.

프론트엔드가 어느정도 개념이 잡히신다면 프로그래밍 언어의 기초를 배우세요. 초기에 프로그래밍 언어는 어렵고 깊이 배울 필요도 없습니다. 언어를 깊게 공부하면 끝이 없는데 결국 활용하는 것이 목표이니 프론트앤드에서 조금 했던 자바스크립트나 루비, 파이썬과 같은 쉬운 언어의 변수, 조건문, 반복문, 함수의 개념까지만 학습하는 것을 추천드립니다.
더 깊은 내용은 필요할 때 찾아서 공부하면되고 이 정도만 알고 있어도 당장 활용하기에 충분합니다.

4. 쉬운 프레임워크를 이용해 백엔드를 배우세요.

그 다음으로 쉬운 프레임워크를 이용해 백엔드를 배우는 것을 추천드립니다. 
프레임워크는 개발을 쉽게할 수 있도록 도와주는 도구인데요.
프레임워크의 종류도 굉장히 많습니다.
언어별로 자바는 스프링 / 파이썬은 장고 / Ruby는 Rails 등이 정말 다양한 프레임워크가 존재합니다. 개발 취향에 따라 선택이 달라질 수 있을 것 같습니다. 
저는 개인적으로 가장 적게 배우고 많은 것을 할 수 있는 Ruby On Rails로 시작하는 것을 추천드립니다.
라는 강력한 프레임워크를 추천드리고 싶습니다.

이렇게 프론트엔드, 프로그래밍 언어, 백앤드 프레임워크를 순차적으로 공부하시면 웬만한 웹사이트를 만들 수 있게 되실겁니다. 만들고 싶은 웹 서비스를 프로젝트 형식으로 만들어 보면서 실력을 키운다면 빠르게 프로그래밍 실력이 늘 수 있고, 자연스레 IT 서비스에 대한 전반적인 개념이 잡히실 겁니다.

5. 영상 요약 정리

1. 프로그래밍 언어 공부부터 시작하는 것은 어려울 수 있음


2. 웹(Web)으로 시작하시는 것을 추천

- 웹이란? 브라우저를 통해 접속할 수 있는 모든 사이트

- 장점 1. 인터넷을 사용해보았다면 누구나 익숙함

- 장점 2. 난이도가 상대적으로 낮음

- 장점 3. 개발에 필요한 도구가 많음

- 장점 4. PC, 스마트폰, 태블릿, TV 등등 다양한 기기에서 동작함


3. 개발은 크게 프론트엔드 / 백엔드로 나눌 수 있음

- 프론트엔드는 우리가 보는 화면 처리 (ex.로그인 화면)

- 백엔드는 DB 조회 등 로직 처리 (ex.ID/PW 확인 로직)


4. 프론트 엔드부터 시작하는 것을 추천

    - 코딩한대로 화면에 바로바로 표시되어서 재미있음

    - HTML(연필), CSS(물감), Javascript(플립북)로 구성됨


5. 프론트엔드만 할 줄 알아도 API를 잘 쓰면 쓸만한 서비스만들 수 있음

    (API : 미리 만들어 놓은 가져다 쓸 수 있는 기능)


4. 백엔드부터는 본격적으로 개발 언어가 사용됨
  - 쉬운 코딩 언어로 기본만 익히고 시작하기
  - 변수, 조건문, 반복문, 함수만 알아도 웬만한건 만들 수 있음
1. 변수 : ~는 ~다의 개념 ex) ID = “jocoding”
2. 조건문 : 만약 ~라면 ex) ID/PW가 일치하면 로그인 성공표시
3. 반복문 : ~를 n번 반복해라 ex) 앞으로 이동 10번 반복
4. 함수 : a를 넣으면 b가 나옴 ex)  공격력이 5이면 데미지가 50

5. 프레임워크 : 개발을 도와주는 도구 모음

6. 웹 개발을 도와주는 다양한 프레임워크가 존재함

7. 개인적으로 처음 시작하실 때 Ruby On Rails 추천 (적게 배우고도 많은 것을 빠르게 구현할 수 있음)

8. 만들고 싶은 웹 서비스를 만들면서 공부하면 빠른 속도로 실력이 성장함




댓글