Lanzamiento de Angular.dev (v17)

Angular fue lanzado por primera vez en 2016 como una herramienta para ayudar a los desarrolladores a construir aplicaciones web modernas. A lo largo de su historia, ha llevado al éxito a millones de desarrolladores.

A lo largo de las últimas versiones, se ha centrado en mejorar el rendimiento y la experiencia del desarrollador en la web moderna. Esto incluye una revisión del sistema de reactividad, mejoras en SSR (Server Side Rendering) y docenas de características adicionales.

Esta semana, el equipo lanzó Angular v17, que incluye vistas diferidas, flujo de control incorporado, soporte para la API de transiciones de vistas, mejoras en SSR y más. Esta renovación merece una identidad moderna que represente la velocidad y la estabilidad a las que el equipo está comprometido.

El equipo de desarrollo se complace en anunciar Angular.dev, el futuro para los desarrolladores de Angular.

La página principal de Angular.dev presenta una animación con un nuevo logotipo colorido con una A en degradado de rosa, púrpura y rojo. Angular.dev será el nuevo sitio, dominio y documentación para el desarrollo Angular. El lanzamiento incluye nuevos tutoriales, documentación actualizada y orientación que ayudará a los desarrolladores a aprovechar las últimas características de Angular.

En los próximos meses, el equipo continuará recopilando comentarios y mejorando el sitio con una variedad de mejoras planificadas.

Angular.io seguirá siendo compatible como recurso heredado para la documentación hasta la versión 17, asegurando que todos los enlaces antiguos sigan siendo funcionales. En la versión 18, después de recopilar comentarios y continuar estabilizando el sitio, se planea hacer de Angular.dev el sitio oficial para todo el desarrollo Angular.

Nuevos tutoriales integrados

Un elemento fundamental de los nuevos documentos son los tutoriales integrados, una nueva forma de aprender Angular directamente en el navegador. Escritos con WebContainers.

Los tutoriales ahora ofrecen pasos pequeños con ejemplos de código en ejecución al lado para aprender los conceptos fundamentales de Angular:

• Angular.dev/tutorials/learn-angular es una nueva forma en el navegador para aprender uno, o todos, los conceptos básicos de Angular.
• Angular.dev/tutorials/first-app te enseña cómo pasar de ¡Hola, mundo! a tu primera aplicación completa en Angular utilizando la CLI, incluido un curso completo en video en el canal de YouTube de Angular

Y tal vez hayas notado que no se detuvieron en los tutoriales…

Se presenta Angular.dev/playground, un espacio para explorar los últimos conceptos de Angular directamente en el navegador.

Comienza con “Hola mundo” o selecciona una de las plantillas y explora las últimas características, incluyendo flujo de control, señales y más. Incluso se incluyó un minijuego inspirado en el lanzamiento de la versión 17.

Nueva documentación y una mejor UX para todos los niveles de desarrollador

Angular.dev enseña desarrollo moderno de Angular desde el principio.

Algunos aspectos destacados incluyen:

• Una nueva estructura de contenido, centrada en enseñar conceptos básicos de Angular para principiantes y profundizar en guías detalladas para desarrolladores avanzados

• Todos los documentos y ejemplos están construidos con APIs independientes para un desarrollo simplificado, incluida una guía de Componentes completamente reescrita

• Orientación de Core Web Vitals escrita en colaboración con el equipo de Aurora de Chrome, que incluye guías sobre optimización de imágenes y mejores prácticas de rendimiento

• Nuevas guías para SSR e hidratación, para un mejor rendimiento de la aplicación por defecto

• Referencia de API y las referencias de CLI también son más útiles (en desarrollo)

• Edición rápida/actualización utilizando el servidor de desarrollo Vite en los tutoriales

• Hoja de ruta pública actualizada

• Mejor buscador

• y mucho más!

El equipo sigue comprometido con la estabilidad y la compatibilidad hacia atrás, pilares de la confiabilidad del framework. Se han actualizado las guías sobre cómo mantenerse actualizado y los NgModules para asegurarse de que Angular.dev sea útil para todos los equipos. En el futuro, se planea integrar update.angular.io en Angular.dev y continuar mejorando la documentación para reflejar aún más las mejores prácticas y recomendaciones más recientes.

Documentación de código abierto

Angular.dev es una aplicación de producción que utiliza las mismas tecnologías de la versión 17 que recomiendan sus guías: APIs independientes, Angular Signals, prerrenderización, hidratación, SSR/SSG, Transiciones de vistas en el enrutador, flujo de control, vistas diferidas y el nuevo constructor de aplicaciones con ESBuild y Vite. También se ha utilizado la aplicación para probar soluciones futuras de Angular, como la hidratación sin zona. El equipo cree en el poder del código abierto.

Hoy, están haciendo el código fuente del sitio público para que los desarrolladores puedan aprender de él y contribuir al repositorio.

¿Puedes contribuir?

¡Claro que sí! El equipo estaría encantado de recibir ayuda para mejorar el nuevo sitio. Con el lanzamiento de un nuevo sitio de esta envergadura, el equipo espera encontrar muchos errores y oportunidades para mejorar el sitio y su documentación.

Si tienes sugerencias, informes de errores o solicitudes de características/documentación, crea un issue en GitHub.

Si estás listo para contribuir, consulta las pautas para saber cómo empezar o haz clic en el icono de lápiz en las páginas de documentación para sugerir una edición en GitHub directamente. Ten en cuenta que esto solo será funcional una vez que se haya fusionado la PR para hacer de este sitio un proyecto de código abierto.

Próximos pasos

El equipo seguirá trabajando en código abierto para mejorar el sitio para la versión 18. El enfoque principal es mejorar la estabilidad del playground integrado y la nueva infraestructura de referencia.

En el futuro, también se crearán guías adicionales y un libro de recetas robusto de tutoriales, aprovechando el nuevo playground integrado. También se ve la oportunidad de crear tutoriales escritos para ayudar a mapear conceptos de otros frameworks web a conceptos de Angular.

Nueva apariencia, mismo framework

El dominio no es lo único nuevo en Angular.dev…

También se lanza el nuevo logotipo y marca de Angular.

Muchos desarrolladores recordarán el primer escudo de AngularJS, una referencia a los logotipos originales de HTML5, CSS3 y JavaScript que se unieron en ese momento. Mucho ha cambiado desde que se lanzó por primera vez el estándar HTML5.

El nuevo logotipo de Angular representa el futuro, diseñado para simbolizar la evolución de Angular en un framework moderno. La hoja de ruta de Angular detalla el compromiso con la estabilidad y velocidad, así como el trabajo para mejorar la experiencia del desarrollador y el rendimiento, con la fuerza de un framework ampliamente adoptado. A medida que Angular continúa explorando e innovando en la plataforma web, este nuevo logotipo representará mejor los esfuerzos actuales y futuras prioridades.

Únase al impulso de Angular

El éxito de Angular está profundamente vinculado a su comunidad. Se reconoce que muchas comunidades, meetups, conferencias, blogs, sitios web, canales de YouTube y desarrolladores han construido su marca sobre la base de Angular.

Hoy, se comparte la guía de marca de forma abierta, para que todos puedan unirse al impulso.

Se puede visitar el nuevo Press Kit y seguir las guías sobre cómo adaptar el nuevo logotipo para que sea propio. Si hay preguntas sobre cómo adaptar el nuevo logotipo o actualizar el propio, se puede enviar un correo electrónico a devrel@angular.io para obtener ayuda adicional. ¡No podemos esperar para ver lo que todos crean!

¡Bienvenidos al renacimiento de Angular!

Gracias a la comunidad verdaderamente asombrosa de desarrolladores que ayudaron a lanzar Angular.dev.