Ejemplo de convertidor de temperatura

El ejemplo de convertidor de temperatura es una aplicación web progresiva (PWA) que muestra los conceptos básicos de cómo crear una PWA. Puede modificar este ejemplo para empezar a crear su propia PWA.

En este artículo se explica cómo obtener el ejemplo, instalarlo en Windows, ejecutar el ejemplo y modificarlo. Este ejemplo funciona con varios sistemas operativos, incluido Windows. En este artículo se proporcionan los pasos para Windows; otras plataformas tienen pasos similares.

Vea también:

• Empiece a desarrollar una PWA.

Paso 1: Vista previa de la aplicación que se ejecuta en una ventana del explorador

Para examinar la interfaz de usuario de la aplicación:

1. En Microsoft Edge, vaya a la aplicación web de ejemplo del convertidor de temperatura en directo en una nueva ventana o pestaña (hospedada en github.io):

   

   La aplicación web progresiva (PWA) de ejemplo se muestra inicialmente en el explorador, como una aplicación web, pero también tiene un botón App available () en la barra de direcciones (no hagas clic en ella todavía).

2. En el cuadro de texto temperatura , escriba 22.

   La temperatura mostrada cambia a 71,6 F.

3. Haga clic en desde la lista desplegable y, a continuación, haga clic fuera de ella.

4. Haga clic en la lista desplegable para y, a continuación, haga clic fuera de ella.

   Las unidades disponibles son:

   • Celsius
   • Fahrenheit
   • Kelvin

5. Cierre la pestaña del explorador de la aplicación.

En un paso posterior, una vez instalada la aplicación web progresiva (PWA) de ejemplo como aplicación local, la aplicación se ejecuta en su propia ventana:

El ejemplo es una aplicación web progresiva, en lugar de un sitio web normal. Por lo tanto, puede instalar la aplicación web progresiva (PWA) como una aplicación en el dispositivo y la ventana de la aplicación contiene la misma interfaz de usuario de la aplicación que en el explorador web completo.

La ventana de la aplicación instalada es una ventana basada en explorador, sin la mayoría de la interfaz de usuario del explorador. La aplicación instalada se integra en la interfaz de usuario del dispositivo, como la barra de tareas de Windows y el menú Inicio de Windows.

La instancia anterior de la aplicación de ejemplo se hospeda en github.io. En las secciones siguientes, se usa un servidor local en su lugar para mostrar cómo probar localmente una aplicación web progresiva (PWA) al desarrollarla. En su lugar, accederá a la aplicación web desde el servidor local (localhost) e la instalará en el dispositivo desde allí.

Paso 2: Instalar Visual Studio Code

Visual Studio Code permite ver el código de ejemplo, modificar el ejemplo y crear su propia aplicación web progresiva (PWA) mediante el ejemplo como punto de partida.

Instale (o actualice opcionalmente) VS Code, como se indica a continuación:

1. Presione la tecla Windows, escriba Visual Studio Code y, a continuación, haga clic en Abrir.

2. Si Visual Studio Code no está instalado, vaya a Visual Studio Code y, a continuación, descárguelo e instálelo.

Paso 3: Instalación de Git

Instale o actualice Git, como se indica a continuación:

1. Abrir Visual Studio Code.

2. En el menú Ver , seleccione Terminal.

3. Escriba el comando: git -v

   Si git está instalado, se muestra un número de versión, como git version 2.51.0.windows.2.

4. Vaya a Descargas en git-scm.com.

   En la esquina superior derecha, anote el número de versión más reciente , como 2.51.1.

5. Si git aún no está instalado o quiere actualizarlo, descargue e instale la versión más reciente de git, desde Descargas en git-scm.com. De lo contrario, vaya a la sección siguiente, a continuación.

6. Durante la instalación, puede aceptar los valores predeterminados, excepto que se recomienda cambiar el editor predeterminado de vim a Visual Studio Code:

   

Paso 4: Instalar Node.js

Node.js incluye un servidor web que usará para ejecutar y probar el ejemplo localmente.

Instale o actualice Node.js, como se indica a continuación:

1. Abrir Visual Studio Code.

2. En el menú Ver , seleccione Terminal.

3. Escriba el comando: node -v

   Si se ha instalado Node.js, se genera un número de versión, como v22.19.0.

4. Vaya a Node.js.

5. En la parte inferior izquierda, en el botón Lts más reciente , anote el número de versión, como v22.20.0.

6. Si Node.js aún no está instalado o desea actualizarlo, haga clic en el botón Obtener Node.js . De lo contrario, vaya a la sección siguiente, a continuación.

   Termina en una página como Descargar Node.js.

7. Haga clic en el botón Windows Installer (.msi).

   Se abre la ventana Descargas de Microsoft Edge y muestra un nombre de archivo como node-v22.20.0-x64.msi.

8. Haga clic en el vínculo abrir archivo bajo el nombre de archivo.

   Se abre la ventana del Asistente para instalación deNode.js .

9. Haga clic en el botón Siguiente y siga las indicaciones. Puede aceptar los valores predeterminados y, a continuación, hacer clic en el botón Instalar .

   Se cierra la ventana del Asistente para instalación deNode.js .

10. En el terminal de VS Code, escriba el comando: node -v

    Se muestra el número de versión más reciente, como v22.20.0.

Paso 5: Bifurcar y clonar el repositorio "MicrosoftEdge/Demos"

A continuación, obtendrá una copia local del código de ejemplo mediante la bifurcación del repositorio Microsoft Edge/Demos. Dado que no tiene permisos para insertar directamente confirmaciones en el repositorio de código abierto de Demos, bifurcará el repositorio de Demos para crear su propia copia del repositorio, en lugar de clonar el repositorio Demos.

Es posible que pueda descargar la rama "principal" del repositorio Demos y editar los archivos en la rama "principal", en lugar de bifurcar y clonar el repositorio y, a continuación, crear una rama de trabajo (test1) en la que editar los archivos. En este artículo se muestra la manera más compleja pero flexible: bifurcar el repositorio.

Bifurcar y clonar el repositorio MicrosoftEdge/Demos , como se indica a continuación:

1. Presione Windows+E.

   Explorador de archivos se abre.

   Compruebe si el repositorio de Demostraciones se ha clonado:

2. Vaya a donde desea clonar el repositorio, como:

   C:\Users\localAccount\GitHub\

   Si aún no se ha clonado el repositorio, como C:\Users\localAccount\GitHub\Demos\, siga estos pasos; en caso contrario, vaya a la sección siguiente.

   Bifurcar el repositorio:

3. Abra el repositorio MicrosoftEdge/Demos en una nueva ventana o pestaña.

4. En la esquina superior derecha, haga clic en la flecha abajo del botón Bifurcar y, a continuación, seleccione Crear una nueva bifurcación.

   Para obtener más información, consulte Bifurcación de un repositorio en Bifurcación de un repositorio en GitHub Docs.

5. Haga clic en el botón Crear bifurcación .

   Clone la bifurcación en la unidad local:

6. En GitHub, vaya a la bifurcación del repositorio MicrosoftEdge/Demos .

7. Encima de la lista de archivos, haga clic en el botón Código .

8. En la pestaña HTTPS, haga clic en el botón Copiar al Portapapeles (

9. Abrir Visual Studio Code.

10. En el menú Ver , seleccione Terminal.

11. Cambie al directorio donde desea clonar el repositorio Demos:

    cd ~/GitHub
    

    O bien, escriba el siguiente comando, especificando la cuenta local:

    cd c:/users/localAccount/GitHub/
    

12. Escriba git cloney pegue la dirección URL que copió anteriormente. Tendrá este aspecto, con el nombre de usuario de GitHub en lugar de YOUR-USERNAME:

    git clone https://github.com/YOUR-USERNAME/Demos.git
    

13. Presione Entrar.

    Se crea un clon local del repositorio de Demos bifurcado.

Vea también:

• Bifurcación de un repositorio
  • Bifurcar un repositorio en Bifurcar un repositorio.
  • Clonación del repositorio bifurcado en Bifurcar un repositorio.
• Clonación de un repositorio

Paso 6: Ejecución de PWA como una aplicación web en el servidor web local

A continuación, ejecutará y probará la aplicación web progresiva (PWA) de ejemplo en el servidor web local, en Microsoft Edge. http-serverUsará , un servidor web de desarrollo local que se puede ejecutar en Node.js.

Al desarrollar o probar un sitio web o una aplicación, incluido un PWA, puede usar un servidor web local. Sin embargo, cuando la aplicación está lista para los usuarios, la implementará en la web mediante un proveedor de hospedaje web. Al igual que un sitio web o una aplicación normales, una PWA se distribuye a los usuarios mediante un servidor web.

Cambie al /temperature-converter/ directorio del repositorio de Demos clonado e inicie desde http-server allí, como se indica a continuación:

1. Abrir Visual Studio Code.

2. En el menú Archivo , seleccione Abrir carpeta.

   Se abre el cuadro de diálogo Abrir carpeta .

3. Vaya a la carpeta del repositorio de Demostraciones clonada, como C:\Users\localAccount\GitHub\Demos\, seleccione la \temperature-converter\ carpeta que contiene y, a continuación, haga clic en el botón Seleccionar carpeta .

4. En el menú Ver , seleccione Terminal.

   Se abre el panel Terminal , con el símbolo del sistema en Demos\temperature-converter\, como C:\users\localAccount\GitHub\Demos\temperature-converter.

5. Escriba el siguiente comando:

   npx http-server
   

   Se inicia el servidor web de desarrollo local mediante el http-server paquete NPM:

   

6. Si recibe un error "running scripts is disabled" (if VS Code's Terminal is using PowerShell), escriba el comando de PowerShell de la directiva de ejecución y, a continuación, vuelva a emitir el comando npx:

   Set-ExecutionPolicy -ExecutionPolicy Bypass -Scope CurrentUser
   npx http-server
   

   Ejemplo de resultado:

   Need to install the following packages:
   http-server@14.1.1
   Ok to proceed? (y)
   

7. Si es necesario, presione Y y, a continuación, Entrar.

   Se muestra la salida, como:

   Starting up http-server, serving ./
   ...
   Available on:
     http://10.0.1.2:8080
     http://127.0.0.1:8080
   Hit CTRL-C to stop the server
   

8. En Microsoft Edge, vaya a (o a http://localhost:8080 una dirección URL equivalente que se produjo en el terminal, desde el npx http-server comando ).

   La aplicación de conversión de temperatura se muestra en el explorador:

   

Paso 7: Instalar el PWA desde el servidor web localhost como una aplicación local

Instale la aplicación web progresiva (PWA) de ejemplo desde el servidor web localhost como una aplicación en Windows, como se indica a continuación:

1. En la barra De direcciones, haga clic en la aplicación disponible. Instalar el botón convertidor de temperatura (

   Se abre un cuadro de diálogo Instalar aplicación :

   

2. Haga clic en el botón Instalar .

   La aplicación se instala localmente. Se abre el cuadro de diálogo Aplicación instalada dentro de la aplicación:

   

3. Haga clic en el botón Permitir .

   Un cuadro de diálogo Aplicaciones de Windows pregunta "¿Desea anclar el convertor de temperatura a la barra de tareas? Esta solicitud procede del convertor de temperatura."

4. Haga clic en el botón Sí .

   El icono de la aplicación Convertor de temperatura () aparece en la barra de tareas de Windows.

   La aplicación convertor temperature se muestra en su propia ventana de aplicación:

   

   La ventana es una ventana del explorador sin la mayor parte de la interfaz de usuario del explorador.

5. Cierre la ventana de la aplicación Convertidor de temperatura .

Paso 8: Abrir la aplicación instalada

Ejecute la aplicación web progresiva (PWA) de ejemplo como una aplicación local en el dispositivo.

1. Presione la tecla Windows , empiece a escribir Convertidor de temperatura y, a continuación, haga clic en Abrir.

   La aplicación de convertidor de temperatura instalada se abre en su propia ventana.

   Dado que instaló la aplicación desde localhost, al iniciar la aplicación, el lado derecho de la barra de título muestra localhost:8080 durante unos segundos:

   

   Si hubiera instalado la aplicación desde el github.io servidor, al iniciar la aplicación, el lado derecho de la barra de título en su lugar mostraría microsoftedge.github.io durante unos segundos:

   

   También puede abrir la aplicación instalada de otras maneras compatibles con el dispositivo, como el botón Convertor de temperatura () anclado a la barra de tareas de Windows.

2. En el cuadro de texto temperatura , escriba 22.

   La temperatura mostrada se actualiza a 71,6 F.

3. Haga clic en las listas desplegables desde y hacia .

   Las unidades disponibles son:

   • Celsius
   • Fahrenheit
   • Kelvin

Paso 9: Examinar el trabajo de servicio que controla el almacenamiento en caché sin conexión

La ventana de aplicación local para una aplicación web progresiva (PWA) es una ventana basada en explorador, por lo que Microsoft Edge DevTools se puede usar para trabajar con la PWA.

Confirme que el trabajo de servicio (sw.js) se está ejecutando al abrir el PWA como una aplicación local, como se indica a continuación:

1. Abra la aplicación de convertidor de temperatura instalada.

2. Haga clic con el botón derecho en la ventana de la aplicación (debajo de la barra de título) y, a continuación, seleccione Inspeccionar.

   Se abre DevTools, en una ventana independiente; Desacoplado. (Otras opciones de acoplamiento están atenuadas y no están disponibles). La ventana de la aplicación es una ventana del explorador que incluye el comando DevTools Inspect .

3. En DevTools, seleccione la herramienta Aplicación ().

4. En el árbol de la izquierda, en la sección Aplicación , seleccione Trabajos de servicio.

   Se muestra información sobre el trabajo de servicio:

   

   El origen del trabajador del servicio es sw.js, con el estadode activado y en ejecución.

5. En el árbol de la izquierda, en la sección Almacenamiento principal, expanda Almacenamiento en caché y, a continuación, seleccione temperature-converter-v1:

   

   Se muestra la caché de trabajo de servicio. Se muestran todos los recursos almacenados en caché por el trabajador del servicio (o almacenados en caché automáticamente por el explorador):

   • / (index.html) - La página web HTML de la aplicación, que define el diseño de los controles.
   • /converter.css - El estilo de la página web de la aplicación.
   • /converter.js - El archivo JavaScript que contiene la lógica de la aplicación.
   • /icon512.png - El archivo de imagen de icono de aplicación para representar la aplicación.
   • /manifest.json - Manifiesto de la aplicación, que contiene información básica sobre la aplicación, para que el sistema operativo del dispositivo lo use.

   El trabajador del servicio agrega tres archivos a la memoria caché, explícitamente (.html, .cssy .js). El explorador almacena automáticamente en caché el icono (.png) y el manifiesto (.json).

Paso 10: Uso de DevTools para desactivar la conexión a Internet y probar la PWA sin conexión

Pruebe la aplicación web progresiva (PWA) como una aplicación sin conexión, como se indica a continuación:

1. En la ventana DevTools, abra la herramienta Red ().

2. Cerca de la parte superior, en el menú Limitación situado a la derecha de la casilla Deshabilitar caché , cambie de Sin limitación a Sin conexión:

   

   La pestaña Red agrega un icono de advertencia para recordarle esta limitación.

3. En la ventana Convertor de temperatura, haga clic con el botón derecho y, a continuación, seleccione Actualizar.

4. En el cuadro de texto temperatura , escriba 22.

   La temperatura mostrada cambia a 71,6 F. La aplicación se sigue mostrando correctamente y sigue funcionando correctamente, mediante el uso de recursos almacenados en caché localmente administrados por el trabajador del servicio.

5. En la ventana DevTools, en el menú Limitación situado a la derecha de la casilla Deshabilitar caché , vuelva a cambiar de Sin conexión a Sin limitación.

   El icono de advertencia de limitación se quita de la pestaña Red .

6. Cierre la ventana DevTools.

7. Cierre la ventana de la aplicación Convertidor de temperatura .

Este mismo uso de DevTools también funciona cuando la aplicación está en Microsoft Edge como una aplicación web, en lugar de una aplicación instalada. Para obtener más información, vea Emular sin conexión en Referencia de características de red.

Paso 11: Desinstalar la aplicación instalada

Desinstale la aplicación web progresiva (PWA), como se indica a continuación:

1. Haga clic en el botón Convertidor de temperatura anclado en la barra de tareas de Windows.

   Se abre la aplicación de convertidor de temperatura instalada.

2. En la barra de título, haga clic en el botón Configuración y mucho más () y, a continuación, haga clic en Configuración de la aplicación.

   En Microsoft Edge, se abre la pestaña Aplicaciones (edge://apps), que muestra detalles sobre la aplicación convertidor de temperatura :

   

3. En la parte inferior, haga clic en el botón Desinstalar .

   Se abre el cuadro de diálogo Desinstalar aplicación de Microsoft Edge en todos los dispositivos sincronizados .

4. Seleccione la casilla Eliminar historial de aplicaciones y datos y, a continuación, haga clic en el botón Desinstalar .

Desinstalación de una aplicación local desde el menú Inicio de Windows

Nota: Como ejemplo de integración del sistema operativo, puede desinstalar la aplicación a través del menú Inicio de Windows, como se indica a continuación:

1. Presione la tecla Windows .

2. Empiece a escribir "convertidor de temperatura".

3. Haga clic en Desinstalar:

   

Desinstalación de una aplicación local a partir de Microsoft Edge

Nota: Como alternativa, puede desinstalar la aplicación web progresiva (PWA) de ejemplo a partir de Microsoft Edge, como se indica a continuación:

1. En Microsoft Edge, seleccione Configuración y mucho más (...) >Más herramientas>Aplicaciones>Ver aplicaciones.

   El cuadro de diálogo Aplicaciones se abre en Microsoft Edge y enumera las PPA instaladas:

   

2. Haga clic con el botón derecho en la tarjeta Convertidor de temperatura y, a continuación, haga clic en Administrar aplicación.

   Se abre la página Todas las aplicaciones/Convertidor de temperatura , en edge://apps.

3. En la parte inferior, haga clic en el botón Desinstalar .

Continúe con los pasos siguientes.

Paso 12: Modificar el ejemplo

Puede modificar el ejemplo como punto de partida para su propia aplicación web progresiva (PWA). Cambiará el nombre de la aplicación de "Convertidor de temperatura" a "TC", en una rama de trabajo del repositorio y, a continuación, instalará la aplicación modificada localmente.

Cree una rama de trabajo y cambie a ella, como se indica a continuación:

1. Abrir Visual Studio Code.

   Abrir la carpeta en VS Code

2. En el menú Archivo , seleccione Abrir carpeta.

   Se abre el cuadro de diálogo Abrir carpeta .

3. Vaya a la carpeta del repositorio de Demostraciones clonada, como C:\Users\localAccount\GitHub\Demos\, seleccione la temperature-converter carpeta que contiene y, a continuación, haga clic en el botón Seleccionar carpeta .

4. En el panel Explorador , abra \temperature-converter\index.html.

   

   En la esquina inferior izquierda de Visual Studio Code, se indica la rama principal.

   Crear una rama de trabajo y cambiar a ella

5. En Visual Studio Code, en el menú Ver, seleccione Terminal.

6. Presione Ctrl+C.

   El servidor web localhost (http-server) se detiene, si se estaba ejecutando. El símbolo del sistema muestra la ruta de acceso actual, como: PS C:\Users\localAccount\GitHub\Demos\temperature-converter>

   No es necesario detener el servidor para modificar el código y ver el resultado. Estamos deteniendo temporalmente el servidor en Terminal para volver al símbolo del sistema, para escribir algunos comandos de Git.

7. Escriba el siguiente comando para crear una rama de trabajo del repositorio y cambiar a él:

   git checkout -b test1
   

   Si la rama ya existe, el comando genera: "fatal: ya existe una rama denominada 'test1'".

8. Si la rama ya existe, escriba el siguiente comando para cambiar a la rama:

   git checkout test1
   

   Salida de ejemplo: Switched to a new branch 'test1'

   En la parte inferior izquierda de Visual Studio Code, la rama cambia de principal a test1.

9. Cierre el panel Terminal .

   En la esquina inferior izquierda de Visual Studio Code, se indica la rama test1:

   

   Modificación de los archivos

10. En Visual Studio Code, en el panel Explorador, abra /temperature-converter/index.html.

11. En index.html, cambie el nombre de la aplicación en dos líneas de "Convertidor de temperatura" a "TC", como se indica a continuación:

    Cambiar de:

    <title>Temperature converter</title>
    <meta name="application-name" content="Temperature converter">
    

    a:

    <title>TC</title>
    <meta name="application-name" content="TC">
    

12. Guarde el archivo.

13. En el panel Explorador , abra /temperature-converter/manifest.json.

14. En manifest.json, cambie el nombre de la aplicación en dos líneas de "Convertidor de temperatura" a "TC", como se indica a continuación:

    Cambiar de:

    "name": "Temperature converter",
    "short_name": "Temperature converter",
    

    a:

    "name": "TC",
    "short_name": "TC",
    

15. Guarde el archivo.

Paso 13: Ver la aplicación modificada en el explorador

Vea la aplicación modificada en el explorador, como se indica a continuación:

1. En Visual Studio Code, en el menú Ver, seleccione Terminal.

   Iniciar el servidor

   Anteriormente hemos detenido el servidor web en Terminal, solo para escribir algunos comandos git para cambiar a una rama de trabajo.

2. Escriba el siguiente comando:

   npx http-server
   

   El servidor web de desarrollo local se inicia de nuevo.

   Visualización de la aplicación web

3. En Microsoft Edge, vaya a (o a http://localhost:8080 una dirección URL equivalente que se produjo en el terminal, desde el npx http-server comando ).

4. Actualice (F5) la página web.

   Esto no da el resultado deseado. Actualizar vuelve a cargar la página web desde la memoria caché del explorador, por lo que verá la aplicación que se almacenaba en caché antes en esa dirección URL (el título de la pestaña es Convertidor de temperatura).

5. Actualice de forma rígida (Mayús+F5) la página web.

   La actualización rígida muestra el contenido actual directamente desde el servidor web.

   El título de la pestaña cambia de Convertidor de temperatura a TC:

   

Paso 14: Volver a instalar el ejemplo modificado como una aplicación local

Instale la aplicación modificada desde localhost en el explorador en el dispositivo, como se indica a continuación:

1. Continuando desde arriba: en Microsoft Edge, en la barra de direcciones, haga clic en la aplicación disponible. Instale TC ().

   Se abre un cuadro de diálogo Instalar aplicación TC en el explorador:

   

2. Haga clic en el botón Instalar .

   La aplicación modificada se instala localmente. Se abre el cuadro de diálogo Aplicación instalada dentro de la aplicación:

   

3. Haga clic en el botón Permitir .

   Un cuadro de diálogo Aplicaciones de Windows pregunta "¿Desea anclar TC a la barra de tareas? Esta solicitud procede de TC".

4. Haga clic en el botón Sí .

   El icono de la aplicación TC () aparece en la barra de tareas de Windows.

   La aplicación TC se muestra en su propia ventana y la barra de título ahora lee TC:

   

Paso 15: Desinstalar la aplicación local modificada

Desinstale la aplicación local modificada de la siguiente manera:

1. En la ventana de la aplicación TC, seleccione Configuración y mucho más (...) >Configuración de la aplicación.

   En Microsoft Edge, se abre la pestaña Aplicaciones , que muestra detalles sobre la aplicación TC .

2. En la parte inferior, haga clic en el botón Desinstalar .

   Se abre el cuadro de diálogo Desinstalar aplicación de Microsoft Edge en todos los dispositivos sincronizados .

3. Seleccione la casilla Eliminar historial de aplicaciones y datos y, a continuación, haga clic en el botón Desinstalar .

Paso 16: Detener el servidor web de desarrollo

1. En Visual Studio Code, en el menú Ver, seleccione Terminal.

2. Presione Ctrl+C.

   El servidor se detiene, con el mensaje de salida: http-server stopped.

Este es el final de los pasos del ejemplo.

Acelerar el ciclo de modificación o reinstalación

Puede omitir algunos de los pasos anteriores cada vez que modifique la aplicación, en función de los archivos que modifique:

• Si modifica un archivo HTML, un archivo CSS o el archivo JavaScript principal, puede omitir la desinstalación y la reinstalación de la aplicación. Vaciar la memoria caché y actualizar la página es suficiente para volver a cargar los cambios de HTML, CSS y JavaScript.

• Si modifica el archivo de manifiesto, debe desinstalar y volver a instalar la aplicación.

Botón PWA en la barra de direcciones

Una vez instalada la aplicación, si va a la aplicación web en el explorador, el botón PWA de la barra de direcciones ha cambiado de un botón Aplicación disponible ( a un botón Abrir en la aplicación ().

Si hace clic en el botón Abrir en la aplicación ( El cuadro de diálogo Abrir convertidor de temperatura se abre en el explorador:

Pasos siguientes

A continuación, puede hacer lo siguiente:

• Estudiar el código; consulte Archivos de origen del convertidor de temperatura.

• Realice modificaciones secundarias adicionales del código del ejemplo.

• Copie y pegue todo el directorio /Demos/temperature-converter/ de ejemplo y modifique el código para crear su propia aplicación web progresiva (PWA).

Vea también

• Uso de PPA en Microsoft Edge
  • Instalación de un PWA en Uso de PWA en Microsoft Edge.
• Introducción al desarrollo de una PWA
• Archivos de origen del convertidor de temperatura
• Emular sin conexión en la referencia de características de DevTools Network.

Localhost:

• http://localhost:8080 - o direcciones URL equivalentes que genera el npx http-server comando .

GitHub:

• Repositorio MicrosoftEdge/Demos .
  • Ejemplo de convertidor de temperatura hospedado en github.io.
• Bifurcación de un repositorio
  • Bifurcar un repositorio en Bifurcar un repositorio.
  • Clonación del repositorio bifurcado en Bifurcar un repositorio.
• Clonación de un repositorio

VS Code:

• Visual Studio Code

Git:

• Descargas en git-scm.com.

Node.js:

• Node.js
• Descargar Node.js