웹 개발 분류와 차이

웹 개발

웹 개발은 크게 두 가지로 분류할 수 있습니다.

  • Front-end Develop (=Client Side Develop)
  • Back-end Develop (=Server Side Develop)

이 두가지의 차이와 경계를 명확하게 이해를 해야 웹 개발을 할 때 수월합니다.

Front-End Develop

Front-end를 번역하자면 '앞단' 입니다. 이러한 용어를 처음 접한 사람은 무슨 뜻인지 이해하기가 쉽지 않을 것입니다. 쉽게 말해 '보여지는 것'을 만드는 것이 Front-end Develop 입니다. 즉, User Interface를 개발합니다. 그래서 Front-end 개발자는 HTML, CSS, Javascript 등을 사용합니다.

Front-end 개발을 하는 이유는 사용자가 사이트를 이해하고 사용하기 쉽게 하기 위해서입니다. 요즘에는 모바일, 테블릿, 데스크톱 등 다양한 디바이스를 사용하며, 다양한 해상도를 가지고 있습니다. Front-End 개발자는 이러한 특성을 모두 고려하여 정교하게 개발을 해야 합니다.

즉, Front-end 개발자는, 서로다른 브라우저, 서로다른 운영체제, 서로다른 플랫폼에서 자신이 만든 웹 사이트가 정상적으로 나타나는지 확인해야 합니다.

Front-End Develop 요소에 대해 살펴보겠습니다.

  • HTML(Hyper Text Markup Language)
    • 텍스트에 의미를 부여
    • 태그로 마크업을 하면, 해당 텍스트에 의미가 부여됨
    • 뼈대
  • CSS(Cascading Style Sheet)
    • 태그를 꾸며주는 역할
    • 뼈대에 살을 붙임
  • Javascript(ECMAScript)
    • BOM(Brower Object Model) - 브라우저(window) 조작
    • DOM(Document Object Model) - 태그
      (document) 조작
    • 움직임을 부여함

CSS를 하기 위해서는 일단 HTML에 대해 깊게 이해하고 있어야 합니다. 마찬가지로 javascript를 통하여 웹 사이트에 역동적인 효과를 주기 위해선 HTML과 CSS 모두 깊게 이해하고 있어야 가능합니다. 따라서 front-end 개발자가 되기 위해선 javascript만 한다고 되는 것이 아니라 html과 css를 같이 공부하고 이해해야 가능합니다.

Javascript를 통해서 할 수 있는 것은 크게 2가지 입니다. 다르게 말해서, javascript를 사용하는 목적이 2가지 입니다. 하나는 브라우저(크롬, 익스플로러, 파이어폭스 등)를 조작하는 것이며,다른 하나는 HTML을 조작하는 것입니다.

브라우저를 조작한다는 것은 다음과 같은 것들을 말합니다.

  • 페이지 이동, 새로고침, 이전 페이지, 다음 페이지 등
  • 경고창 띄우기
  • 브라우저의 주소 조작
  • 크롬의 내부 저장소 조작
  • 세션 및 쿠키 조작
  • Ajax

HTML을 조작한다는 것은 말 그대로 HTML 태그에 대한 추가, 수정, 삭제를 의미합니다.

앞으로 필자가 다루게 될 내용은 이러한 front-end develop을 하기 위한 준비 과정이라고 이해하면 좋을 듯 합니다.


Back-end Develop

back-end develop은 다른 말로 Server side develop 이라고 합니다. 즉, 서버 개발입니다. front-end develop은 client side develop으로, server에서 보내는 데이터를 처리하여 사용자에게 응답해주는 역할을 수행합니다.

front-end의 역할은 "사용자의 화면, 즉, User Interface을 다루는 것"으로 굉장히 명료합니다. 그러나 back-end의 역할은 하나로 정의할 수 없습니다. 그 범위가 굉장히 광범위 하기 때문입니다. 어쨋든 하나 확실한 것은, client 측의 요청(Request)를 처리하여 응답(Response) 해주는 역할을 합니다. 이 응답의 형태는 단순 Text가 되기도 하고, 하나의 HTML 페이지가 되기도 하고, JSON 데이터가 되기도 하고, XML 데이터가 되기도 합니다. 요청을 처리하는 과정에서 데이터를 정제하여 인공지능 개발에 이용하기도 합니다.

back-end에서 다루는 언어는 굉장히 많습니다. C#, java, Golang, Node.js, C++, Ruby, Python, Scala 및 기타 등 많은 만큼 공부해야 할 내용도 굉장히 광범위 합니다. 확실한 것은, 어떤 언어를 사용하든 그 목적은 똑같다는 것입니다. 그러니까 back-end 개발자가 되기 위해선 먼저 어떤 언어를 사용할지 정해야 합니다. back-end에서도 Javascript를 사용하여 서버를 개발할 수 있습니다. 그러나 브라우저상에서 동작하는 javascript와 다른 목적 사용된 다는 것을 알아야 합니다.


마지막으로 DevOps.

DevOps는 개발을 하기 위한 기초 정도라고 이해하면 좋을 것 같습니다. 개발환경이 될 수도 있고, 운영체제가 될 수도 있고, 개발 툴이 될 수도 있습니다. 하나 확실한 것은, DevOps를 모른다면 뛰어난 개발자가 될 수 없습니다.

운영체제, 자료구조, 알고리즘, 디자인패턴, 개발방법론, 깃허브 및 기타 등 굉장히 많은 내용이 있습니다.




참고사이트