Skills for Success

This guide covers the key technical skills for successful development with PWA Kit.

Generally speaking, PWA Kit developers should be comfortable with:

Building universal React.js applications.
Coding in ES6 JavaScript.
Styling UI components with CSS.
Working with RESTful APIs like the Salesforce Commerce API.
Developing web applications with Node.js and Express.js.
Using npm to manage packages and run scripts.

If that describes you, then you’re ready to dive right in! What follows is a more comprehensive inventory of skills used in building a storefront application with PWA Kit. Don’t worry if you’re not an expert on every single thing. Working with PWA Kit presents plenty of opportunities to have fun learning new skills that are in high demand!

JavaScript

A PWA Kit app is coded in modern JavaScript. Even your CSS is written in JavaScript!

A headless commerce app makes frequent network requests, so knowledge of fetch() is crucial. We recommend using a universal fetch library (cross-fetch, for example) that works both in a browser and in a Node.js environment. For maximum performance, you must be able write asynchronous code with Promises and async and await.

Recommended JavaScript Resources

Online course: Modern JavaScript From The Beginning
Online course: JavaScript Concurrency
MDN: Fetch API - Web APIs
fetch() cheatsheet
The Express.js web server
How to debug a Node.js application
Managing npm packages
Using npm-run-scripts

React.js

React is the foundation for all PWA Kit apps. The official React documentation is an excellent place to start. It’s so helpful that we recommend reading all of it! For a more targeted approach to learning React, try focusing on the components, props, the rendering lifecycle, and state management, including new concepts like hooks that were introduced in React 16.8.

Recommended React.js Resources

Online course: Modern React
Components and Props – React
State Management
State and Synchronizing with Effects
Context
Error Boundaries
Hooks: Quick Start, Tutorial, and Reference Overview
Server Side Rendering
Hydration
Debugging with React DevTools
React extensions like react-router and react-helmet

APIs

Your app gets all its commerce data from Salesforce B2C Commerce using APIs. You should be familiar with RESTful APIs in general and the B2C Commerce API and Open Commerce API (OCAPI) in particular.

Recommended API Resources

Get Training

Instructor-led training: Develop a B2C Composable Storefront

Additional Knowledge and Skills

Depending on the details of your project, additional knowledge and skills in the following areas will be an asset:

Architectural principles for single-page applications and the backend-for-frontend pattern
Web page performance testing using Lighthouse and WebPageTest
The PWA Checklist
Interacting with APIs using tools like cURL and Postman
HTTP networking and caching
Web analytics
Search engine optimization
Configuring build tools like webpack
Making DNS changes and performing cutovers
Working with third-party JavaScript libraries to enhance site functionality
Responsive web design layout techniques using media queries, flexbox, and grid