디퍼 커플 링, 헤드리스, 마이크로 서비스, 서버리스 ... 죄송합니다.이게 뭐야?
이 모든 것은 웹 개발의 뜨거운 주제이며 밀접하게 관련되어 있지만 정확히 동일하지는 않습니다. 이 용어를 자주들을 수 있으므로 처음부터 일부를 명확히하겠습니다.
커플 링 및 디커플링 및 헤드리스
커플 링 는 웹 사이트의 백엔드에 생성, 관리 및 저장되는 웹 사이트의 내용 (데이터베이스가 WordPress 관리자 패널과 같은 위치)을 나타냅니다. 그런 다음이 컨텐츠는 백엔드에서 추출되어 프론트 엔드 인터페이스 (예 : WordPress 템플릿)를 통해 브라우저에서 표시됩니다. 어느 정도 "커플 링 된"응용 프로그램은 전통적으로 "풀 스택"응용 프로그램이며 백엔드 및 프론트 엔드는 동일한 응용 프로그램의 다른 측면입니다.
대조적으로, 디퍼 커플 링 는 백엔드와 프론트 엔드가 별도로 관리된다는 것을 의미합니다. 즉, VIDEO . 물론, 일반적으로 API를 연결하려면 매체가 필요합니다. 또한 백엔드가 실제로 프론트 엔드와 분리되어 있으므로 실제로 다른 위치에 여러 개의 프론트 엔드가있을 수 있습니다! (Shopify와 같은 동일한 엔진을 사용하여 다른 매장에 대해 생각하십시오.)
요컨대, 헤드리스 소프트웨어
에는 프론트 엔드 또는 프레젠테이션 레이어가 전혀 없습니다. 예를 들어, 헤드리스 CMS는 정적 콘텐츠를 생성하고 모바일 애플리케이션, IoT 장치, 정적 웹 사이트와 같은 곳에서 푸시 할 수 있습니다. 분명히, 이것은 또한 "분리"상황이지만 여기서는 API가 필요하지 않을 수도 있습니다. 서비스를위한 정적 HTML 파일로 게시물을 내보내는 WordPress 엔진을 생각해보십시오. 이것은 헤드리스입니다. 사실, 당신은 이제 이런 식으로 생성 된 페이지에 있습니다. 모노 바디 (단단히 결합) 및 마이크로 서비스 (느슨하게 결합)
간단히 말해서, monotype 는 전체적으로 구축 된
소프트웨어로 정의 할 수 있습니다. 예제에는 모바일 애플리케이션, 컴퓨터에 설치할 수있는 대부분의 응용 프로그램 및 WordPress와 같은 웹 응용 프로그램이 포함될 수 있습니다. 이러한 애플리케이션에는 여전히 내부 "모듈"또는 "구성 요소"가있을 수 있지만 응용 프로그램의 필수 부분이 없기 때문에 응용 프로그램이 작동하지 않기 때문에 이들은 단단히 결합되어 있다고 말합니다.
반면에, 느슨하게 결합 된 소프트웨어 구성 요소는 제거 또는 교체 할 수있는 플러그인처럼 작동하며 기능이 변경 될 수 있지만 응용 프로그램의 핵심은 여전히 작동 할 수 있습니다. 이 원칙은 제 3 자 API (일반적으로 "마이크로 서비스"라고 함)를 통해 "아웃소싱"기능을 허용합니다. 이들은 본질적으로 애플리케이션에 필수적이지 않은 접근성 기능 (이미지 크기 조정, 로그인, 스토리지)을 제공하기 때문입니다.
서버리스 및 기존 컴퓨팅
정통, "Serverless"는 약간의 오해입니다. 어떤 종류의 컴퓨팅 작업을하든 서버가 참여할 것입니다. 그러나 서버에 액세스하고 관리하는 방법은 매우 다를 수 있습니다.
기존 모델 에는 실제 물리적 서버 (때로는 베어 메탈이라고도 함) 또는 물리적 서버의 A에 리소스와 다른 사용자에게 리소스가 할당되는 가상 개인 서버가있을 수 있습니다. 자원은 제한되어 있으며 자원의 100%를 사용하든 아니든 마치 마치 마치 마치 마치 마치 자원을 지불해야합니다.
서버리스 모델에서 많은 서버가 서로 연결되어 거대한 리소스 풀을 제공합니다. 필요한 경우 필요한 자원을 추출하여 필요에 따라 (위아래로) 확장하십시오. 실제 서버가 귀하의 것이라는 것을 실제로 확신 할 수는 없습니다. 리소스의 출처는 어디에서 나오는지 알고 있습니다.
전통적인 모델
서버리스 모델
자원이 제한된 물리 서버
무제한 리소스 풀
실패가 발생하기 쉬운 (예 : 하드 디스크 고장)
보다 신뢰할 수있는 아키텍처*
제한된 확장 성
무제한 확장 성
유휴 서비스를 포함한 모든 수수료를 지불하십시오
사용에 대한 지불 (주문에 대한 지불)
간단하고 사용하기 쉬운
배우고 구현해야합니다
** 하드 디스크, CPU 및 메모리 칩 고장은 여전히 발생합니다. 그러나 리소스가 투명하게 할당되므로 하드웨어가 실패하고 대체 되더라도 알 수 없습니다.
Jamstack의 실용적인 예
특히 이러한 개념에 익숙하지 않은 경우 많은 것들이 있습니다. 따라서 이론에서 벗어나 실생활에서 Jamstack의 실제 적용 중 일부를 보자. <:> 사례 연구 1 : WordPress를 10 배 속도 로 정적 웹 사이트로 변환합니다.
정적이 최선의 선택이라면 동적 WordPress (WP) 블로그를 정적 블로그로 변환하는 것보다 더 나은 것은 무엇입니까? 그렇게함으로써, 우리는 페이지 로딩 속도와 대기 시간을 적어도 몇 배 이상 줄이고 보안을 크게 향상 시키며 동시에 SEO를 향상시킵니다.
요컨대, 프로세스는 다음과 같습니다
정적 사이트 생성기 (SSG)를 사용하여 WP에서 기사와 페이지를 만들지 만 정적 형식 (Text, Markdown, HTML)으로 만듭니다.
Github, Gitlab 또는 Bitbucket의 저장소와 정적 컨텐츠를 동기화합니다.
배포 프로세스를 자동화하여 코드 저장소가 변경 될 때마다 변경 사항이 즉시 글로벌 CDN으로 온라인 상태가됩니다.
휴식, 무료 호스팅을 즐기고 안전하고 빠른 웹 사이트와 자동 배포를하십시오. ?
그러나 ...
물론 이것은 많은 문제를 만듭니다 :
관리 패널로 무엇을해야합니까?
카테고리 및 RSS 피드로 무엇을해야합니까?
지금 콘텐츠를 어떻게 관리합니까?
의견 섹션과 뉴스 레터로 무엇을해야합니까?
이 시점에서 WP 관리자 패널에 작별 인사를 할 수 있습니다. 이제부터 SSG를 사용하여 컨텐츠를 생성하기 때문입니다. 실제로 Jekyll과 같은 SSG는 블로그를 구축하도록 특별히 설계되었으며 Gatsby.js와 같은 SSG에는 이미 모든 기능이 포함되어 있습니다.
컨텐츠 관리 (기존 게시물 수정 등)는 헤드리스 CMS가 작동하는 곳입니다. 의견과 뉴스 레터의 경우 이미 외부 API (예 : Disqus 및 Mailchimp)를 사용하고 있습니까?
실제로 어떻게 했습니까?
우리는 여기에서 SSG 및 헤드리스 CMS의 INS를 다룰 수 없지만이 시리즈의 후속 조치에주의를 기울이십시오. WordPress 웹 사이트 마이그레이션에 대한 단계별 안내서를 제공 할 것입니다.
<:> 사례 연구 2 : 자동 파이프 라인으로 정적 웹 사이트를 무료로 호스팅
Jamstack 커뮤니티에서는 종종 "무료"를들을 수 있습니다. 고맙게도, 무료는 아닙니다. 는 여전히 신용 카드 번호를 무료로 알려야하기 때문입니다.
요컨대, 프로세스는 다음과 같습니다
이 경우, 우리는 정적 웹 사이트 (예 : 사례 연구에서 마이그레이션 한 블로그)를 가져 와서 온라인으로 말할 것입니다 : .
github, gitlab 또는 bitbucket 저장소를 설정하십시오.
NetLify, gitlab 페이지 또는 github 페이지에 배포하십시오.
이 시점에서 리포지토리로의 각 변경 사항은 새 배포 (Webhook을 통해)를 자동으로 트리거하고 무언가 잘못되면 매우 우아하게 롤백 할 수 있습니다.
왜 회사가 이러한 서비스를 무료로 제공합니까?
배포 된 CDN에 HTML 파일을 넣는 오버 헤드는 작습니다. 실제 계산은 관련이 없으며 PHP 렌더링은 관련이 없습니다. 많은 대역폭을 소비하는 매우 인기있는 웹 사이트를 호스팅하지 않으면 회사는 호스팅 서비스를 제공하는 것을 신경 쓰지 않습니다. 그렇게하면 좋은 홍보를 가져올 수 있습니다.
회사는 또한 많은 공짜를 포기함으로써 당신을 잠그게 할 것입니다. 고급 서비스가 필요할 때 (비즈니스가 성장하는 경우 필요한 서비스가 필요합니다) 이미 함께 일하고 있습니다. 공정합니다. 그 당시에는 문제를 해결하거나 유급 시간 동안 서비스를 사용하기 위해 임시 솔루션을 개발해야합니다.
실제로 어떻게 했습니까?
netlify 또는 github/gitlab은 매우 간단하며 최소한의 노력이 필요합니다. (그럼에도 불구하고, 우리는 다음 기사에서 과정을 자세히 설명 할 것입니다.)
Jamstack과 Full-Stack Development의 비교
이 새로운 접근 방식이 램프 또는 평균 스택과 어떻게 비교되는지 보자.
램프/평균 스택
Jamstack
웹 사이트를 실행하는 웹 서버
cdn 에 전 세계 배포
/> ftp/ssh 업로드, 서버 재시작
자동화 어셈블리 라인
런 페이지
프레 렌더 페이지를 높이기 위해 속도를 높입니다
모노비드 애플리케이션 (예 : WordPress)
API 및 마이크로 서비스 (프론트 엔드/백엔드 디커플링)
전체 스택 (전면 및 백엔드 언어)
단일 기술 스택 ( "JavaScript Everywhere")
Jamstack과 함께 무엇을 할 수 있습니까?
현재 웹 사이트를 만들면 이점을 배웠기를 바랍니다. 그러나 사용자 로그인 및 RDBMS (Relational Database)없이 동적 콘텐츠 관리 또는 저장과 같은 백엔드 처리없이 가장 기본적인 작업을 수행하는 방법에 대해 여전히 회의적 일 수 있습니다.
Jamstack과 함께 할 수있는 다른 예는 다음과 같습니다.
정적 웹 사이트를 사용하여 서버리스 데이터베이스를 구현하십시오
서비스로서의 정체성 (IDAAS) : 무국적자 인증
헤드리스 컨텐츠 관리 시스템
정적 웹 사이트에서 서버리스 함수 사용
다목적 형태의 관리
다중 플랫폼 알림 처리
헤드리스 쇼핑 카트
반응 검색
결론
사물의 발전은 특히 IT 분야에서 불가피합니다. 이전에는 램프 스택이었고 평균 스택이었습니다. 이제 Jamstack이며 5-10 년 후에는 다른 것이 될 것입니다. 이러한 변화를 받아들이고 우리 자신의 변화로 만드는 것이 좋습니다!
새로운 일을하는 방법을 배우는 것은 번거롭게 들릴 수 있지만 개발에 대한 열정을 활성화시킬 수도 있습니다. 서버를 유지하는 데 시간이 줄어들고 보안 문제에 대해 걱정할 수 있습니다. 개발에는 노력이 적고 고객이 더 만족한다는 것을 알 수 있습니다. 이 때문에 경쟁력이 높아질 수도 있고 (인상을 요구할 수 있음). ?
Jamstack Basics
이 주제에 대한 더 많은 기사를 따르십시오. 우리는 몇 년 동안 Jamstack을 소개 해 왔지만 독립적 인 훈련과 실습이되었습니다. Jamstack 전문가가 되어이 페이지의 인덱스에서 업데이트하는 데 필요한 자습서를 제공합니다. RSS 피드 또는 소셜 미디어를 최신 상태로 유지할 수도 있습니다.
Jamstack Basics
Jamstack 소개 : 안전하고 고성능 웹 사이트를 구축하십시오
Jamstack 도구, API 및 서비스 : 포괄적 인 비교
자동 파이프 라인을 사용하여 정적 웹 사이트를 무료로 호스팅하는 방법
WordPress에서 정적 사이트 생성기로 마이그레이션하는 방법
Jamstack 도구
GATSBY 시작하기 : 첫 번째 정적 웹 사이트를 구축하십시오
초보자
그리고 더 많은 지속적인 작업.
jamstack 에 대한 질문이 자주 묻습니다
Jamstack이란 무엇입니까? Jamstack은 "JavaScript, API 및 태그"를 나타냅니다. 이는 웹 사이트 및 웹 애플리케이션을 구축하기위한 아키텍처로, 더 나은 성능, 보안 및 개발자 경험을 위해 백엔드에서 프론트 엔드를 분리하는 것을 강조합니다.
Jamesstack은 전통적인 웹 개발과 어떻게 다릅니 까? 기존 웹 개발에서 서버는 각 요청에서 HTML을 동적으로 생성 할 책임이 있습니다. 반면에 Jamstack은 빌드 프로세스 중에 페이지를 사전 구매하고 클라이언트에 정적 자산을 직접 제공하며 API를 사용하여 동적 기능을 구현합니다.
Jamstack 아키텍처의 주요 원칙은 무엇입니까? Jamstack의 주요 원칙에는 사전 렌더링, API 중심 개발 및 Global Content Delivery Network (CDN) 사용이 포함됩니다. 사전 렌더링에는 빌드 단계에서 정적 HTML을 생성하는 반면 API는 동적 기능을 처리합니다.
Jamstack 사용의 이점은 무엇입니까? JAMSTACK은 정적 사이트 생성으로 인한 성능 향상, 서버의 공격 표면을 줄임으로써 보안 향상 및 CDN을 통한 확장 성과 같은 많은 이점을 제공합니다. 또한 종종 더 나은 개발자 경험으로 이어집니다.
Jamstack 응용 프로그램에서 서버 측 기능을 사용할 수 있습니까? 예, Jamstack 응용 프로그램은 서버리스 기능 또는 API를 통해 서버 측 기능을 활용할 수 있습니다. 서버리스 기능을 사용하면 이벤트에 대한 응답으로 서버 측 코드를 실행하여 정적 사이트 전달의 이점을 유지하면서 동적 기능을 제공 할 수 있습니다.
Jamstack은 모든 유형의 웹 사이트에 적합합니까? Jamstack은 간단한 블로그 및 마케팅 사이트에서 복잡한 웹 응용 프로그램에 이르기까지 다양한 웹 사이트에 적합합니다. 그러나 적용 가능성은 프로젝트의 특정 요구 사항과 실시간 서버 측 처리 요구 사항에 따라 다릅니다.
최근 몇 년 동안 웹 개발 기술은 매일 매일 변화하고 있습니다. 이 기사는 Jamstack 아키텍처를 소개하고 개념과 장점을 명확하게합니다.