웹 개발자 풀스택 요건
1. 프론트엔드
2. 백엔드
3. 웹서버
4. 데이터베이스
1. 프론트엔드(클라이언트)
홈페이지 제작을 위해서는 가장 기본이 되는 HTML, CSS, Javascript를 알아야 합니다.
1. HTML(Hypertext Markup Language)은 웹페이지를 구성하는 요소들을 나열하는 형태로 비교적 쉽게 배울 수 있습니다. HTML을 배우게되면 이미지나 링크, 테이블 등을 브라우저에 보여주는 것이 가능합니다.
2. CSS(Cascading Style Sheets)는 웹페이지에 좀 더 디자인적인 요소를 가미하도록 도와줍니다. CSS를 배우게되면 이미지나 텍스트에 효과를 넣을 수 있습니다.
3. Javascript는 웹페이지를 사용자와 소통할 수 있도록 도와줍니다. Javascript를 배우게되면 경고창 및 사용자가 입력한
데이터 처리가 가능합니다. Javascript는 HTML이나 CSS와 달리 실제 프로그래밍 기술이 요구되며, 라이브러리 형태의 JQuery에 대한 지식도 필요합니다.
프레임워크&라이브러리
Angular
강력한 명령행 도구와 잘 정돈된 폴더 구조, 프로젝트 생성과 동시에 각종 환경이 한 번에 갖춰지는 등 필요한 기능을 모두 내장한 프레임워크입니다. 참고로 이렇게 애플리케이션을 만들기 위해 필요한 기능을 모두 갖춘 프레임워크를 '컴플리트 프레임워크(Complete Framework)'라고 합니다.
React
사용자의 조작에 따라 사용자 인터페이스가 동적으로 변화하는 웹 애플리케이션을 개발할 수 있게 해 주는 프론트엔드 라이브러리입니다. React는 "A JavaScript library for building user interfaces"라고 주장하며 라이브러리를 표방하고 있습니다.
Vue.js
Vue.js는 이 그룹에서 가장 늦게 출시되었는데 Google 직원인 Evan You가 2014년에 개발했습니다. Vue.js는 대기업의 후원을 받지 못했음에도 지난 2년 동안 인기가 높아지고 있습니다. 현재 안정버전은 2.17이며, 2018년 8월에 출시되었습니다. Vue.js의 컨트리뷰터는 Patreon에서 지원하며, 현재 프로토타입 단계에 있는 Vue3은 타입스크립트 기반으로 이동할 계획입니다.
자세한 내용 출처: https://www.samsungsds.com/global/ko/support/insights/frameworks.html, https://wickies.tistory.com/120
프레임워크와 라이브러리의 차이점: https://mangkyu.tistory.com/4
2. 백엔드(서버)
이렇게 가장 기본적인 HTML, CSS, Javascript를 배우고 나면 비로소 웹서버에서 작동하는 프로그래밍 언어(Server Side Programming)를 배울 차례입니다.
웹서버의 운영체제 및 제작하려는 홈페이지의 특성에 따라 PHP, JSP, ASP/ASP.NET 등의 언어를 사용하게 됩니다. 일반적으로 가장 많이 사용되는 언어는 PHP이며, 보안 및 내부 프로그램과 연동이 필요한 경우에는 JSP나 ASP.NET을 많이 사용합니다.
JSP와 ASP.NET은 웹프로그래밍을 위한 언어로 그 기원은 Java, C# 등의 언어가 되겠습니다. PHP를 사용한다면 굳이 Java나 C#을 배울 필요는 없습니다.
프로그래밍 언어의 기본을 익히고 나면 심화과정으로 검색엔진 최적화, DB 및 객체지향 클래스 설계, MVC 패턴 등 좀 더 깊이 있는 지식을 습득해야 합니다. 이런 지식이 있어야 성능이 좋은 웹사이트를 좀 더 빠르게 개발할 수 있기 때문입니다.
PHP: PHP는 서버 측에서 실행되는 프로그래밍 언어로 HTML을 프로그래밍적으로 생성해주고, 데이터베이스와 상호작용 하면서 데이터를 저장하고, 표현합니다. PHP는 웹을 위해서 만들어졌고, 지금도 웹을 위해서 발전하고 있는 웹을 위한 언어입니다. 웹프로그래밍을 위한 높은 생산성을 제공하는 언어입니다. 특히 서버에 직접 설치해서 운영할 수 있는 설치형 웹에플리케이션(제로보드,텍스트큐브,워드프래스,PHPBB등)의 과반이 PHP로 만들어졌습니다. 따라서 PHP를 배워두시면 이러한 솔루션들에 대한 운영, 문제해결 능력이 향상됩니다. 무엇보다 쉽습니다.
Node.js: 확장성 있는 네트워크 어플리케이션 개발에 사용되는 소프트웨어 플랫폼입니다. 특히 서버사이드에서 많이 사용되곤 합니다. 사용되는 언어로는 자바스크립트(Javascript)를 활용하며, Non-blocking I/O 와 단일 스레드 이벤트 루프를 통한 높은 처리 성능을 가지고 있는 특징을 가지고 있습니다.
내장 HTTP 서버 라이브러리를 포함하고 있어 웹 서버에서 아파치 등의 별도 소프트웨어 없이 동작하는 것이 가능하며, 이를 통한 웹 서버의 동작에 있어 더 많은 통제에서 벗어나 여러가지 기능을 가능하게 합니다.
즉 Node.js 를 통해 웹어플리케이션이 더욱 발전하게 되었으며, 정적인 홈페이지 뿐만 아니라 쇼핑몰, 티켓 예매사이트, 블로그 등 data가 변하는 사이트를 만들 수 있으며, 여러 개발자들이 만든 프로그램과 게임을 웹상에서 구동시켜 안드로이드폰, 아이폰, 윈도우PC, 맥 등 플랫폼의 제약에 벗어나 어디든 상관없이 실행이 가능하게 해줍니다. 물론 단순히 웹에서 실행가능한 게임을 만들려면 javascript 만으로도 가능하지만 좀더 진화된 프로그램으로 실시간 온라인 채팅, 실시간 온라인 게임 등 실시간 기능을 넣거나, 로그인 기능을 넣어 유저를 관리하고 점수를 관리하는 데이터베이스 기능을 Node.js 를 통해 만들 수가 있습니다.
사용이유: Javscript는 C/C++, Java와 같은 프로그래밍 언어입니다. 하지만 이름에서 알 수 있듯이 Javascript는 독립적인 언어가 아니라 스크립트 언어입니다. 스크립트 언어는 특정한 프로그램 안에서 동작하는 프로그램이기 때문에 웹브라우저 프로그램 안에서만 작동을 하게 됩니다. 즉 웹브라우저(크롬, 파이어폭스, 사파리, 익스플로러 등등) 가 없으면 사용할 수 없는 프로그램이죠. 여기서 Node.js 가 나오는 이유가 됩니다. 즉 javascript를 웹 브라우저에서 독립시킨 것으로 Node.js를 설치하게 되면 터미널프로그램(윈도우의 cmd, 맥의 terminal 등)에서 node를 입력하여 브라우져 없이 바로 실행할 수 있습니다. 하지만 javascript에서 분리된 언어이기 때문에 문법은 같습니다. node.js를 이용하여 웹브라우져와 무관한 프로그램을 만들 수 있게 되었고, 중요한 것은 node.js를 이용하여 서버를 만들 수 있다는 것입니다. 중요한 이유는 이전까지 server-client 웹사이트를 만들 때 웹에서 표시되는 부분은 javascript를 사용하여 만들어야만 했으며, 서버는 ruby, java 등 다른 언어를 써서 만들어야 했는데, 마침내 한가지 언어로 전체 웹페이지를 만들 수 있게 된 것입니다.
Express는 node.js 의 framework 입니다. framework 라는 것은 어떠한 작업을 쉽게 완성하기 위한 라이브러리의 집합이라고 할 수 있습니다. 작업을 시작부터 끝까지 라이브러리로 지원한다는 점이 단순한 라이브러리와 차이가 나는 부분입니다. 예를 들면 JQuery는 javascript 라이브러리로 다양한 용도를 가지고 있지만, jquery 자체가 무엇 하나를 이루기 위한 목적을 가지고 있지는 않습니다. express는 node.js를 이용하여 웹 어플리케이션을 만들기위한 틀(frame)을 제공하는 라이브러리의 집합입니다.
Node.js를 쓰기 적합한 곳
다음과 같은 경우에 Node.js를 사용할 경우 좋은 효율성을 발휘할 수 있습니다.
- 알림이나 실시간 대화같이 같이 데이터의 실시간 처리가 필요한 애플리케이션
- 사용자의 입력과 출력이 잦은 애플리케이션
- 데이터 스트리밍 애플리케이션
- JSON API기반의 애플리케이션
- 단일 페이지 기반의 애플리케이션
출처: https://geonlee.tistory.com/92 [빠리의 택시 운전사]
Node.js 정의 및 특징: http://sblog.netraweb.com/node-js-%EA%B0%95%EC%A2%8C-node-js-%EB%9E%80-%EA%B0%9C%EB%85%90%EA%B3%BC-%EC%86%8C%EA%B0%9C/
Node.js 심화: https://geonlee.tistory.com/92
3. 웹 서버(WEB SERVER) & 운영체제(OS)
프로그래머라고 해서 프로그래밍만 하는 것은 아닙니다. 홈페이지를 제작하고 웹서버에 세팅을 하기위한 기본적인 웹서버 및 운영체제 지식도 필요합니다.
운영체제에 따라 리눅스에서는 아파치(Apache), 윈도우즈에서는 IIS(Internet Information Services) 웹서버를 주로 사용합니다.
일반적인 홈페이지 제작 시에는 호스팅 업체에서 제공하는 웹서버를 사용하므로 크게 웹서버를 세팅 할 필요는 없습니다만, 가끔 웹서버에 접속해서 작업을 해야할 때가 있습니다.
특히 PHP를 사용하게되면 주로 리눅스 운영체제를 사용하는데 기본적인 리눅스 명령어 및 FTP, Telnet 사용법에 대한 지식이 필요합니다.
웹서버란? "Web server"는 하드웨어, 소프트웨어 혹은 두 개 모두를 의미할 수 있습니다.
- 하드웨어 측면에서, web server는 website의 컴포넌트 파일들을 저장하는 컴퓨터입니다. (컴포넌트 파일에는 HTML 문서, images, CSS stylesheets, 그리고 JavaScript files가 있습니다.) 그리고 이 파일들을 최종 소비자의 디바이스에 전달합니다. web server는 인터넷에 연결되어 있고, mozilla.org와 같은 domain name을 통해 접속될 수 있습니다.
- 소프트웨어 측면에서, web server는 기본적으로 웹 사용자가 어떻게 호스트 파일들에 접근하는지를 관리합니다. 이 문서에서 web server는 HTTP서버로 국한합니다. HTTP 서버는 URL(Web addresses)과 HTTP(당신의 브라우저가 웹 페이지를 보여주기 위해 사용하는 프로토콜)의 소프트웨어 일부입니다.
가장 기본적인 단계에서, 브라우저가 웹 서버에서 불려진 파일을 필요로 할때, 브라우저는 HTTP를 통해 파일을 요청합니다. 요청이 올바른 웹 서버(하드웨어)에 도달하였을 때, HTTP 서버(software)는 요청된 문서를 HTTP를 이용해 보내줍니다.
출처: https://developer.mozilla.org/ko/docs/Learn/Common_questions/What_is_a_web_server
4. 데이터베이스(DATABASE)
데이터베이스는 말 그대로 각종 데이터를 저장하기 위한 공간입니다. 일반적인 홈페이지는 게시판에 올라오는 글을 저장, 관리하기 위해 데이터베이스를 사용합니다.
데이터베이스 역시 운영체제에 따라 리눅스는 MySQL, 윈도우즈는 MS-SQL을 주로 사용합니다.
데이터를 DB에 저장하고 관리하기 위해서는 SQL(Structured Query Language)을 알아야 합니다. SQL은 질의문으로 쉽게 말해 문자열 형태의 명령어입니다.
이외에 Oracle DB, Maria DB 도 있음.
MySQL은 오픈소스이고 무료입니다. 이런 이유로 많은 웹 애플리케이션이 MySQL을 기본 데이터베이스로 채택하고 있습니다.
SQL 언어란? https://brunch.co.kr/@minu-log/5