웹개발은 여러분이 생각하시는 것보다 훨씬 더 힘들고 복잡할 수 있습니다. 배워야 할 것도 아주 많고, 개발에 사용되는 ‘웹 개발 언어’와 프레임워크도 너무나 다양하지요. 어떤 오픈소스를 사용할 것인지도 생각해봐야 합니다. 개발자를 꿈꾸거나 혹은 ‘웹 개발 언어’를 이해하고 싶다면 기초에서부터 시작해서 점차적으로 복잡한 프로그래밍 언어를 공부하는 것이 좋습니다.
이번 시간, 위시켓이 웹개발자가 사용하는 ‘웹 개발 언어’를 처음부터 끝까지 설명해드리겠습니다. 가장 많이 쓰이는 ‘웹 개발 언어’를 알아보고, 최적의 개발도구와 환경에 대해서도 살펴보세요:)
*잠깐, 위시켓은 2019년 시밀러 웹 방문자 수 기준, 국내 1위 IT아웃소싱 플랫폼입니다. 현재 7만 9천 개의 개발업체와 프리랜서들이 활동하고 있으며, 원하는 개발 프로젝트를 무료로 등록할 수 있습니다. 프로젝트 등록 한 번으로 개발업체들의 견적/ 포트폴리오/ 예상기간/ 경력 등을 한 번에 알아보세요!
STEP 01. HTML과 CSS
(개발언어: HTML, CSS)
초보자들에게는 HTML과 CSS가 가장 기본이 되는 ‘웹 개발 언어’입니다. 이 두 언어는 로직을 다루는 것이 아니기 때문에 실제 프로그래밍 언어라고 할 수는 없습니다. HTML은 마크업 언어(markup language)이고, CSS는 스타일 언어(Style Language)입니다. HTML은 페이지가 어떻게 구성되는지를 정하는 언어이고, CSS는 페이지가 화면에 어떻게 보이는지를 정하는 언어라고 생각하시면 됩니다.
이 두 언어는 서버의 도움 없이 브라우저 안에서 작동되기 때문에 프런트엔드(frontend) 언어로 간주됩니다. 프로그래머들 중에서는 파이썬(Python)이나 자바스크립트(Javascript)와 같은 완전한 ‘웹 개발 언어’로 시작하는 사람들도 있습니다. 하지만 웹페이지를 개발하고 싶은데 어디서부터 시작해야할지 모르겠다면, HTML과 CSS가 가장 좋은 답이 될 수 있습니다.
HTML만으로도 웹페이지를 만들 수 있긴 하지만, 멋지게 꾸밀 수는 없습니다. 마찬가지로, CSS만으로는 브라우저에서 아무것도 표시할 수가 없습니다. 그걸 구현해 줄 HTML이 없기 때문이죠. HTML과 CSS는 서로를 보완해줄 수 있습니다. 여러분은 이 두 가지 ‘웹 개발 언어’만 배워도 직접 웹사이트를 만들 수 있습니다.
HTML과 CSS의 가장 최근 버전은 HTML5와 CSS3입니다. 이전 버전인 HTML4나 CSS2와 아주 많은 차이가 있는 것은 아닙니다. 웹사이트 개발을 좀 더 쉽게 해주는 새로운 기능이 추가되었을 뿐입니다. 이 두 ‘웹 개발 언어’들을 익히는 가장 좋은 방법은 프로젝트 페이지를 직접 만들어보는 것입니다. 물론 여러 가지 어려움에 부딪히겠지만, 구글 검색이나 스택오버플로(Stack Overflow)와 같은 개발자 커뮤니티의 도움을 받아서 문제를 해결할 수 있습니다.
STEP 02. 자바스크립트/ES6(JavaScript/ES6)
(개발언어: JavaScript/ES6)
또 다른 프런트엔드 개발언어로는 자바스크립트가 있는데, 대부분의 웹개발자들이 배우는 대중적인 ‘웹 개발 언어’입니다. 자바스크립트를 빼놓고 웹을 말하긴 어려울 정도로, 지난 수십 년 동안 웹개발에서 중요한 역할을 해왔습니다.
자바스크립트를 이용하면 드롭다운(Dropdown)메뉴, 슬라이드 효과, 대화창을 비롯한 다양한 효과를 웹페이지에서 구현할 수 있습니다. CSS3에서 추가 기능이 생겨나면서 자바스크립트 없이도 멋진 기능을 만들어낼 수 있게 되었지만, 그렇다고 해서 자바스크립트가 더 이상 무용지물이 된 것은 아닙니다. 요즘에는 그 어느 때보다도 많은 웹사이트들이 역동적 기능을 구현하기 위해서 자바스크립트를 사용하고 있습니다. 웹브라우저는 기본적으로 자바스크립트를 지원하기 때문에, 특별한 설정 없이도 자바스크립트로 만들어진 웹페이지를 이용할 수 있습니다.
자바스크립트의 최신 버전은 ES2015인데, ECMAScript2015(에스마스크립트2015)를 줄인 표현입니다. 이 글에서 자세히 설명하지는 않겠지만 여기에서 자바스크립트라고 하면 모두 ECMAScript를 말하는 것이라고 보면 됩니다. 자바스크립트의 기본을 안다면, ES2015를 이해할 수 있습니다. 버전과 관계없이 자바스크립트의 기본은 현재 버전과 이후의 모든 버전에서도 지원되기 때문입니다.
흔히들 자바스크립트를 웹개발자의 첫 번째 프로그래밍 언어라고 부릅니다. 물론 자바스크립트는 진정한 프로그래밍 언어가 아니라 스크립트 언어라고 말하는 사람들도 있습니다. 하지만 서버에서 노드 JS(Node.JS)가 돌아가고 있다면, 자바스크립트를 프런트엔드는 물론이고, 백엔드(backend)에서도 활용할 수 있습니다.
변수 설정, 루프 생성, 기능, 논리연산자와 같은 자바스크립트의 기본부터 시작하세요. 이러한 지식을 갖춘다면, 자바스크립트의 다양한 형식은 물론이고, 다른 프로그래밍 언어에 대해서도 도전해볼 수 있습니다.
STEP 03. 피에이치피(PHP), 루비(Ruby), 파이썬(Python)
(개발언어: PHP, Ruby, Python)
웹개발의 마지막 퍼즐은 백엔드 개발 분야입니다. 백엔드는 엄청나게 다양한 ‘웹 개발 언어’들이 쓰이는 방대한 영역이며, 그중에서는 그 어떤 것보다도 많이 쓰이는 ‘웹 개발 언어’들이 있습니다.
이제 막 걸음마를 뗀 개발자라면 주위에서 피에이치피(PHP)에 대한 이야기를 많이 들을 것입니다. PHP는 오래된 웹 프로그래밍 언어로 웹 개발에 목적을 두고 개발된 언어입니다. 불과 몇 년 만에 PHP는 빠르게 기반을 잡으며 성장을 했습니다. 워드프레스(WordPress), 줌라(Joomla), 마젠토(Magento)와 같은 프로젝트들이 PHP를 기반으로 만들어졌습니다. PHP는 라라벨(Laravel), 루비는 레일즈(Rails), 파이썬 용으로는 장고(Django)라는 프레임워크가 있습니다.
백엔드 개발을 하고 싶다면 PHP부터 시작하는 게 쉬운 방법입니다. 워드프레스(WordPress)가 어떻게 만들어졌는지를 초기 단계부터 확인할 수도 있고, 대부분의 호스팅 회사들이 기본적으로 PHP를 지원하기 때문입니다.
STEP 04. 구조화 질의 언어(Structured Query Language, SQL)
(개발언어: SQL)
여러분이 백엔드 개발에 관심이 있다면, 에스큐엘(SQL)은 반드시 배워야 하는 언어입니다. SQL은 MySQL이나 PostgreSQL과 같은 주요 데이터베이스(DB) 엔진을 돌아가게 하는 원동력입니다. 대부분의 DB 엔진은 SQL과 코드가 호환되기 때문에 SQL을 익혀 두면, 어떤 DB 시스템 기반에서도 작업을 할 수 있습니다.
초보자들이 가장 많이 접하는 데이터베이스 엔진은 MySQL입니다. MySQL은 호스팅 업체에서 묶음으로 함께 제공되는 경우가 많으며, 워드프레스(WordPress)와 같은 유명한 콘텐츠관리시스템(CMS)에서 가장 많이 사용되고 있는 DB 엔진입니다.
위시켓이 소개해드린 모든 언어들을 다룰 수 있다면 유능한 풀 스택(full-stack) 개발자가 될 수 있습니다. 하지만 기본적인 웹개발자가 되려는 거라면, 모든 언어를 다 마스터할 필요는 없습니다. HTML와 CSS, 그리고 약간의 자바스크립트만 배워도 프런트엔드 개발자가 될 수 있습니다. 백엔드 개발자도 HTML/CSS의 기본은 배울 수 있겠지만, 가장 집중해야 할 것은 백엔드 분야에서 쓰이는 ‘웹 개발 언어’와 데이터베이스 엔진에 관한 것입니다.
함께 보면 좋은 콘텐츠
혹시, 개발 프로젝트를 계획 중이신가요?
그렇다면 지금 바로 위시켓에 무료로 프로젝트를 등록해보세요. 2만 건의 데이터를 바탕으로 여러분이 구현하고자 하는 모바일 웹에 대한 가장 적정한 견적을 알려드립니다.
- 본문 내용은 ‘Which Languages Should I Learn for Web Development?’을 각색하여 작성했습니다.
