헤드리스 WordPress: 전체 가이드

게시 됨: 2023-03-01

이미 알고 계시겠지만 WordPress는 웹사이트를 만들기 위한 강력한 플랫폼입니다. 콘텐츠 관리 시스템(CMS)으로서 WordPress는 사용하기 쉬운 게시 기능을 제공합니다. 그리고 원하는 거의 모든 작업을 수행하도록 WordPress를 확장할 수 있습니다. 그러나 "헤드리스" WordPress에 대해 들어 보셨습니까?

이 가이드에서는 헤드리스 WordPress가 무엇인지 정확히 배웁니다. WordPress를 사용하도록 유도할 수 있는 상황과 헤드리스 WordPress를 사용하는 것이 최선의 생각이 아닌 경우를 이해하게 될 것입니다. 그 외에도 헤드리스 WordPress 배포와 함께 일반적으로 사용되는 가장 인기 있는 프런트 엔드 및 스택 솔루션을 살펴보겠습니다.

헤드리스 CMS로서 WordPress에 너무 깊이 들어가기 전에 먼저 CMS가 정확히 무엇이며 해결하도록 설계된 문제를 이해하는 것이 중요합니다. 무엇이 사람을 "머리가 없는" 상태로 만들며, 이것이 어떤 경우에 유용한 이유는 무엇입니까? 누가 유용하다고 생각합니까?

헤드리스 워드프레스

콘텐츠 관리 시스템(CMS)이란 무엇입니까?

서버 측 콘텐츠 관리 시스템 또는 CMS는 오늘날 검색하는 대부분의 웹 사이트의 "백엔드"를 지배합니다. 인터넷 초창기에는 모든 사이트가 정적 HTML 페이지에서 직접 구축되었습니다. 새 게시물이나 기사를 만들려면 완전히 새로운 HTML 문서를 만들어야 합니다. 그런 다음 이미지, 기타 미디어 및 CSS 파일과 같은 자산과 함께 서버에 추가합니다. 그런 다음 사이트 탐색 및 이를 참조하는 다른 페이지에서 새 페이지에 연결해야 합니다.

콘텐츠 관리 시스템 이전의 콘텐츠 관리

1995년에서 2000년 사이의 웹 사이트 개발은 엄청나게 비효율적일 수 있습니다. 새 콘텐츠가 있을 때마다 새 파일을 만들고 업로드하는 것은 비교적 쉬웠습니다. 그러나 필연적으로 새로운 콘텐츠는 이전 콘텐츠의 변경을 요구했습니다. 그리고 사이트가 수백, 수천 페이지를 포함하도록 성장함에 따라 수동 프로세스로 신속하게 변경하는 것이 불가능했습니다. 일부 자동화를 사용하더라도 속도가 느릴 수 있습니다.

프레젠테이션과 콘텐츠가 혼합되었습니다

관련된 문제는 콘텐츠와 프레젠테이션(예: 레이아웃 및 디자인 스타일)이 융통성이 없고 종종 HTML 문서 내에서 함께 혼합된다는 것입니다. CSS는 이를 진정으로 해결하기 위해 자체적으로 들어와야 했지만, 콘텐츠와 디자인을 분리하여 이를 활용하기 위해서는 CMS가 필요했습니다.

워크플로와 역할이 혼합됨

웹 사이트의 기능적이고 상호 작용적인 부분을 중심으로 콘텐츠 및 디자인을 전체적으로 변경하는 것이 어려워 콘텐츠를 게시하고 유지 관리하는 프로세스가 매우 느리고 어렵습니다. 콘텐츠, 프런트엔드 디자인, 백엔드 엔지니어링을 담당하는 팀도 명확한 경계가 없었습니다.

동적 데이터베이스 기반 CMS 솔루션

콘텐츠 관리 시스템은 이 아이디어에서 탄생했습니다. 새 웹 페이지가 필요할 때마다 완전히 새로운 HTML 파일을 만드는 대신 각 페이지의 모든 콘텐츠를 MySQL과 같은 관계형 데이터베이스에 저장합니다. 그런 다음 PHP와 같은 서버 측 스크립팅 언어로 작성된 CMS를 사용하여 동적으로 생성된 페이지에서 데이터베이스의 다양한 콘텐츠를 쿼리하고 포함합니다. 방문자의 각 페이지 요청으로 인해 요청된 콘텐츠의 새롭고 고유한 버전이 생성될 수 있습니다.

동적 CMS의 한계

WordPress는 HTML과 혼합된 PHP로 작성된 디자인 템플릿을 사용하여 각 페이지 요청 시 방문자에게 제공되는 최종 HTML 문서를 생성합니다. CMS를 사용하여 동적 페이지를 쉽게 게시할 수 있는 것과 비교할 때 거의 모든 페이지 로드에서 쿼리되는 데이터베이스를 사용하거나 사용하지 않고 대규모 보안 및 성능을 고려할 때까지 정적 파일 기반 웹 게시에 유용한 것이 있다고 믿기 어렵습니다.

하이브리드 접근 방식으로서의 헤드리스 — 두 세계의 장점

헤드리스는 프런트 엔드 프레임워크의 대부분 정적 자산에서 웹 페이지를 제공하는 하이브리드 접근 방식입니다. 이 프런트 엔드는 동적 콘텐츠를 가져오거나 절대적으로 필요할 때 사용자 입력을 수신하기 위해 백엔드의 CMS 및 데이터베이스만 사용합니다. 이를 통해 방문자를 위해 "즉시" 렌더링할 수 있고 자주 변경할 필요가 없을 때 캐시할 수 있는 페이지가 가능합니다.

헤드리스 WordPress 및 기타 헤드리스 콘텐츠 관리 시스템

Headless WordPress는 일반적인 프런트 엔드 기능에서 분리된 백 엔드로 WordPress를 배포하는 방법입니다. 테마가 사용되지 않습니다. 백엔드는 다음에 대한 책임만 있습니다.

  • 데이터베이스 관리
  • 사용자 관리
  • 콘텐츠 관리
  • 외부 서비스와 상호 작용

프런트 엔드 프레젠테이션 레이어는 일반적으로 React.js 또는 기타 JavaScript 기반 프런트 엔드와 HTML/CSS 프레임워크로 구성됩니다. 콘텐츠는 WP GraphQL(GraphQL의 WordPress 구현) 또는 WordPress 핵심 REST API와 같은 API를 통해 백엔드에서 수집됩니다.

또한 방문자가 사용할 수 있는 다양한 장치에 대해 서로 다른 채널을 처리하는 여러 프런트 엔드가 있을 수 있습니다. 또한 프런트 엔드가 백 엔드와 동일한 서버를 공유할 필요가 없습니다. 효율적인 옴니채널 게시에 필요한 인프라입니다. 옴니채널을 사용하면 모바일 앱과 사물 인터넷의 모든 종류의 장치에 고유한 콘텐츠를 제공할 수 있습니다.

Hugo 및 Jekyll과 같이 헤드리스 웹사이트를 구축하기 위한 인기 있는 오픈 소스 정적 사이트 생성기가 꽤 많이 있습니다. 이들은 헤드리스 또는 기존 배포에서 WordPress가 제공하는 데이터베이스 및 콘텐츠 관리 도구가 없는 완전히 평평한 파일 시스템입니다. Gatsby 및 Next.js는 정적 사이트를 생성하는 데에도 사용할 수 있지만 헤드리스 WordPress 배포에 사용할 수 있는 고급 프런트 엔드 프레임워크도 제공합니다. 그러나 헤드리스 WordPress의 진정한 강점은 데이터베이스를 훨씬 적게 사용한다는 것이 아니라 기존 CMS의 단일 테마, 단일 목적 프런트 엔드보다 더 많은 가능성에 대해 데이터베이스 사용을 최적화한다는 점을 명심하십시오. 헤드리스 WordPress를 사용하면 여러 프런트 엔드를 구축하거나 프로그레시브 웹 앱(PWA) 또는 기본 모바일 앱을 지원할 수 있습니다.

Headless WordPress가 최고의 Headless CMS인 이유

WordPress는 강력하고 널리 사용되는 플랫폼이므로 헤드리스 CMS로 성공할 수 있는 독특한 위치에 있습니다.

다음은 WordPress가 헤드리스 CMS에 가장 적합한 5가지 이유입니다.

1. 당신은 이미 WordPress를 사용하고 있으며 다른 사람들도 마찬가지입니다.

아마도 당신은 이미 WordPress를 사용하고 있으므로 머리를 자르는 것은 간단한 단계입니다.

WordPress는 프런트 엔드에 구애받지 않기 때문에 콘텐츠로 가득 찬 데이터베이스가 있는 기존 사이트는 헤드리스로 상당히 고통스럽게 갈 수 있습니다. 또는 헤드리스 WordPress 사이트에 "헤드"가 다시 연결될 수 있습니다. WordPress에서는 어느 방향으로든 이동하는 것이 어렵지 않습니다.

많은 직원과 미래의 고용인이 WordPress 경험이 있거나 가질 것입니다. 친숙한 기술로 더 쉬운 온보딩 경험을 기대할 수 있습니다.

2. 프런트 엔드 개발자는 WordPress 또는 PHP를 만질 필요가 없습니다.

PHP는 백엔드 애플리케이션 언어로 간주되기 때문에 일반적으로 최신 프론트엔드 개발 교육의 핵심 부분이 아닙니다. 그러나 WordPress 플랫폼은 PHP로 코딩되어 있습니다. WordPress를 위한 기존(헤드리스가 아닌) 프런트 엔드 개발은 PHP 개발자에게는 친숙하지만 다른 개발자에게는 친숙하지 않은 WordPress API 함수 및 코드를 사용하는 사용자 지정 테마를 만드는 데 중점을 둡니다. WordPress가 빠르게 발전하고 있고 사이트 편집기와 호환되는 새 테마는 PHP를 거의 또는 전혀 사용하지 않을 수 있지만 WordPress는 PHP가 백엔드로 완전히 물러나기 전에 갈 길이 멉니다. 현재 PHP에 덜 의존하거나 최신 프런트 엔드 프레임워크를 위해 PHP를 완전히 우회하는 데 사용할 수 있는 훌륭한 솔루션이 있습니다. 그 솔루션은 헤드리스 WordPress입니다.

표준(헤드리스가 아닌) WordPress 프로젝트 작업을 위해 프런트 엔드 개발자를 고용하는 경우 작업할 인력 풀이 더 작다는 것을 알 수 있습니다. PHP 또는 이와 유사한 서버 측 스크립팅 언어에 익숙하지 않은 개발자는 WordPress 학습 곡선이 높다는 것을 알 수 있습니다. 그러나 React와 같은 복잡한 CSS 및 JavaScript 프레임워크를 사용하여 프런트 엔드 개발에 탁월하다면 헤드리스 WordPress 사이트에 적합합니다. 그들의 강점을 발휘하지 않겠습니까? 다른 시나리오에서 WordPress 또는 유사한 CMS를 아직 사용하지 않지만 경험이 풍부한 프런트 엔드 개발자가 있는 경우 완전히 새로운 CMS로 작업하는 방법을 배우게 하고 싶지 않을 수 있습니다. 헤드리스 WordPress가 훌륭한 솔루션이 될 수 있는 경우입니다.

개발자는 헤드리스 WordPress 사이트의 프런트 엔드를 구축하기 위해 WordPress에 익숙할 필요가 없습니다. 유능한 프런트엔드 개발자를 고용할 수 있습니다. 조금 또는 많이 쓸 수 있지만 완전히 맞춤형 프런트 엔드를 얻을 수 있습니다. 매우 고유한 요구 사항이 있는 경우 완전히 고유한 맞춤형 사이트 디자인이 거의 항상 최상의 서비스를 제공합니다.

3. 엔터프라이즈급 호스트는 헤드리스 WordPress를 지원합니다.

거의 모든 웹사이트 호스팅 플랫폼은 WordPress 호스팅을 제공합니다. 그들은 그것을 지원하는 데 10년 이상의 경험이 있을 수 있습니다. 관리형 WordPress 호스트는 엔터프라이즈 WordPress 사이트를 지원하며 많은 주요 관리형 WordPress 호스트는 전문적인 헤드리스 호스팅, 도구 및 지원을 제공합니다. 사이트의 보안과 성능을 최우선 순위로 삼습니다.

4. 헤드리스 워드프레스는 빠르다

모든 CMS는 정적 사이트에 비해 방문자에게 더 느린 로드 속도 시간을 게시합니다. 동적 페이지 생성에는 더 많은 서버 리소스가 필요하며, 과도하게 구축된 CMS에는 많은 서버 오버헤드가 있을 수 있습니다. 견고한 호스팅과 효율적인 캐싱을 갖춘 고성능 WordPress 사이트도 높은 트래픽 부하와 많은 활성 로그인 프런트 엔드 또는 백엔드 사용자로 인해 속도가 느려집니다. 헤드리스 WordPress 사이트는 여전히 CMS의 이점을 얻지만 데이터베이스가 있는 정적 사이트 생성기처럼 작동합니다. 방문자는 헤드리스 사이트를 방문할 때 대부분 빠르게 로드되는 정적 파일을 받습니다.

로드하는 데 너무 오래 걸리는 웹 사이트는 사이트 소유자에게 가장 큰 문제 중 하나입니다. 모바일 사이트 검색이 기하급수적으로 증가함에 따라 속도가 그 어느 때보다 중요해졌습니다. 전자 상거래 사이트에서 느린 로딩은 판매 손실을 의미합니다. 일반적인 사용자는 몇 초 이상 사이트가 로드될 때까지 앉아서 기다리지 않습니다. 즉시 로드되지 않으면 다음 항목으로 넘어갑니다.

사이트 로드 시간을 줄이는 것이 중요합니다. 또한 Google은 검색 결과에 대한 사이트 순위를 매길 때 페이지 로드 속도를 고려합니다. SEO가 당신에게 큰 우선 순위라면 WordPress에 대한 다른 프런트 엔드를 고려하는 것이 현명할 수 있습니다.

5. 헤드리스 WordPress는 보안을 강화할 수 있습니다.

일반적인 WordPress 설치는 로그인 화면뿐만 아니라 백엔드 관리 인터페이스를 노출시킵니다. 관리자가 아닌 낮은 수준의 사용자도 잠재적으로 백엔드 관리자에 액세스할 수 있습니다. 때때로 해커는 취약한 플러그인이나 테마를 통해 이를 악용할 수 있습니다. 헤드리스 WordPress 사이트는 일반적으로 테마를 전혀 사용하지 않으며 콘텐츠 중심 헤드리스 사이트는 사용자를 신뢰할 수 있는 소수의 사용자로 제한할 수 있습니다. 이 시나리오에서는 로그인 프로세스를 단단히 잠글 수 있으며 해커의 다른 가능한 대상이 필요하지 않기 때문에 종료될 수 있습니다.

iThemes Security Pro와 같은 강력한 WordPress 보안 플러그인을 사용하여 헤드리스 WordPress 사이트를 완전히 보호할 수 있습니다. 백엔드 보안, 적절한 사용자 액세스 역할 설정 및 보안 로그인 정책 시행을 위해 모든 종류의 WordPress 사이트에서 유용합니다.

Headless WordPress를 사용하는 것은 언제 나쁜 생각입니까?

헤드리스 WordPress는 매우 강력한 도구이지만 몇 가지 단점이 있습니다.

복잡할 수 있습니다.

헤드리스 CMS 구축은 중요한 학습을 ​​수행할 준비가 되어 있지 않는 한 경험이 없는 개발자를 위한 것이 아닙니다. 100% 플러그 앤 플레이 방식인 WordPress와 달리 헤드리스 CMS는 그렇지 않습니다. 간단한 WordPress 설치로 시작한 다음 주로 프런트 엔드 부분을 분리합니다. 그런 다음 자체 프런트 엔드를 개발해야 합니다. 이것이 익숙하지 않은 영역이라면 상당한 학습 곡선이 있을 것입니다. 일반 워드프레스 사이트와 달리 헤드리스 워드프레스는 거의 널리 이해되거나 잘 문서화되어 있지 않습니다. 주요 헤드리스 WordPress 호스팅 및 개발 전문가와 연결하고 작업을 수행하는 데 비용이 듭니다.

작동하지 않는 것

WordPress의 최신 사이트 편집 기능은 헤드리스 사이트에서 유용하거나 사용할 수 없습니다. 헤드리스 프런트 엔드와 잘 작동하도록 Gutenberg 포스트 편집기 내에서 블록 편집기를 사용하는 것도 몇 가지 문제가 있습니다. 많은 WordPress 플러그인이 헤드리스 환경에서 제대로 작동하지 않거나 전혀 작동하지 않을 수 있습니다. WordPress 호스트와 개발자는 헤드리스 WordPress 개발을 개선하고 지원하기 위해 노력하고 있으므로 이 영역은 항상 변화하고 있습니다. 헤드리스 WordPress 기술의 현재 상태를 주의 깊게 조사하고 그에 따라 프로젝트를 계획하십시오.

유지 보수는 필수입니다

자신의 프런트 엔드 코드를 유지 관리하는 데 시간이 많이 걸릴 수 있습니다. 그리고 Gutenberg 게시물 편집기는 WordPress 백엔드에 있기 때문에 헤드리스 사이트에서 사용하려면 진정한 WYSIWYG 경험을 위해 분리된 프런트 엔드 프레임워크와 백엔드 스타일을 동기화해야 합니다. 프런트 엔드 프레임워크도 지속적인 유지 관리가 필요합니다. 헤드리스 배포에는 기존 WordPress 또는 CMS 기반 웹 사이트를 넘어서는 지속적인 유지 관리를 위한 신중한 사전 계획이 필요합니다.

보너스 콘텐츠 받기: WordPress 보안 가이드
여기를 클릭하세요

헤드리스 WordPress 시작하기

WordPress를 설치하고 프런트 엔드를 차단하십시오!

일반적으로 WordPress의 경우와 마찬가지로 일부 플러그인이 이를 수행하는 데 도움이 될 수 있습니다. 하나는 Headless CMS 플러그인이라는 적절한 이름입니다. 다른 WordPress 플러그인처럼 설치하고 활성화하십시오.

다음으로 사이트의 프런트 엔드 작업을 시작합니다. 몇 가지 다른 접근 방식을 취할 수 있습니다. Gatsby와 같이 이미 존재하는 프런트 엔드 또는 구축할 프레임워크를 선택하기로 결정할 수 있습니다. 또는 Progressive Web App 구축을 고려할 수 있습니다.

잼스택

Jamstack에 익숙하지 않다면 웹 개발을 위해 자주 사용되는 플랫폼입니다. 이를 사용하면 헤드리스 WordPress 또는 기타 CMS의 프런트 엔드 역할을 할 수 있습니다.

느슨한 결합은 Jamstack의 가장 큰 강점 중 하나입니다. WordPress를 분리하는 과정을 거친 적이 있다면 이 기능이 매우 유용할 것입니다.

프로그레시브 웹 애플리케이션(PWA)

PWA는 여러 면에서 웹사이트와 유사합니다. 그러나 웹사이트와 달리 PWA는 사용자에게 기본 모바일 경험을 제공하는 광범위한 Javascript 라이브러리를 사용합니다.

이를 위해서는 React 또는 Vue와 같은 프레임워크를 사용하여 앱을 개발해야 합니다.

개츠비

헤드리스 CMS로 얻을 수 있는 대부분의 자유를 유지하면서 개발 프로세스를 빠르게 추적하고 싶습니까?

Gatsby는 좋은 선택이며 이를 위한 플러그인이 있습니다.

헤드리스 WordPress가 당신에게 적합합니까?

WordPress는 그 자체로 놀라운 도구입니다. 그러나 헤드리스 CMS를 사용하여 자체 프런트 엔드가 필요한 경우가 있습니다.

이 가이드에서는 헤드리스 WordPress를 설정할 때 취해야 할 방법, 이유 및 접근 방식을 배웠습니다.

헤드리스로 전환하는 것이 사이트 개발 요구 사항을 충족하는 가장 좋은 방법이라고 결정했다면 이제 시작하기에 충분합니다.