Competenze tecniche necessarie
Questa guida illustra le principali competenze tecniche necessarie per un corretto sviluppo con PWA Kit.
In generale, si presuppone che gli sviluppatori PWA Kit abbiano una conoscenza dei seguenti aspetti:
- Creazione delle applicazioni React.js universali.
- Codifica in linguaggio JavaScript ES6.
- Applicazione stili ai componenti di IU con CSS.
- Uso di RESTful API, come Salesforce Commerce API.
- Sviluppo di applicazioni web con Node.js ed Express.js.
- Uso di npm per gestire pacchetti ed eseguire script.
Se si è in possesso di queste conoscenze, è possibile passare a un approfondimento. Di seguito è riportato un elenco più completo delle competenze necessarie per la creazione di un'applicazione storefront con PWA Kit. Non occorre essere esperti di ogni singolo aspetto. PWA Kit offre numerose opportunità per acquisire in modo piacevole nuove competenze molto richieste.
Un'app PWA Kit è codificata in linguaggio JavaScript moderno. Persino il CSS è scritto in linguaggio JavaScript.
Un'app di e-commerce headless effettua frequenti richieste di rete, pertanto è fondamentale conoscere il metodo fetch(). Si consiglia di utilizzare una libreria fetch universale (ad esempio cross-fetch) compatibile sia con un browser sia con un ambiente Node.js. Per prestazioni ottimali, è necessario essere in grado di scrivere codice asincrono con promesse (oggetto Promise) e con le parole chiave async e await.
- Corso online: Modern JavaScript From The Beginning
- Corso online: JavaScript Concurrency
- MDN: Fetch API - Web APIs
fetch()
cheatsheet- Il server web Express.js
- Come eseguire il debug di un'applicazione Node.js
- Gestione dei pacchetti npm
- Utilizzo di npm-run-scripts
React è la base per tutte le app PWA Kit. La documentazione React ufficiale è un'ottima risorsa iniziale. Data la sua utilità, se ne consiglia una lettura integrale. Per un approccio più mirato a React, focalizzarsi su componenti, prop, ciclo di vita del rendering e gestione dello stato, inclusi i nuovi concetti, come quello di hook, introdotti con la versione React 16.8.
- Corso online: Modern React
- Componenti e prop - React
- Gestione dello stato
- Stato e Sincronizzazione con Effect
- Context
- Limiti di errore
- Hook: Guida introduttiva, Tutorial e Panoramica di riferimento
- Rendering di lato server
- Hydration
- Debug con React DevTools
- Estensioni React come react-router e react-helmet
L'app riceve tutti i dati di e-commerce da Salesforce Commerce Cloud mediante le API. Si presuppone una conoscenza generale delle RESTful API, in particolare B2C Commerce API e Open Commerce API (OCAPI).
A seconda delle caratteristiche del progetto, possedere conoscenze e competenze supplementari nelle seguenti aree rappresenta un vantaggio:
- Principi di architettura per applicazioni a pagina singola e modello back-end per front-end
- Test delle prestazioni delle pagine web con Lighthouse e WebPageTest
- Elenco di controllo PWA
- Interazione con le API mediante strumenti come cURL e Postman
- Reti HTTP e caching
- Analisi web
- Ottimizzazione per i motori di ricerca
- Configurazione degli strumenti di compilazione come webpack
- Esecuzione di modifiche DNS e migrazioni
- Uso delle librerie JavaScript di terze parti per ottimizzare le funzionalità del sito
- Tecniche di layout basate su una progettazione web reattiva mediante media query, flexbox e griglie