WooGraphQL과 헤드리스 숍 구축: 제 1 장 5

banner

맨 위: 이 튜토리얼은 이전 WooGraphQL 릴리스를 다루고 더 이상 날짜가 없습니다. rewritten version은 진행 중입니다. 이 버전은 여기에서 공개됩니다.

https://www.youtube.com/embed/nhlexP-KtSo

본문 바로가기

  1. Headless eCommerce 응용 프로그램을위한 WordPress 설정
  2. eCommerce 앱 만들기 및 설정
  3. 빌딩 숍 목록 페이지 WooGraphQL
  4. 사용자 로그인 및 탐색
  5. 제품 페이지 및 카트 옵션 만들기

headless eCommerce 응용 프로그램을 만드는 튜토리얼 시리즈의 첫 번째 부분에 오신 것을 환영합니다! 이 시리즈는 강력한 전자 상거래 응용 프로그램을 다시 제작하는 데 관심이있는 개발자를위한 것입니다. 우커머스 회사 소개 RSS 피드 · WPGraphQL WooCommerce의 장점 (우그래픽QL). 이 장은 이 노력에 대한 준비에 WordPress 설치를 설정하는 과정을 통해 걸어갈 것입니다.

Headless eCommerce 응용 프로그램을위한 WordPress 설정

우리가 다이빙하기 전에, 몇 가정은 순서에 있습니다. 우리는 당신이 우리의 가이드와 함께 따르고 우리가 발견한 Docker 윤곽을 사용하여 우리가 처럼 정확하게 당신의 WordPress 환경을 회전하는 것을 presume 할 것입니다 /backend 디렉토리 데모 저장소 GitHub에서 이미 필요한 의존성 및 플러그인으로 준비된 로컬 WordPress 설치를 가지고 있다면, 제목에 앞서 건너 뛸 수 있습니다. WooGraphQL 구성·

우리가 하는 일

WP 환경을위한 필수 사항 데모 저장소에 포함

  • PHP를
  • 채용정보
  • 도커 + 도커 컴포지트

Dependencies 및 Start Docker 설치

시작하려면, 당신의 선택의 디렉토리에 터미널을 열고 저장소를 복제하고 탐색 /backend 관련 기사

git clone https://github.com/kidunot89/woographql-demo.git && cd woographql-demo/backend

우리가해야 할 저장소를 당기기 후에 /backend 디렉토리. 이 튜토리얼의 경우, 우리는 사용할 수 없습니다. /frontend 디렉토리를 무시할 수 있습니다. 이제 터미널에서 /backend 디렉토리, 다음 명령을 실행:

composer install

의존도가 설치되면 Docker Compose를 사용하여 Docker 네트워크를 실행하여 시작합니다.

docker-compose up

Docker가 성공적으로 시작되면 WordPress 설치를 navigating로 완료 할 수 있습니다. http://localhost:8080/wp/wp-admin·

설치를 완료하고 새로운 WordPress 사이트에 로그인 할 수있는 지침을 따르십시오.

Plugins 및 Setup 스토어 활성화

이제 WordPress 사이트가 가동되고 실행되어 필요한 플러그인을 활성화하고 저장을 설정합니다. WordPress Dashboard에서 플러그인 페이지로 이동하고 다음을 활성화하십시오. 우커머스· RSS 피드· WPGraphQL WooCommerce의 장점·

이 신선한 설치 인 경우 WooCommerce는 자동 생성해야합니다. Cart· Shop· Checkout 활성화시 페이지.

플러그인 활성화, 그것은 당신의 상점에 대한 일부 제품을 생성하는 시간입니다. 이 작업을 수행하려면 새로운 터미널 창을 열고 (독서 네트워크는 여전히 다른 터미널 창에서 실행)로 이동 /backend 데모 디렉토리. 여기에서 다음 명령을 실행:

composer generate-products 100

이 명령은 저장을 위한 100개의 제품을 자동 생성할 것입니다. 이 제품의 품질은 최고 수준의 아니지만, 그들은 당신의 상점을 테스트하고 개발하기 위해 완벽합니다.

WooGraphQL 구성

우리의 헤드리스 전자 상거래 응용 프로그램에 대한 WordPress를 설정하는 마지막 단계는 WooGraphQL을 구성하는 것입니다. WordPress 대시보드로 이동하고 GraphQL > 설정으로 이동합니다. 여기에서, 선택 WooGraphQL 탭.

내 계정 WooGraphQL 설정, 보기 Enable User Session transferring URLs 설정 및 확인 Cart URL· Checkout URL· Account URL 옵션.

이 옵션을 활성화하면 WooGraphQL 세션 드롭 URL을 등록하여 GraphQL 스키마에 체크하고 세션 드롭 엔드 포인트를 켜십시오. 기본적으로 이 엔드포인트는 https://our-site/transfer-session

`Save Changes` 버튼을 클릭하여 설정을 종료하는 것을 잊지 마세요!

당신은 그것을 가지고! WordPress 설치는 이제 헤드리스 전자 상거래 응용 프로그램의 개발을 준비합니다. 이 튜토리얼 시리즈의 다음 설치에서, 우리는 우리의 프런트 엔드 설정으로 다이빙합니다. 지원하다 · 다음.js. 행복한 코딩!

다음 장으로 계속



Leave a Reply

Your email address will not be published. Required fields are marked *