#!if 넘어옴1 != null
''''''{{{#!if 넘어옴2 == null
{{{#!if 넘어옴1[넘어옴1.length - 1] >= 0xAC00 && 넘어옴1[넘어옴1.length - 1] <= 0xD7A3
{{{#!if ((넘어옴1[넘어옴1.length - 1] - 0xAC00) % 28) == 0
는}}}{{{#!if ((넘어옴1[넘어옴1.length - 1] - 0xAC00) % 28) != 0
은}}}}}}{{{#!if 넘어옴1[넘어옴1.length - 1] < 0xAC00 || 넘어옴1[넘어옴1.length - 1] > 0xD7A3
은(는)}}}}}}{{{#!if 넘어옴2 != null
, ''''''{{{#!if 넘어옴3 == null
{{{#!if 넘어옴2[넘어옴2.length - 1] >= 0xAC00 && 넘어옴2[넘어옴2.length - 1] <= 0xD7A3
{{{#!if ((넘어옴2[넘어옴2.length - 1] - 0xAC00) % 28) == 0
는}}}{{{#!if ((넘어옴2[넘어옴2.length - 1] - 0xAC00) % 28) != 0
은}}}}}}{{{#!if 넘어옴2[넘어옴2.length - 1] < 0xAC00 || 넘어옴2[넘어옴2.length - 1] > 0xD7A3
은(는)}}}}}}}}}{{{#!if 넘어옴3 != null
, ''''''{{{#!if 넘어옴4 == null
{{{#!if 넘어옴3[넘어옴3.length - 1] >= 0xAC00 && 넘어옴3[넘어옴3.length - 1] <= 0xD7A3
{{{#!if ((넘어옴3[넘어옴3.length - 1] - 0xAC00) % 28) == 0
는}}}{{{#!if ((넘어옴3[넘어옴3.length - 1] - 0xAC00) % 28) != 0
은}}}}}}{{{#!if 넘어옴3[넘어옴3.length - 1] < 0xAC00 || 넘어옴3[넘어옴3.length - 1] > 0xD7A3
은(는)}}}}}}}}}{{{#!if 넘어옴4 != null
, ''''''{{{#!if 넘어옴5 == null
{{{#!if 넘어옴4[넘어옴4.length - 1] >= 0xAC00 && 넘어옴4[넘어옴4.length - 1] <= 0xD7A3
{{{#!if ((넘어옴4[넘어옴4.length - 1] - 0xAC00) % 28) == 0
는}}}{{{#!if ((넘어옴4[넘어옴4.length - 1] - 0xAC00) % 28) != 0
은}}}}}}{{{#!if 넘어옴4[넘어옴4.length - 1] < 0xAC00 || 넘어옴4[넘어옴4.length - 1] > 0xD7A3
은(는)}}}}}}}}}{{{#!if 넘어옴5 != null
, ''''''{{{#!if 넘어옴6 == null
{{{#!if 넘어옴5[넘어옴5.length - 1] >= 0xAC00 && 넘어옴5[넘어옴5.length - 1] <= 0xD7A3
{{{#!if ((넘어옴5[넘어옴5.length - 1] - 0xAC00) % 28) == 0
는}}}{{{#!if ((넘어옴5[넘어옴5.length - 1] - 0xAC00) % 28) != 0
은}}}}}}{{{#!if 넘어옴5[넘어옴5.length - 1] < 0xAC00 || 넘어옴5[넘어옴5.length - 1] > 0xD7A3
은(는)}}}}}}}}}{{{#!if 넘어옴6 != null
, ''''''{{{#!if 넘어옴7 == null
{{{#!if 넘어옴6[넘어옴6.length - 1] >= 0xAC00 && 넘어옴6[넘어옴6.length - 1] <= 0xD7A3
{{{#!if ((넘어옴6[넘어옴6.length - 1] - 0xAC00) % 28) == 0
는}}}{{{#!if ((넘어옴6[넘어옴6.length - 1] - 0xAC00) % 28) != 0
은}}}}}}{{{#!if 넘어옴6[넘어옴6.length - 1] < 0xAC00 || 넘어옴6[넘어옴6.length - 1] > 0xD7A3
은(는)}}}}}}}}}{{{#!if 넘어옴7 != null
, ''''''{{{#!if 넘어옴8 == null
{{{#!if 넘어옴7[넘어옴7.length - 1] >= 0xAC00 && 넘어옴7[넘어옴7.length - 1] <= 0xD7A3
{{{#!if ((넘어옴7[넘어옴7.length - 1] - 0xAC00) % 28) == 0
는}}}{{{#!if ((넘어옴7[넘어옴7.length - 1] - 0xAC00) % 28) != 0
은}}}}}}{{{#!if 넘어옴7[넘어옴7.length - 1] < 0xAC00 || 넘어옴7[넘어옴7.length - 1] > 0xD7A3
은(는)}}}}}}}}}{{{#!if 넘어옴8 != null
, ''''''{{{#!if 넘어옴9 == null
{{{#!if 넘어옴8[넘어옴8.length - 1] >= 0xAC00 && 넘어옴8[넘어옴8.length - 1] <= 0xD7A3
{{{#!if ((넘어옴8[넘어옴8.length - 1] - 0xAC00) % 28) == 0
는}}}{{{#!if ((넘어옴8[넘어옴8.length - 1] - 0xAC00) % 28) != 0
은}}}}}}{{{#!if 넘어옴8[넘어옴8.length - 1] < 0xAC00 || 넘어옴8[넘어옴8.length - 1] > 0xD7A3
은(는)}}}}}}}}}{{{#!if 넘어옴9 != null
, ''''''{{{#!if 넘어옴10 == null
{{{#!if 넘어옴9[넘어옴9.length - 1] >= 0xAC00 && 넘어옴9[넘어옴9.length - 1] <= 0xD7A3
{{{#!if ((넘어옴9[넘어옴9.length - 1] - 0xAC00) % 28) == 0
는}}}{{{#!if ((넘어옴9[넘어옴9.length - 1] - 0xAC00) % 28) != 0
은}}}}}}{{{#!if 넘어옴9[넘어옴9.length - 1] < 0xAC00 || 넘어옴9[넘어옴9.length - 1] > 0xD7A3
은(는)}}}}}}}}}{{{#!if 넘어옴10 != null
, ''''''{{{#!if 넘어옴10[넘어옴10.length - 1] >= 0xAC00 && 넘어옴10[넘어옴10.length - 1] <= 0xD7A3
{{{#!if ((넘어옴10[넘어옴10.length - 1] - 0xAC00) % 28) == 0
는}}}{{{#!if ((넘어옴10[넘어옴10.length - 1] - 0xAC00) % 28) != 0
은}}}}}}{{{#!if 넘어옴10[넘어옴10.length - 1] < 0xAC00 || 넘어옴10[넘어옴10.length - 1] > 0xD7A3
은(는)}}}}}} 여기로 연결됩니다. #!if 설명 == null && 리스트 == null
{{{#!if 설명1 == null
다른 뜻에 대한 내용은 아래 문서를}}}{{{#!if 설명1 != null
{{{#!html }}}에 대한 내용은 [[프론트엔드]] 문서{{{#!if (문단1 == null) == (앵커1 == null)
를}}}{{{#!if 문단1 != null & 앵커1 == null
의 [[프론트엔드#s-|]]번 문단을}}}{{{#!if 문단1 == null & 앵커1 != null
의 [[프론트엔드#|]] 부분을}}}}}}{{{#!if 설명2 != null
, {{{#!html }}}에 대한 내용은 [[백엔드]] 문서{{{#!if (문단2 == null) == (앵커2 == null)
를}}}{{{#!if 문단2 != null & 앵커2 == null
의 [[백엔드#s-|]]번 문단을}}}{{{#!if 문단2 == null & 앵커2 != null
의 [[백엔드#|]] 부분을}}}}}}{{{#!if 설명3 != null
, {{{#!html }}}에 대한 내용은 [[]] 문서{{{#!if (문단3 == null) == (앵커3 == null)
를}}}{{{#!if 문단3 != null & 앵커3 == null
의 [[#s-|]]번 문단을}}}{{{#!if 문단3 == null & 앵커3 != null
의 [[#|]] 부분을}}}}}}{{{#!if 설명4 != null
, {{{#!html }}}에 대한 내용은 [[]] 문서{{{#!if (문단4 == null) == (앵커4 == null)
를}}}{{{#!if 문단4 != null & 앵커4 == null
의 [[#s-|]]번 문단을}}}{{{#!if 문단4 == null & 앵커4 != null
의 [[#|]] 부분을}}}}}}{{{#!if 설명5 != null
, {{{#!html }}}에 대한 내용은 [[]] 문서{{{#!if (문단5 == null) == (앵커5 == null)
를}}}{{{#!if 문단5 != null & 앵커5 == null
의 [[#s-|]]번 문단을}}}{{{#!if 문단5 == null & 앵커5 != null
의 [[#|]] 부분을}}}}}}{{{#!if 설명6 != null
, {{{#!html }}}에 대한 내용은 [[]] 문서{{{#!if (문단6 == null) == (앵커6 == null)
를}}}{{{#!if 문단6 != null & 앵커6 == null
의 [[#s-|]]번 문단을}}}{{{#!if 문단6 == null & 앵커6 != null
의 [[#|]] 부분을}}}}}}{{{#!if 설명7 != null
, {{{#!html }}}에 대한 내용은 [[]] 문서{{{#!if (문단7 == null) == (앵커7 == null)
를}}}{{{#!if 문단7 != null & 앵커7 == null
의 [[#s-|]]번 문단을}}}{{{#!if 문단7 == null & 앵커7 != null
의 [[#|]] 부분을}}}}}}{{{#!if 설명8 != null
, {{{#!html }}}에 대한 내용은 [[]] 문서{{{#!if (문단8 == null) == (앵커8 == null)
를}}}{{{#!if 문단8 != null & 앵커8 == null
의 [[#s-|]]번 문단을}}}{{{#!if 문단8 == null & 앵커8 != null
의 [[#|]] 부분을}}}}}}{{{#!if 설명9 != null
, {{{#!html }}}에 대한 내용은 [[]] 문서{{{#!if (문단9 == null) == (앵커9 == null)
를}}}{{{#!if 문단9 != null & 앵커9 == null
의 [[#s-|]]번 문단을}}}{{{#!if 문단9 == null & 앵커9 != null
의 [[#|]] 부분을}}}}}}{{{#!if 설명10 != null
, {{{#!html }}}에 대한 내용은 [[]] 문서{{{#!if (문단10 == null) == (앵커10 == null)
를}}}{{{#!if 문단10 != null & 앵커10 == null
의 [[#s-|]]번 문단을}}}{{{#!if 문단10 == null & 앵커10 != null
의 [[#|]] 부분을}}}}}}#!if 설명 == null
{{{#!if 리스트 != null
다른 뜻에 대한 내용은 아래 문서를}}} 참고하십시오.#!if 리스트 != null
{{{#!if 문서명1 != null
* {{{#!if 설명1 != null
: }}}[[프론트엔드]] {{{#!if 문단1 != null & 앵커1 == null
문서의 [[프론트엔드#s-|]]번 문단}}}{{{#!if 문단1 == null & 앵커1 != null
문서의 [[프론트엔드#|]] 부분}}}}}}{{{#!if 문서명2 != null
* {{{#!if 설명2 != null
: }}}[[백엔드]] {{{#!if 문단2 != null & 앵커2 == null
문서의 [[백엔드#s-|]]번 문단}}}{{{#!if 문단2 == null & 앵커2 != null
문서의 [[백엔드#|]] 부분}}}}}}{{{#!if 문서명3 != null
* {{{#!if 설명3 != null
: }}}[[]] {{{#!if 문단3 != null & 앵커3 == null
문서의 [[#s-|]]번 문단}}}{{{#!if 문단3 == null & 앵커3 != null
문서의 [[#|]] 부분}}}}}}{{{#!if 문서명4 != null
* {{{#!if 설명4 != null
: }}}[[]] {{{#!if 문단4 != null & 앵커4 == null
문서의 [[#s-|]]번 문단}}}{{{#!if 문단4 == null & 앵커4 != null
문서의 [[#|]] 부분}}}}}}{{{#!if 문서명5 != null
* {{{#!if 설명5 != null
: }}}[[]] {{{#!if 문단5 != null & 앵커5 == null
문서의 [[#s-|]]번 문단}}}{{{#!if 문단5 == null & 앵커5 != null
문서의 [[#|]] 부분}}}}}}{{{#!if 문서명6 != null
* {{{#!if 설명6 != null
: }}}[[]] {{{#!if 문단6 != null & 앵커6 == null
문서의 [[#s-|]]번 문단}}}{{{#!if 문단6 == null & 앵커6 != null
문서의 [[#|]] 부분}}}}}}{{{#!if 문서명7 != null
* {{{#!if 설명7 != null
: }}}[[]] {{{#!if 문단7 != null & 앵커7 == null
문서의 [[#s-|]]번 문단}}}{{{#!if 문단7 == null & 앵커7 != null
문서의 [[#|]] 부분}}}}}}{{{#!if 문서명8 != null
* {{{#!if 설명8 != null
: }}}[[]] {{{#!if 문단8 != null & 앵커8 == null
문서의 [[#s-|]]번 문단}}}{{{#!if 문단8 == null & 앵커8 != null
문서의 [[#|]] 부분}}}}}}{{{#!if 문서명9 != null
* {{{#!if 설명9 != null
: }}}[[]] {{{#!if 문단9 != null & 앵커9 == null
문서의 [[#s-|]]번 문단}}}{{{#!if 문단9 == null & 앵커9 != null
문서의 [[#|]] 부분}}}}}}{{{#!if 문서명10 != null
* {{{#!if 설명10 != null
: }}}[[]] {{{#!if 문단10 != null & 앵커10 == null
문서의 [[#s-|]]번 문단}}}{{{#!if 문단10 == null & 앵커10 != null
문서의 [[#|]] 부분}}}}}}1. 개요
frontend-backend소프트웨어 아키텍처 설계 방식의 일종으로, 소프트웨어를 외부로 직접 노출되는 인터페이스인 프론트엔드와, 내부 구현/비즈니스 로직 등이 실제로 이루어지는 백엔드의 두 추상적 계층으로 분리하여 설계하는 기법이다.
전 세계적으로 프론트엔드/백엔드 관련 얘기를 한다면 거의 대부분은 웹 프로그래밍을 말하지만, 이 또한 해당 용어에서 파생된 개념이다.
2. 분야별 상세
프론트엔드-백엔드 구조는 매우 추상적이며, 엄밀하게 정의된 개념이 아니기에 각 분야나 사용 소프트웨어마다 뜻이 제각기 다른 편이다.또한 후술하지만 서버-클라이언트 구분과도 유사점이 많기 때문에, 분야에 따라 단순 관습으로 굳어진 용례도 상당하다. 예를 들어 게임 개발 분야의 경우 게임 백엔드가 아닌 게임 서버 개발 직군 등으로 불리는 식.
2.1. 라이브러리 및 구현
특정한 표준, 인터페이스, 프로토콜 등을 사용하거나 구현하는 라이브러리와 그 라이브러리를 사용(링크)하는 응용 소프트웨어(애플리케이션)가 있을 때, 전자를 백엔드, 후자를 프론트엔드라고 부른다.정의가 굉장히 넓고 모호하기 때문에 경우에 따라 driver, core, engine 등으로도 불린다.
프론트엔드/백엔드 양쪽 모두 한 번에 개발 가능하면 풀 스택(full stack)이라 한다.
2.2. 컴파일러, 프로그래밍 언어 구현
LLVM과 같은 모듈식 컴파일러 아키텍처에서는 개별 언어에 특화된 문법을 parse하여 표준 IR을 생성하는 영역까지를 컴파일러 프론트엔드, 이러한 IR을 받아들여 실제 native code, 또는 JIT 등의 방식으로 컴파일하는 영역을 컴파일러 백엔드라고 부른다.이외에도 디버깅 지원 등에서 링크한 실제 디버거를 백엔드라고 부르기도 한다. 예를 들면 gdb 백엔드와 lldb백엔드를 지원한다고 하는 식.
2.3. 그래픽 사용자 인터페이스
GUI를 가진 응용 소프트웨어의 경우, 사용자에게 보여지는 화면과 위젯, UI 등을 설계하는 분야를 프론트엔드, 실제 중요한 데이터를 저장하고 기능을 처리하는 부분을 백엔드로 구분하게 된다.2.3.1. 웹 프로그래밍
웹 프로그래밍에서는 웹 서버에서 웹 브라우저를 사용하는 유저에게 웹 페이지 등의 형태로 렌더되어 보여지는 영역을 웹 프론트엔드, 실제로 데이터를 저장하고 가공하는 영역을 웹 백엔드라 부른다.해당 분야에 한하여, 웹 프론트엔드와 웹 백엔드 기술을 통합 내지 통칭하여 풀스택, 이러한 영역을 모두 개발 가능한 직군을 풀스택 개발자라고 부른다.
#!if (문단 == null) == (앵커 == null)
를#!if 문단 != null & 앵커 == null
의 [[웹 프론트엔드#s-|]]번 문단을#!if 문단 == null & 앵커 != null
의 [[웹 프론트엔드#|]] 부분을#!if (문단 == null) == (앵커 == null)
를#!if 문단 != null & 앵커 == null
의 [[웹 백엔드#s-|]]번 문단을#!if 문단 == null & 앵커 != null
의 [[웹 백엔드#|]] 부분을#!if (문단 == null) == (앵커 == null)
를#!if 문단 != null & 앵커 == null
의 [[웹 풀스택#s-|]]번 문단을#!if 문단 == null & 앵커 != null
의 [[웹 풀스택#|]] 부분을2.3.2. 모바일 앱 프로그래밍
서버와 연결되는 앱의 경우도 웹과 비슷하게 프론트-백엔드 구조로 나누게 된다. 대부분의 경우 백엔드 또한 전통적인 웹 백엔드를 사용하고, 프론트의 경우 모바일 프로그래밍, 모바일 개발 등으로 불리게 된다.국내에서는 프론트엔드를 직역하여 앞단, 백엔드를 뒷단이라는 은어로 부르기도 하는데, 이때 라임을 맞추어(...) 모바일 쪽 개발을 앱단이라고 부르기도 한다.
서버 없이 standalone으로 동작하는 앱의 경우 딱히 프론트/백 구분을 하지는 않는 편이다.
3. 기타
서버-클라이언트와 유사한 개념이지만 미소한 차이가 있다. 프런트엔드는 주로 사용자(엔드 유저)에게 보여지거나 직접적으로 제시되는 요소를 의미한다면, 클라이언트는 순수하게 네트워크 맥락의 용어이다. 즉, HTTP라는 프로토콜이 있다면 HTTP/클라이언트는 네트워크 관계상 항상 클라이언트지만, HTTP를 통해 다양한 정보와 제어 권한을 유저에게 보여주고 사용 가능하게 한다면 이는 웹 프런트엔드이다.반대로 서버에서 동작하지만 그 역할은 프론트엔드에 부합하는 경우도 존재하다. 대표적인 예시가 SSR으로, 해당 작업은 통상 서버 또는 edge 환경에서 실행되지만, 작업의 결과물이 유저 인터페이스를 렌더하는 것이므로 프런트엔드 기술에 해당한다.