Lo que mi compromiso en Angular me enseñó

Hoy les contaré cómo me metí en los contribuyentes angulares. ¡Resultó que esto no es para nada difícil y muy emocionante! El resultado es un drama con cuatro actos y una moral. Así fue como fue.


Yo hago frontend en Setronica . Vivimos por Ecommerce-Driven-Development.


Nuestra empresa tiene una historia de 10 años de desarrollo front-end. El código ha acumulado mucho y diferente. Con él, puede pasar por las cinco etapas de adopción, pero ahora no se trata de eso. Ahora sobre lo que generalmente teníamos: históricamente, la interfaz se escribió en el marco de Grails. Este es un marco MVC similar a Java que en realidad se usó para el SSR. JQuery agregó un poco de interactividad, al igual que en los viejos tiempos.


Unos años más tarde (aparentemente cuando los desarrolladores front-end dejaron de escribir la interfaz), llegamos a AngularJS. En ese momento, era un marco muy popular para el desarrollo front-end, todos estaban contentos de haber escrito más de 700,000 líneas de código. Todo estuvo genial.


Pero pasó el tiempo, el código se hizo más y más, y aquí está el problema: en nuestro mundo, todo se vuelve obsoleto rápidamente. En desuso y AngularJS. Honestamente lo actualizamos a la versión 1.5, mientras que Angular v2 salió y actualizar el marco ya no era una tarea fácil. Entonces decidimos dejar aquellas aplicaciones que ya están escritas como están. Y elija una nueva pila para la interfaz. El matiz es que nuestra plataforma consta de aplicaciones independientes, cada aplicación se descarga por separado del resto, lo que significa que se puede escribir en cualquier cosa.


Así que actualizamos el entorno y agregamos React. Dejaron de construir proyectos usando Browserify y cambiaron a Webpack. Ahora estamos escribiendo nuevas aplicaciones en React. Pero la política de la compañía en este sentido se ha mantenido igual: el equipo que trabaja en la aplicación decide qué escribir. Los equipos de la vieja escuela todavía escriben en AngularJS, los muchachos con barba todavía corrigen errores en las aplicaciones de Grails.


Muchos sugirieron la idea de configurar la infraestructura para Angular 8. Algunos desarrolladores incluso pudieron mostrar aplicaciones de demostración, y algunos simplemente exclamaron lo que quieren pero no pueden. Después de que comenzamos a construir aplicaciones usando Webpack, la situación mejoró drásticamente y parecía que solo necesita agregar algunos cargadores y ya está. Pero resultó un poco más complicado.


 Algo salió mal


UI-, . , Material UI . HTML-, , . JS-. . Angular 8 .


, UI- HTML- . , . , , . , data-ts.title:


<dialog data-ts="Modal" data-ts.title="some-title">
    <div data-ts="Panel">
        <p>Modal content.</p>
    </div>
</dialog>

. , ? Angular :


<dialog data-ts="Modal" [attr.data-ts.title]="modalTitle">
    <div data-ts="Panel">
        <p>Modal content.</p>
    </div>
</dialog>

, :



, Angular , (data-ts), title . data-ts . , , . .


-


. , . , HTML , Angular . – Issue. – . , , () Angular compiler. . ? …


… 2 . , , . , , , , . , Angular.



, – ( , ). CONTRIBUTING.md. , , Angular Pull Request . , , , , .


, Contributor License Agreement Google , . CONTRIBUTING.md. , .


yarn-, . yarn install . : yarn install, 5-7 .


, – . , , , . , , , . , . Angular , . , , . – - ; , , . , - , :


captura de pantalla del código original


, ? ( boundProp). attr, ( ), , . , . , . , :


versión fija


! , . . , Angular, . Unit- , spec-. , , , . HTML , . , ! , , :


Prueba unitaria añadida


, . , … , : 37000+. , , . . Pull-Request. …



… 2 , . ? , , , Angular. Andrew Kushnir, . . ( , 2 ). , . Pete Bacon Darwin – , 2019 – . !


, , – , UI-. Issue Pull-Request GitHub. .


. , , , HTML- . , PR. … .


, Angular PR . (, ), , HTML- svg- [attr.height.px]="16", height=”16”. , , svg- 9 !


, Pull-Request . , , , .


, , , , Pull-Request.


La misma carta


. , . ?


, Angular. , Angular 9.0.0-rc.2. , 9 .



: . . , . , .


Si el proyecto es grande y popular, esto no significa que no pueda realizar sus propios cambios allí. Si tiene una buena idea o está seguro de que algo no funciona como se esperaba, pruébelo. Incluso si el precio de sus cambios es una línea. A menudo, el equipo de desarrollo es muy positivo acerca de cualquier ayuda externa. Y a menudo ellos mismos simplemente no tienen tiempo para solucionar este o aquel problema.
Si funcionó para mí, ¡también funcionará para ti!


All Articles