웹개발 : 프론트엔드와 백엔드의 차이 및 공부계획 총정리 (feat. 테크보이 워니)

오늘은 컴퓨터 프로그래밍 중 웹개발,

그 중에서도 프론트엔드와 백엔드의 차이 및 공부계획에 대한 주제로 글을 써보려 합니다.

1. 코딩공부를 시작한 이유

저는 늘 아이디어가 샘솟아 그것을 구체화 시키는 것을 좋아합니다.

 

하지만 수험공부가 장기화되며 지난 7년간 이러한 욕구를 전혀 해소할 수가 없었습니다.

대신에 공부할 때마다 좋은 아이디어가 떠오르면 그것을 다이어리에 메모해두곤 했습니다.

 

아이디어를 실현하는데 코딩이 필요한 이유는 크게 3가지 정도로 추려볼 수 있습니다.

 

첫 째, 제 아이디어의 대부분이 컴퓨터 네트워크를 활용하는 것과 관련되었기 때문입니다.

둘 째, 제가 원하는 프로그램 혹은 웹사이트를 아웃소싱 하게 되더라도 코딩에 대한 기초지식이 있으면 프로그래머와 소통이 원활할 것이기 때문입니다.

셋 째, 아이디어가 생각날 때마다 그것을 곧장 현실화 시킬 수 있는 힘을 기르기 위함입니다.

 

저는 위와 같은 이유로 코딩을 공부해야겠다고 마음먹었고,

그 중에서도 사람들을 웹상에서 연결할 수 있는 힘을 기르기 위해 '웹개발'을 먼저 공부하기로 마음먹었습니다.

2. 프론트엔드의 개념

 

네이버(www.naver.com) 랜딩페이지 캡쳐

프론트엔드란 쉽게 말해 인터넷 포털사이트를 켰을 때 사용자의 눈에 보이는 화면을 개발하는 것을 말합니다.

 

프론트엔드를 개발하기 위해선 3가지의 프로그래밍 언어를 알아야 합니다.

 

• HTML (HyperText Markup Language)
• CSS (Cascading Style Sheets)
• Java Script

프로그래머들 사이에서는 HTML과 CSS는 프로그래밍 언어로 칠 수 없다고 할 정도로 배우기 쉬운 언어로 알려져 있으며, 유튜버인 테크보이 워니님께서는 각 언어별 공부시간에 대해 HTML과 CSS는 각 1시간, JAVA SCRIPT는 1달로 잡으라고 조언해주셨습니다.

 

아무리 그래도 1시간은 너무 짧은 것 아니냐고 반문하실 수도 있는데, 이런 말이 있습니다.

 

"이해는 1번, 연습은 100번"

 

제가 잠깐 배워본 결과 확실히 HTML과 CSS의 구조가 매우 간단해서 강의에서 설명하는 것을 곧장 이해할 수 있었습니다.

다만, 실습을 해보면 이해했다고 생각했던 것을 정확히 구현하지 못했는데, 워니님께서 공부시간 1시간을 말씀하신 취지도 HTML과 CSS를 이해하는 시간을 설명한 것이라 생각되고, HTML의 태그를 자유자재로 구사하기 위해선 당연히 1시간보다 훨씬 더 많은 시간이 필요할 것입니다.

3. 백엔드의 개념

Python 로고

백엔드란 쉽게 말해서 웹사이트에 들어갔을 때 눈에 보이지 않지만, 웹사이트를 지탱하고 있는 서버를 개발하는 것을 말합니다.

 

백엔드의 개발언어는 매우 다양한데, 제가 나름대로 조사하고 초심자가 배우기 쉬운 언어를 정리하면 다음과 같습니다.

 

• Python
• Postgres
• Ruby on Rails

특히 파이썬의 경우 인간이 실생활에서 쓰는 언어와 비슷한 프로그래밍 언어로 초심자가 배우기에 가장 적절한 언어로 평가받고 있습니다.

 

워니님은 위 3가지 프로그래밍 언어를 배우는데 총 1달이 필요하다고 조언해주셨습니다.

역시 이 1달의 의미도 "이해는 1번, 연습은 100번"으로 이해해주시면 되겠습니다.

4. 총정리

<웹 개발>	언어	기간
프론트엔드	HTML	1시간
	CSS
	Java Script	1달
백엔드	Python	1달
	Postgres
	Ruby on Rails

5. 원본영상 링크

올바른 이해를 위해 워니님께서 설명해주신 원본영상을 남깁니다.

https://www.youtube.com/watch?v=ORI4-EXhgC4

+ 참고 칼럼 https://catchingupwith7years.tistory.com/22

HTML, CSS 질문하기 편리한 사이트 추천 : jsfiddle.net