프론트엔드 와 백엔드의 개념 및 차이점

프론트엔드 와 백엔드의 개념 및 차이점

안녕하세요. 웹 어플리케이션을 만들거나 모바일 앱을 만들 때 프론트엔드와 백엔드 개발은 필수요소입니다. 하지만 기술에 대해서 잘 모르신다면 프론트엔드 개발과 백엔드 개발의 차이점을 이해하기 어려우실수 있는데요. 두가지 개발은 모두 강력한 성능을 가진 웹이나 모바일 솔루션 구축을 위한 서로 다른 기술들입니다.

 

그렇다면 프론트엔드와 백엔드 어떤 것인지 한번 알아보겠습니다.

 

프론트엔드(FRONT-END)

 

사용자가 웹사이트나 웹 애플리케이션의 URL을 입력했거나 모바일 애플리케이션을 다운로드 할 때 사용자들은 깔끔한 레이아웃을 가진 인터페이스를 보게 됩니다. 이렇게 사용자가 마주볼 수 있는 인터페이스를 "프론트엔드" 라고 부릅니다.

 

프론트엔드는 사용하기 쉽고 완전한 기능을 갖춘 인터페이스를 갖추었을 때만 사용자들의 참여를 끌어낼수 있기 때문에 아주 중요한 요소라고 할 수 있습니다. 서비스의 경쟁력을 유지하기 위해서는 강력한 프론트엔드 구축이 필요합니다.

 

프론트엔드 개발이란 ?

프론트엔드란 위에서 언급했듯이 사용자들이 웹사이트에서 보고 상호작용을 하는 모든 것들이 프론트엔드 분야에 속합니다. 프론트엔드 개발은 주로 웹과 모바일 솔루션의 사용자 인터페이스 (UI) 와 사용자 경험(UX)를 만드는데 초점을 두고 있습니다. 

 

슬라이더, 드롭다운메뉴, 레이아웃, 폰트, 컬러 등 모든 요소들이 프론트엔드 개발을 이루는 부분입니다. 시선을 사로잡는 프론트엔드를 만들기 위해서 HTML, CSS, 자바스크립트 가 가장 중요한 역할을 합니다.

 

프론트엔드 개발에서 사용하는 언어는 어떤 것들인가?

 

HTML
: HTML은 하이퍼텍스트와 마크업 언어로 구성되어 있습니다. 하이퍼텍스트는 페이지들 사이의 링크를 정의해 줍니다. 반면에 마크업 언어는 웹페이지의 구조를 정의하는데 사용됩니다.

CSS
: CSS는 종속 스타일 시트(Cascading Style Sheets)의 약자입니다. CSS는 개발자가 웹페이지에 다양한 스타일을 적용할 수 있게 해줌으로써 애플리케이션 페이지를 표시하는 프로세스를 단순하게 만들어주는 디자인 언어입니다. CSS는 HTML보다 독립적으로 작동해서 각 웹페이지들을 보완해 줍니다.

Javascript
: 자바스크립트는 어마어마할 정도로 인기가 많은 언어로써, 사용자들을 위해 상호작용하는 애플리케이션을 만들 수 있도록 도와줍니다. 또한, 웹사이트의 기능성을 향상시키는데 사용되며, 웹 기반의 소프트웨어 또는 게임들을 실행할 수 있게 해줍니다.

​

​

프론트엔드 개발에서 사용되는 테크놀로지는 무엇일까?

​

AngularJS
: 앵귤러JS는 오픈소스 자바스크립트 프레임워크로써, 주로 싱글 페이지 웹 애플리케이션(SPA)을 만드는 데 사용됩니다. 앵귤러JS는 계속해서 발전하고 있으며, 개발자가 웹 애플리케이션을 더욱 잘 만들 수 있게 해주는 프론트엔드 개발 테크놀로지들 중 하나입니다. 앵귤러 JS는 정적(static) HTML을 동적(dynamic) HTML로 변환해주는 기능이 있습니다. 또한 오픈소스 테크놀로지이기 때문에, 누구나 자유롭게 사용할 수 있고, 변경할 수도 있습니다.

ReactJS
: 리액트는 프론트엔드 개발에서 사용할 수 있는 유연하고 효과적인 선언형(declarative)의 자바스크립트 라이브러리입니다. 뛰어난 사용자 인터페이스를 만드는 데 도움이 되죠. 리액트는 컴포넌트 기반의 오픈소스 라이브러리이며, 애플리케이션의 반응형 뷰 레이어(view layer)입니다. 이 기술은 페이스북이 개발해서 유지관리를 해오고 있습니다.

​Bootstrap
: 부트스트랩은 반응형 웹 애플리케이션 및 웹사이트를 개발하기 위해 사용되는 오픈소스 무료 도구입니다. 부트스트랩은 가장 인기 있는 자바스크립트, CSS, HTML 프레임워크이며, 모바일 우선의 반응형 웹사이트를 구축할 수 있게 해줍니다.

 

 

백엔드(BACK-END)

용어 자체에서 알 수 있듯이, 백엔드는 웹사이트나 웹 애플리케이션 또는 모바일 솔루션의 프로세스와 관련된 서버측(server-side)과 데이터베이스를 관리해주는 테크놀로지입니다. 프론트엔드가 눈에 직접적으로 보여지는 영역이였다면, 백엔드는 눈에 보이지 않는 서버에서 작용하는 기술을 다룹니다.

​

​

백엔드 개발이란 무엇인가?

백엔드는 소프트웨어 개발 프로세스에서 서버 측 개발 분야입니다. 백엔드에서는 데이터를 저장하고 관리하며, 웹사이트의 클라이언트 측(client-side)에서 모든 것이 매끄럽게 작동할 수 있게 해줍니다.

백엔드는 사용자들이 직접 보거나 상호작용할 수는 없지만, 소프트웨어 개발의 일부분인 것은 맞습니다. 백엔드에서는 프론트엔드에 있는 사용자들이 취하는 행동들을 처리합니다. 즉, 사용자들은 백엔드에 간접적으로 액세스하는 것이죠. 백엔드 개발에는 사용자 인터페이스가 없는 시스템 컴포넌트 작업, API작성, 라이브러리 생성, 데이터베이스 통합 등 다양한 활동들이 포함되어 있습니다.

​

백엔드 개발에서 사용되는 언어들은 어떤 것들일까?

 

PHP
: 특별히 웹 애플리케이션 개발을 위해서 고안된 서버 측 스크립트 언어입니다. PHP는 서버 측에서 실행되기 때문에, 특히 서버 측 언어로서 많은 인기를 얻고 있습니다.

Node.js
: 노드는 크로스 플랫폼의 오픈소스 런타임(run time) 환경으로써, 브라우저의 외부에서 자바스크립트 코드를 실행할 수 있게 해줍니다. 노드는 프로그래밍 언어도 아니고, 프레임워크도 아닙니다. 노드는 모바일이나 웹 어플리케이션용 API와 같은 백엔드 서비스 개발을 위해서 사용됩니다. 이미 페이팔, 우버, 월마트, 넷플릭스 등 포춘지 선정 500대 기업에서 많이들 사용하고 있죠.

​Javascript
: 앞서 프론트엔드 때 소개해드렸던 자바스크립트는, 백엔드와 프론트엔드 모두에서 사용할 수 있는 프로그래밍 언어입니다.​

C++
: C++은 요즘에도 경쟁력을 갖추기 위해서 가장 널리 사용되는 프로그래밍 언어입니다. 또한, 백엔드 언어로도 많은 인기를 얻고 있죠.

Java
: 자바는 가장 인기 있는 프로그래밍 언어들 중 하나이며, 개발자 커뮤니티에서 널리 사용되고 있는데요. 자바의 컴포넌트는 쉽게 사용할 수 있기 때문에 확장성이 아주 뛰어난 플랫폼이라고 말할 수 있습니다.

Python
: 파이썬은 개발자들이 시스템을 효율적으로 통합하고, 빠르게 작업할 수 있게 해주는 최고의 프로그래밍 언어입니다.

​

​

백엔드에서 사용되는 테크놀로지는 무엇일까?

​

Express
: 익스프레스는 웹 애플리케이션 구축에 사용되는 노드(Node.js)용 무료 오픈소스 프레임워크입니다. 익스프레스는 MIT의 라이선스에 의해 공개되고 있으며, API를 만들고 웹 애플리케이션을 구축할 수 있게 해줍니다.

​Laravel
: 라라벨은 무료이며, 오픈소스인 PHP 웹 프레임워크입니다. 캐싱(caching), 라우팅(routing), 인증(authentication), 세션(session)과 같은 대부분의 웹 개발에서 사용되는 공통 작업들을 심플하게 만들어줍니다. 또한, 어플의 기능에 영향을 주지 않으면서 프로그래머에게 개발 프로세스를 간단하게 해주죠.

​C#
: C#은 유연하면서도 강력한 프로그래밍 언어입니다. 다양한 종류의 애플리케이션을 만드는 데 사용될 수 있는데요. 이 기술은 개발 도구, 웹사이트, 컴파일러와 같은 다양한 프로젝트에 사용되고 있습니다. C#은 객체지향(object-oriented) 프로그래밍 언어를 만드는 데 도움이 됩니다.

 

함께 보면 좋은 글

 

2021/02/24 - [IT정보] - 국비지원 무료교육 의 모든 정보

2021/02/23 - [모바일 정보] - 갤럭시 폴드2 스펙 및 가격

2021/02/22 - [모바일 정보] - 갤럭시 워치 3 혈압에 심전도까지 체크 가능

2021/02/21 - [모바일 정보] - 갤럭시 버즈 프로 사용법과 착용법

2021/02/20 - [모바일 정보] - 갤럭시 S10 플러스 스펙 정보