본문 바로가기

Tech/BoostCourse - WEB

[부스트 코스] 웹 Front-End 와 웹 Back_End

웹 개발자 채용 공고를 살펴보면 백엔드 개발, 프론트엔드 개발이라는 용어가 자주 등장하는 것을 볼 수 있다.

네이버 채용 공고에서도 백엔드 & 프론트엔드 개발이란 용어가 보인다.

 

 

웹 개발은 프론트엔드(FE)백엔드(BE)로 나눠진다.

 

 

완벽한 설명은 아니지만 쉽게 이야기하자면

프론트엔드는 물 위에 있는 백조의 모습을 표현하는 것이고

백엔드는 백조가 물 위에 떠있기에 열심히 물갈퀴질을 하고 있는 백조의 발을 표현하는 것

 

 

프론트엔드가 프로그램 쪽의 앞 쪽, 클라이언트의 입장에서 개발이 진행된다면

백엔드는 프로그램의 뒤 쪽, 즉 서버 입장에서 개발이 진행됨

 

 

프론트엔드를 다른 말로 클라이언트 사이드(Client side)라고 말한다면

백엔드는 서버 사이드(Server side)라고 말한다.

 

 

 

웹 프론트엔드(Front-End)

사용자에게 웹을 통해 다양한 콘텐츠(문서, 동영상, 사진 등)를 제공함
또한, 사용자의 요청(요구사항)에 반응해서 동작함

 

웹 프론트엔드의 역할

  • 웹콘텐츠를 잘 보여주기 위해 구조를 만들어야 함(신문, 책 등과 같이) - HTML
  • 적절한 배치와 일관된 디자인 등을 제공해야 함(보기 좋게) - CSS
  • 사용자 요청을 잘 반영해야 함 (소통하듯이) - Javascript

 

*Chrome에서 F12를 누르면 개발자 도구가 열린다. 현재 웹사이트의 HTML, CSS, Javascript을 살펴볼 수 있다.

 

HTML

HyperText Markup Language

원하는 문서의 구조를 표현할 수 있는 프로그래밍 언어

태그 형식 <a>...<a/>으로 되어 있음

 

CSS

웹 페이지를 꾸미기 위해서 각각의 HTML 태그를 꾸미기 위한 규칙을 표현하는 프로그래밍 언어

태그 내의 값의 크기, 여백, 위치 등을 설정할 수 있음

 

JavaScript

HTML, CSS의 움직임 등을 변경하기 위해 이용하는 프로그래밍 언어

 

 

웹 백엔드(Back-End)

정보를 처리하고 저장하며, 요청에 따라 정보를 내려주는 역할을 한다. 기령 쇼핑몰이라면, 상품 정보를 가지고 있고, 주문을 받아서 저장하고, 사용자가 관심있어 하는 상품을 골라주는 역할이 백엔드의 역할이다.

 

백엔드 개발자가 알아야 할 것들

  • 프로그래밍 언어(JAVA, Python, PHP, *Javascript 등)
  • 웹의 동작 원리
  • 알고리즘(algorithm), 자료구조 등 프로그래밍 기반 지식
  • 운영체제, 네트워크 등에 대한 이해
  • 프레임워크에 대한 이해 (예: Spring)
  • DBMS**에 대한 이해와 사용방법(예: MySQL, Oracle 등)

 

*Javascript는 프론트에서 많이 쓰이는 언어이지만, 여러가지 기술이 추가되면서 백엔드의 입장으로서도 처리할 수 있게 되었다.(그 것이 Node.js)

**DBMS는 데이터베이스 관리 시스템으로 데이터베이스를 쉽게 조작할 수 있는 별도의 소프트웨어를 의미한다.

 

 

[관련 부스트코스 강의 링크] https://www.edwith.org/boostcourse-web/lecture/16662/ 

 

 

반응형