성공을 위한 스킬

이 가이드에서는 PWA Kit를 사용하여 성공적으로 개발 작업을 수행하기 위한 주요 기술적 스킬을 다룹니다.

일반적으로 PWA Kit 개발자는 다음 작업에 익숙할 것입니다.

범용 React.js 애플리케이션 구축
ES6 JavaScript 코딩
CSS를 사용한 UI 구성요소 스타일링
Salesforce Commerce API와 같은 RESTful API 작업
Node.js 및 Express.js를 사용한 웹 애플리케이션 개발
npm을 사용한 패키지 관리 및 스크립트 실행

이 같은 작업에 익숙하다면 이 가이드가 유용할 것입니다. 다음은 PWA Kit를 사용하여 스토어프런트 애플리케이션을 구축하는 데 사용되는 스킬에 대한 보다 포괄적인 목록입니다. 모든 분야에서 전문가가 아니더라도 괜찮습니다. PWA Kit를 사용하면 수요가 많은 새로운 스킬을 익힐 수 있습니다.

JavaScript

PWA Kit 앱은 최신 JavaScript로 코딩됩니다. CSS도 JavaScript로 작성됩니다.

헤드리스 커머스 앱은 네트워크 요청을 자주 하므로, fetch()에 대한 지식이 중요합니다. 브라우저와 Node.js 환경에서 모두 작동하는 범용 가져오기 라이브러리(예: (cross-fetch)를 사용하는 것이 좋습니다. 성능을 극대화하려면 Promises 및 async and await를 사용하여 비동기 코드를 작성할 수 있어야 합니다.

권장 JavaScript 리소스

온라인 교육 과정: Modern JavaScript From The Beginning(현대적 JavaScript로 시작하기)
온라인 교육 과정: JavaScript 동시성(JavaScript 동시성)
MDN: Fetch API - 웹 API
fetch() Cheatsheet
Express.js 웹 서버
Node.js 애플리케이션을 디버깅하는 방법
npm 패키지 관리
npm-run-scripts 사용

React.js

React는 모든 PWA Kit 앱의 기반입니다. 먼저 공식 React 설명서를 참조하는 것이 좋습니다. 매우 유용한 문서이므로 정독해보시기 바랍니다. React를 보다 구체적으로 학습하려면 React 16.8에서 소개하는 후크와 같은 새로운 개념을 비롯하여 구성요소, 속성, 렌더링 라이프사이클 및 상태 관리에 초점을 맞춰 보십시오.

API

앱은 API를 사용하여 Salesforce Commerce Cloud에서 모든 커머스 데이터를 가져옵니다. 일반적인 RESTful API, 특히 B2C Commerce API 및 Open Commerce API(OCAPI)에 대해 잘 알아야 합니다.

권장 API 리소스

교육 받기

강사 주도 교육: B2C 컴포저블 스토어프런트 개발

추가 지식 및 스킬

프로젝트의 세부 사항에 따라 다음 분야에 대한 추가 지식과 스킬은 중요한 자산이 됩니다.

단일 페이지 애플리케이션과 ‘프런트엔드를 위한 백엔드’ 패턴의 아키텍처 원칙
Lighthouse 및 WebPageTest를 사용한 웹 페이지 성능 테스트
PWA 체크리스트
cURL 및 Postman과 같은 도구를 사용한 API와의 상호 작용
HTTP 네트워킹 및 캐싱
웹 분석
검색 엔진 최적화
Webpack과 같은 빌드 도구 구성
DNS 변경 및 컷오버 수행
서드 파티 JavaScript 라이브러리를 사용하여 사이트 기능 개선
미디어 쿼리, flexbox 및 그리드를 사용한 반응형 웹 디자인 레이아웃 기법