개발자를 위한 8가지 구텐베르크 튜토리얼

Gutenberg는 WP 5.0에 도입된 WordPress용 새 편집기입니다. 이 포함은 확실히 일상적인 사용자의 상황을 바꾸고 콘텐츠 생성을 위한 많은 가능성을 열어주는 동시에 개발자에게도 많은 기회를 제공합니다. 편집기는 가능한 한 확장 가능하도록 설계되었으며 빌더에 생각할 수 있는 모든 것을 추가할 수 있습니다. 새로운 WordPress 경험에 자신만의 번영을 추가할 수 있도록 개발자를 위한 최고의 Gutenberg 튜토리얼을 모았습니다.

빠른 메모

들어가기 전에 몇 가지: Gutenberg는 React라는 JavaScript 라이브러리로 작성되었습니다. Instagram이 작성된 것과 동일한 라이브러리이자 우리가 사랑하는 Divi Builder입니다. 그래서 우리는 당신이 배우고 싶어하는 좋은 내용임을 보증할 수 있습니다.

Gutenberg 개발에 대해 자세히 알고 싶다면 JavaScript도 배우게 될 것이기 때문입니다. Matt Mullenweg가 몇 년 전에 말했듯이 "JavaScript를 배우게 될 것입니다. 깊이." 어떤 종류의 것이 당신에게 효과가 있는지 알아보기 위해 살펴볼 수 있는 몇 가지 좋은 기사가 있습니다.

시간을 내어 그것들을 살펴보고 어떤지 보십시오. 책갈피에 추가하거나 Pocket에 저장했으면 웹에서 최고의 Gutenberg 튜토리얼을 살펴보십시오.

1. 구텐베르크 공식 페이지

공식 WordPress Gutenberg 사이트에서 시작해야 합니다. 내 말은, 기본 문서를 모른다면 그 이상의 내용은 의미가 없습니다. 그들은 최근 첫 페이지에 빌더의 완전한 대화형 데모를 만들었을 뿐만 아니라 핸드북 FAQ에 대한 링크와 개발을 진행하기 전에 읽어야 하는 Gutenberg의 언어라는 튜토리얼에 대한 링크를 제공했습니다.

2. 구텐베르크.뉴스

기술적으로 튜토리얼은 아니지만 Gutenberg.news는 웹 전체에서 한 곳에서 더 높은 프로필/품질의 tuts를 집계합니다. 나는 새로운 것을 보기 위해 가끔 그곳을 지나가다가 매번 클릭홀에 빠지게 됩니다. 개발자 및 사용자 튜토리얼이 혼합되어 있지만 서식 있는 텍스트 구성 요소로 사용자 지정 Gutenblocks 만들기 와 같은 tut과 기존 단축 코드를 Gutenberg 블록으로 변환하는 방법을 가르쳐줄 수 있는 Github repos에 대한 링크가 포함된 트윗을 찾을 수 있습니다.

3. 구텐베르크 개발 가이드

이름에 있는 것 같죠? Gutenberg 개발 가이드는 초보자 개발자부터 숙련된 WP 베테랑까지 다양한 튜토리얼 시리즈입니다. Gutenberg Hub는 Gutenberg.news와 매우 유사하지만 콘텐츠가 항상 겹치는 것은 아닙니다(때로는 겹치기도 함). 다시 말하지만, 개발자(또는 누구에게나)를 위한 Gutenberg 튜토리얼을 찾고 있다면 이것은 클릭홀입니다. 스스로 경고했다고 생각하십시오.

4. 잭 고든의 구텐베르크 개발 과정

인생에서 가장 좋은 것이 모두 공짜는 아닙니다. Zac Gordon의 놀라운 Gutenberg 개발 과정이 이를 증명합니다. 새로운 WP 편집 경험의 첫 번째 주요 (그렇지 않으면 첫 번째) AZ 코스 중 하나입니다. 과정은 Gutenberg가 업데이트됨에 따라 새로운 정보로 업데이트되므로 구식일 것에 대해 $79를 지불하는 것을 두려워하지 마십시오. Zac은 WordPress 커뮤니티에서 잘 알려져 있으며 이 과정은 그 이유를 절대적으로 보여줍니다. 사용할 수 있는 예제 자습서 비디오도 있습니다. 그렇게 하면 무엇을 하고 있는지 미리 알 수 있습니다.

5. 잭 고든의 블로그

당신은 아마도 Zac Gordon의 Gutenberg 전문가를 알게 될 것입니다. 그러나 당신은 그의 유급 과정에만 국한되지 않습니다. 그의 블로그에는 개발자를 위한 Gutenberg 튜토리얼도 많이 있습니다.

6. Gutenberg용 플러그인을 준비하는 방법

TutsPlus는 사용자가 Gutenberg를 활성화할 때 플러그인이 중단되지 않도록 하기 위해 알아야 할 모든 다양한 방법에 대한 매우 확실한 안내를 제공합니다. 이제 메타박스가 작동하는 방식부터 REST API 및 다양한 종류의 블록 등록에 이르기까지 플러그인을 WordPress용 새로운 Gutenberg 편집기와 통합할 수 있는 모든 방법을 볼 수 있는 원스톱 상점입니다.

7. 풀스택 리액트

모든 구텐베르크 개발자는 앞서 언급한 것처럼 React에 익숙해야 합니다. Fullstack React는 라이브러리에 익숙해지기 위해 가장 좋아하는 프로그램 중 하나입니다. 30일 프로그램으로 도서관을 활용하는 데 필요한 다양한 기본 사항을 살펴봅니다. JavaScript에 익숙한 것이 가장 좋지만 함수를 작성하지 않고 들어가서 무슨 일이 일어나고 있는지 이해했습니다. 유료 과정이 포함되어 있지만 전체 책을 PDF(300페이지 이상)로 무료로 다운로드할 수 있으므로 구텐베르크 환경에 뛰어드는 데 사용하려는 것인지 확인할 수 있습니다.

8. Redux를 사용한 모던 리액트

Gutenberg는 또한 JavaScript 컨테이너 Redux를 사용합니다. Udemy에서 Stephen Grider는 Gutenberg가 즐겨 사용하는 컨테이너를 즐겨 사용하는 라이브러리와 함께 사용하는 방법을 가르치는 과정을 제공합니다. 확실히, 표준 $179.99 가격은 다소 과격합니다. 그러나 Udemy는 정기적으로 코스에 대해 상당한 할인을 제공합니다(제가 이 글을 쓰는 시점에서 예를 들어 $10.99에 대한 미친 판매가 있습니다). 가격이 지금 지불하고자 하는 것보다 높으면 조금만 기다리면 거래가 성사될 것입니다. 말했다, 나는 개인적으로 내가 이것을 어떻게해야 좋은 신뢰도를 보장 할 수 거더의의 반응과 기본 과정 반응 촬영했다.

가자

그게 구텐푼이야, 알겠어? 그러나 진지하게 구텐베르크는 워드프레스의 미래입니다. 콘텐츠를 만드는 새로운 방법을 좋아하든 클래식 편집기 플러그인을 설치하여 기존 방식을 유지하든 상관없이 여기 있습니다. 그리고 당신이 WordPress 개발자라면 그것을 다루어야 할 것입니다. 교육을 계속하고 Gutenberg가 나아가야 할 방향을 보는 것은 그리 어렵지 않습니다. 튜토리얼의 모든 위 정말 당신을 얻을 (또는 내장을) 완전히 편집기의 성능과 확장 성을 파악에 당신의 방법에해야한다.

WordPress 개발의 새로운 시대를 준비하기 위해 어떤 Gutenberg 자습서 또는 리소스를 사용했습니까?

32 Pixels/Shutterstock.com의 기사 특집 이미지