No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Angular Devtools

15/22
Recursos

Angular DevTools es una herramienta complementaria para enriquecer tu experiencia de desarrollo en Angular permitiendo la depuración y el debugging de tu aplicación.

Solo tienes que instalar la extensión del navegador para Google Chrome.

Gracias a estas herramientas, podrás desarrollar y resolver bug más rápido, inspeccionar el valor de las propiedades de tu componente y detectar cuando el usuario realiza alguna acción y se lanza un evento.

devtools.jpg

Otras extensiónes para Angular

También puedes explorar la extensión Augury, una alternativa tanto para Google Chrome como para Mozilla Firefox.

TIP: Solo puedes utilizar estas extensiones en un ambiente de desarrollo, no funcionan en producción.

Aporte creado por: Kevin Fiorentino.

Aportes 26

Preguntas 2

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

Encontre esta para Firefox, funciona muy bien.
https://addons.mozilla.org/en-GB/firefox/addon/angular-devtools/

Que bonito es lo bonito!!! Angular DevTools

Apenas se instala hay que recargar la página o abrir en otra pestaña el link (incluso este mismo proyecto del curso) para que se active el tab de Angular en el devTools.

Está buenísima, no la conocía.

Muy buena herramienta Angular DevTools para verificar el funcionamiento de nuestra App.

Woow!! Ahora veo que Platzi está construido con React 😳, que excelente herramienta, está magnífico 🙌🏻

Esta herramienta apenas la estoy conociendo, estoy aprendiendo a usarla, para poder armar un proyecto de un juego de Basta, esta en proceso, pero aca esta el uso de Angular Devtools.

Angular Devtools

Las Angular DevTool es una extensión para navegadores basados en Chromium como Google Chrome, Edge o Brave util para perfilar y depurar aplicaciones desarrollados con Angular. Esta extensión soporta versiones de Angular 9 y superiores.

Angular DevTools es una evolución de una extensión anterior desarrollada por la comunidad llamada Augury. El equipo de Angular de Google con trabajo de los que desarrollaron Augury para generar esta nueva herramienta.

Me tome el reto de subirla a mi repo : <https://tropikow.github.io/angular/>

Angular DevTools funciona solo a partir de Angular12.

muy útil todo

Excelente herramienta!!

Para los que les presenta problemaso me paso a mi

  1. en su angular.json debajo de
 "configurations": {
            "production": {
            ...
            },

agregar

,
            "development": {
              "optimization": false,
              "sourceMap": true,
              "namedChunks": true,
              "extractLicenses": true,
              "vendorChunk": true,
              "buildOptimizer": false,
              "budgets": [
                {
                  "type": "initial",
                  "maximumWarning": "2mb",
                  "maximumError": "6mb"
                },
                {
                  "type": "anyComponentStyle",
                  "maximumWarning": "6kb",
                  "maximumError": "10kb"
                }
              ]
            }
  1. despues dentro de serve debera quedar asi
"serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": {
            "browserTarget": "Webu-web:build"
          },
          "configurations": {
            "production": {
              "browserTarget": "Webu-web:build:production"
            },
            "development": {
              "browserTarget": "nombreProyecto:build:development"
            }
          }
        }

¡Que gran aporte Nico!, me encanta conocer mas sobre estos datos y una parte excepcional del desarrollo de los sistemas desarrollados en Angular.

Excelente curso profesor Molina.
Muchas Gracias!

Feo comparar… pero punto para Vue.js … sus devtools pueden que hagan lo mismo, pero son mucho mejor diseñadas y developer friendly

Excelente heramienta

Excelente extensión para lo desarrolladores angular, muy recomendada

Excelente extension para lo desarrolladores angular, muy recomendada

Que bonito es lo bonito!!!

Muy linda extensión

Angular DevTools is a Chrome extension that provides debugging and profiling capabilities for Angular applications. Angular DevTools supports Angular v9 and later, with Ivy enabled.

Esta geniaaal