Curso de Progressive Web Apps con Angular

Clases del Curso de Progressive Web Apps con Angular

Instruido por:
Nicolas Molina
Nicolas Molina
Básico
3 horas de contenido
Ver la ruta de aprendizaje
Platzi Store
Proyecto del curso
Platzi Store

El estudiante desarrollará Platzi Store como Aplicación Web Progresiva (PWA) empleando Angular.

Curso de Progressive Web Apps con Angular

Curso de Progressive Web Apps con Angular

Progreso del curso:0/20contenidos(0%)

Contenido del Curso
Tutoriales de estudiantes
Preguntas de estudiantes

Progreso del curso:0/20contenidos(0%)

Apropiar el concepto de PWA

Material Thumbnail

Bienvenida e introducción al curso

00:36 min

Material Thumbnail

¿Qué son las PWA?

03:27 min

Material Thumbnail

Características de una PWA

05:10 min

Material Thumbnail

PWA vs Híbrido vs Nativo

04:05 min

Material Thumbnail

Los Services Workers

03:46 min

Material Thumbnail

Proyecto del curso: Platzi Store

02:01 min

Entender PWA en Angular

Material Thumbnail

Generando la primer PWA

13:55 min

Material Thumbnail

Caché local y pruebas offline

09:02 min

Material Thumbnail

Pruebas con Lighthouse

07:49 min

Material Thumbnail

Caché de requests

17:58 min

Construir una PWA luciendo como nativa

Material Thumbnail

Poniendo tu app en el Homescreen

07:24 min

Material Thumbnail

Crear botón de instalación automática

17:02 min

Material Thumbnail

Probar funcionalidad del botón de instalación

08:11 min

Material Thumbnail

Enviando actualizaciones

12:44 min

Material Thumbnail

Implementando flujo de notificaciones

13:22 min

Material Thumbnail

Gestionando notificaciones

12:14 min

Material Thumbnail

Implementación y recomendaciones para IOS

09:23 min

Integrar continuamente

Material Thumbnail

Aplicando Lighthouse Bot a tu proceso de integración continua

04:58 min

nuevosmás votadossin responder
Pedro Quiñonez Verdugo
Pedro Quiñonez Verdugo
Estudiante

A mí me arrojó este error:

Site cannot be installed: Page does not work offline. StartinginChrome93, the installability criteria is changing, andthis site will notbe installable. See https://goo.gle/improved-pwa-offline-detection for more information.
0
Marcelo Gorski
Marcelo Gorski
Estudiante

Hola,
Si accedo a una PWA y pierdo la conexión a internet, ¿las imágenes que están en una parte la app a la cual no accedí me las cachea si las pongo en modo lazy?

0
Jose Luis Rosado Cardenas
Jose Luis Rosado Cardenas
Estudiante

No me funciono, use el token y no me llega la notificacion

2
Jose Luis Rosado Cardenas
Jose Luis Rosado Cardenas
Estudiante

¿Puedo usar alguna variable del archivo environment.ts en el archivo ngsw-config.json, para definir las urls??

1
Daniel Acosta
Daniel Acosta
Estudiante

Y que pasaría si la PWA es una app que constantemente hace peticiones ajax, si falla el network, almacenas las peticiones en caché o le indica que no hay conexión?

0
Jose Luis Rosado Cardenas
Jose Luis Rosado Cardenas
Estudiante

¿Qué otras herramientas de auditoria tenemos para optimizar nuestro sitios ??

0
Kevin Emanuel Fiorentino
Kevin Emanuel Fiorentino
Estudiante

Los diferentes suscribe() necesarios de Firebase para hacer el Push Notification, ¿No es necesario hacer el Unsuscribe() correspondiente?

1
Marcelo Gorski
Marcelo Gorski
Estudiante

¿Es posible acceder a la cámara del celular con una PWA?

4
DEL RIO JUNCA JUAN CARLOS
DEL RIO JUNCA JUAN CARLOS
Estudiante

Buenos Dias

Tengo un problema con los cursos del profesor nicolas, los funtes de platzi-store me fallan, quiciera saber si a alguien tambien le pasa y le sale mi error.

mis instalaciones son
node v14.1.0
npm 6.14.4

Your global Angular CLI version (9.1.4) is greater than your local
version (8.3.20). The local Angular CLI version is used.

To disable this warning use “ng config -g cli.warnings.versionMismatch false”.

 _                      _                 ____ _     ___
/ \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|

/ △ \ | '_ \ / | | | | |/ _ | '__| | | | | | |
/ ___ | | | | (
| | || | | (| | | | || |___ | |
/
/ __| |
|_
, |_,||_,|| _||_|
|___/

Angular CLI: 8.3.20
Node: 14.1.0
OS: win32 x64
Angular: 8.2.14
… animations, common, compiler, compiler-cli, core, forms
… language-service, platform-browser, platform-browser-dynamic
… router, service-worker

Package Version

@angular-devkit/architect 0.803.20
@angular-devkit/build-angular 0.803.20
@angular-devkit/build-optimizer 0.803.20
@angular-devkit/build-webpack 0.803.20
@angular-devkit/core 8.3.20
@angular-devkit/schematics 8.3.20
@angular/cdk 8.2.3
@angular/cli 8.3.20
@angular/fire 5.2.3
@angular/material 8.2.3
@angular/pwa 0.803.20
@ngtools/webpack 8.3.20
@schematics/angular 8.3.20
@schematics/update 0.803.20
rxjs 6.4.0
typescript 3.5.3
webpack 4.39.2

-------------------ERROR-----------------

#npm install

[email protected] install D:\CURSOS\PLATZI\14.PROGRESSIVE_WEB_APPS_CON_ANGULAR\curso-pwa-angular-master\node_modules\grpc
node-pre-gyp install --fallback-to-build --library=static_library

node-pre-gyp WARN Using request for node-pre-gyp https download
node-pre-gyp WARN Tried to download(404): https://node-precompiled-binaries.grpc.io/grpc/v1.24.2/node-v83-win32-x64-unknown.tar.gz
node-pre-gyp WARN Pre-built binaries not found for [email protected] and [email protected] (node-v83 ABI, unknown) (falling back to source compile with
node-gyp)
gyp ERR! find Python
gyp ERR! find Python Python is not set from command line or npm configuration
gyp ERR! find Python Python is not set from environment variable PYTHON
gyp ERR! find Python checking if “python” can be used
gyp ERR! find Python - “python” is not in PATH or produced an error
gyp ERR! find Python checking if “python2” can be used
gyp ERR! find Python - “python2” is not in PATH or produced an error
gyp ERR! find Python checking if “python3” can be used
gyp ERR! find Python - “python3” is not in PATH or produced an error
gyp ERR! find Python checking if the py launcher can be used to find Python 2
gyp ERR! find Python - “py.exe” is not in PATH or produced an error
gyp ERR! find Python checking if Python is C:\Python27\python.exe
gyp ERR! find Python - “C:\Python27\python.exe” could not be run
gyp ERR! find Python checking if Python is C:\Python37\python.exe
gyp ERR! find Python - “C:\Python37\python.exe” could not be run
gyp ERR! find Python
gyp ERR! find Python **********************************************************
gyp ERR! find Python You need to install the latest version of Python.
gyp ERR! find Python Node-gyp should be able to find and use Python. If not,
gyp ERR! find Python you can try one of the following options:
gyp ERR! find Python - Use the switch --python="C:\Path\To\python.exe"
gyp ERR! find Python (accepted by both node-gyp and npm)
gyp ERR! find Python - Set the environment variable PYTHON
gyp ERR! find Python - Set the npm configuration variable python:
gyp ERR! find Python npm config set python "C:\Path\To\python.exe"
gyp ERR! find Python For more information consult the documentation at:
gyp ERR! find Python https://github.com/nodejs/node-gyp#installation
gyp ERR! find Python **********************************************************
gyp ERR! find Python
gyp ERR! configure error
gyp ERR! stack Error: Could not find any Python installation to use
gyp ERR! stack at PythonFinder.fail (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:307:47)
gyp ERR! stack at PythonFinder.runChecks (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:136:21)
gyp ERR! stack at PythonFinder.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:225:16)
gyp ERR! stack at PythonFinder.execFileCallback (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:271:16)
gyp ERR! stack at exithandler (child_process.js:310:5)
gyp ERR! stack at ChildProcess.errorhandler (child_process.js:322:5)
gyp ERR! stack at ChildProcess.emit (events.js:315:20)
gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:274:12)
gyp ERR! stack at onErrorNT (internal/child_process.js:468:16)
gyp ERR! stack at processTicksAndRejections (internal/process/task_queues.js:84:21)
gyp ERR! System Windows_NT 10.0.17763
gyp ERR! command “C:\Program Files\nodejs\node.exe” “C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js” “configure” “–fallback-to-build” “–library=static_library” “–module=D:\CURSOS\PLATZI\14.PROGRESSIVE_WEB_APPS_CON_ANGULAR\curso-pwa-angular-master\node_modules\grpc\src\node\extension_binary\node-v83-win32-x64-unknown\grpc_node.node” “–module_name=grpc_node” “–module_path=D:\CURSOS\PLATZI\14.PROGRESSIVE_WEB_APPS_CON_ANGULAR\curso-pwa-angular-master\node_modules\grpc\src\node\extension_binary\node-v83-win32-x64-unknown” “–napi_version=6” “–node_abi_napi=napi” “–napi_build_version=0” "–node_napi_label=node-v83"
gyp ERR! cwd D:\CURSOS\PLATZI\14.PROGRESSIVE_WEB_APPS_CON_ANGULAR\curso-pwa-angular-master\node_modules\grpc
gyp ERR! node -v v14.1.0
gyp ERR! node-gyp -v v5.1.0
gyp ERR! not ok
node-pre-gyp ERR! build error
node-pre-gyp ERR! stack Error: Failed to execute ‘C:\Program Files\nodejs\node.exe C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js configure --fallback-to-build --library=static_library --module=D:\CURSOS\PLATZI\14.PROGRESSIVE_WEB_APPS_CON_ANGULAR\curso-pwa-angular-master\node_modules\grpc\src\node\extension_binary\node-v83-win32-x64-unknown\grpc_node.node --module_name=grpc_node --module_path=D:\CURSOS\PLATZI\14.PROGRESSIVE_WEB_APPS_CON_ANGULAR\curso-pwa-angular-master\node_modules\grpc\src\node\extension_binary\node-v83-win32-x64-unknown --napi_version=6 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v83’ (1)
node-pre-gyp ERR! stack at ChildProcess.<anonymous> (D:\CURSOS\PLATZI\14.PROGRESSIVE_WEB_APPS_CON_ANGULAR\curso-pwa-angular-master\node_modules\grpc\node_modules\node-pre-gyp\lib\util\compile.js:83:29)
node-pre-gyp ERR! stack at ChildProcess.emit (events.js:315:20)
node-pre-gyp ERR! stack at maybeClose (internal/child_process.js:1051:16)
node-pre-gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:287:5)
node-pre-gyp ERR! System Windows_NT 10.0.17763
node-pre-gyp ERR! command “C:\Program Files\nodejs\node.exe” “D:\CURSOS\PLATZI\14.PROGRESSIVE_WEB_APPS_CON_ANGULAR\curso-pwa-angular-master\node_modules\grpc\node_modules\node-pre-gyp\bin\node-pre-gyp” “install” “–fallback-to-build” "–library=static_library"
node-pre-gyp ERR! cwd D:\CURSOS\PLATZI\14.PROGRESSIVE_WEB_APPS_CON_ANGULAR\curso-pwa-angular-master\node_modules\grpc
node-pre-gyp ERR! node -v v14.1.0
node-pre-gyp ERR! node-pre-gyp -v v0.14.0
node-pre-gyp ERR! not ok
Failed to execute ‘C:\Program Files\nodejs\node.exe C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js configure --fallback-to-build --library=static_library --module=D:\CURSOS\PLATZI\14.PROGRESSIVE_WEB_APPS_CON_ANGULAR\curso-pwa-angular-master\node_modules\grpc\src\node\extension_binary\node-v83-win32-x64-unknown\grpc_node.node --module_name=grpc_node --module_path=D:\CURSOS\PLATZI\14.PROGRESSIVE_WEB_APPS_CON_ANGULAR\curso-pwa-angular-master\node_modules\grpc\src\node\extension_binary\node-v83-win32-x64-unknown --napi_version=6 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v83’ (1)
npm WARN [email protected] requires a peer of [email protected]^5 || ^6 but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\webpack-dev-server\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {“os”:“darwin”,“arch”:“any”} (current: {“os”:“win32”,“arch”:“x64”})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\watchpack\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {“os”:“darwin”,“arch”:“any”} (current: {“os”:“win32”,“arch”:“x64”})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\karma\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {“os”:“darwin”,“arch”:“any”} (current: {“os”:“win32”,“arch”:“x64”})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {“os”:“darwin”,“arch”:“any”} (current: {“os”:“win32”,“arch”:“x64”})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] ([email protected]\compiler-cli\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {“os”:“darwin”,“arch”:“any”} (current: {“os”:“win32”,“arch”:“x64”})

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] install: node-pre-gyp install --fallback-to-build --library=static_library
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Juan Carlos\AppData\Roaming\npm-cache_logs\2020-09-01T13_25_16_429Z-debug.log

1
Salvador J Galliano M
Salvador J Galliano M
Estudiante

Para los que usan iOS. La forma de instalarla es a traves de Safari browser. Chrome no tiene soporte aun para PWA.

1