Discover and read the best of Twitter Threads about #Angular
Most recents (24)
🅰️ #Angular signals 📡 are all the hype and for a good reason!
As with every new thing, it will take time to learn how it works, so there are many misconceptions like...
🤔 Angular signals will make #RxJs obsolete
Let's build a better understanding to find an answer!
🧵 1/4
As with every new thing, it will take time to learn how it works, so there are many misconceptions like...
🤔 Angular signals will make #RxJs obsolete
Let's build a better understanding to find an answer!
🧵 1/4
The most important difference is that
📡 signals are SYNC, good for
✅ derived state (vs ngOnChanges)
✅ local component reactive state, eg inputs
🔁 #RxJs is used for ASYNC (can be sync)
✅ async orchestration
✅ latest response (race conditions)
✅ cancelation (perf)
🧵 2/4
📡 signals are SYNC, good for
✅ derived state (vs ngOnChanges)
✅ local component reactive state, eg inputs
🔁 #RxJs is used for ASYNC (can be sync)
✅ async orchestration
✅ latest response (race conditions)
✅ cancelation (perf)
🧵 2/4
Signals & RxJs are optimized for handling different parts of the overall state management
Because of that the optimal real-world solutions will likely include both combined using provided interop
✅ fromObservbale
✅ fromSignal
We can get the best of both worlds!
🧵 3/4
Because of that the optimal real-world solutions will likely include both combined using provided interop
✅ fromObservbale
✅ fromSignal
We can get the best of both worlds!
🧵 3/4
Generator function* in JavaScript:
A thread 🧵
#100DaysOfCode #javascript #Angular #reactjs #devbubble
A thread 🧵
#100DaysOfCode #javascript #Angular #reactjs #devbubble
In JavaScript, generator functions are a special type of function that allows you to use the yield keyword to pause and resume the execution of the function.
#100DaysOfCode #NodeJS #CodeLife
#100DaysOfCode #NodeJS #CodeLife
They allow you to create iterators, which are objects that can be used to iterate over a sequence of values.
A generator function is defined using the function* keyword and can be invoked using the yield keyword.
#100daysofcodechallenge #NodeJS #reactjs
A generator function is defined using the function* keyword and can be invoked using the yield keyword.
#100daysofcodechallenge #NodeJS #reactjs
Memoization is a technique used to optimize the performance of a function by caching its results for a given set of inputs.
#100DaysOfCode #reactjs #Angular #NodeJS
#100DaysOfCode #reactjs #Angular #NodeJS
The idea is that if a function is called multiple times with the same input, it's more efficient to return the cached result instead of re-computing the result each time.
#100daysofcodingchallenge #reactjs #Angular #NodeJS
#100daysofcodingchallenge #reactjs #Angular #NodeJS
Data virtualization: With Proxies in JavaScript.
A thread 🧵
#100DaysOfCode #javascript #rarely_used #devbubble
A thread 🧵
#100DaysOfCode #javascript #rarely_used #devbubble
Data virtualization using Proxies in JavaScript refers to the ability to create virtualized data structures, such as virtualized arrays, that load their data on demand rather than loading all data at once.
#100DaysOfCode #ReactJS #Angular
#100DaysOfCode #ReactJS #Angular
This can be useful for improving the performance of an application when working with large data sets.
In this Eg., we create a VirtualArray class that takes in two args- the length of the array & a loader function.
#100DaysOfCode #javascript #NodeJS #ReactJs #Angular #devbubble
In this Eg., we create a VirtualArray class that takes in two args- the length of the array & a loader function.
#100DaysOfCode #javascript #NodeJS #ReactJs #Angular #devbubble
A WeakMap is a map that holds weak references to its keys.
This means that the keys are eligible for garbage collection if there are no other references to them.
This feature can be useful for implementing caches or other similar data structures.
#reactjs #Angular #NodeJS #js
This means that the keys are eligible for garbage collection if there are no other references to them.
This feature can be useful for implementing caches or other similar data structures.
#reactjs #Angular #NodeJS #js
A WeakMap is a special kind of map where keys must be objects and the map doesn't prevent garbage collection of its keys.
You can think of a WeakMap as a map that doesn't "own" its keys, and therefore doesn't keep them alive.
#100daysofcodechallenge #100DaysOfCode
You can think of a WeakMap as a map that doesn't "own" its keys, and therefore doesn't keep them alive.
#100daysofcodechallenge #100DaysOfCode
In #Angular Typed Forms, the `get` method takes a string with dot-separated control names, and returns a fully typed value. How is this possible?
We can actually parse the argument at compile time, using the magic of #TypeScript template literal types! Let's see how it works. 🧵
We can actually parse the argument at compile time, using the magic of #TypeScript template literal types! Let's see how it works. 🧵
Imagine you have a type listing various products, and you want to automatically generate a type for corresponding database columns.
We define a template literal type called DatabaseColumn. It takes any subtype of string, and maps each element onto a string with a column prefix.
We define a template literal type called DatabaseColumn. It takes any subtype of string, and maps each element onto a string with a column prefix.
The previous example generates a string type by concatenation. However, can we also go the other direction, breaking apart a string type?
The answer is yes! Using the `infer` keyword, we can implement a simple parser. This `ProductFrom` type extracts product names from columns.
The answer is yes! Using the `infer` keyword, we can implement a simple parser. This `ProductFrom` type extracts product names from columns.
Hoy en un nuevo episodio de Twitter es mi #StackOverflow, os traigo una duda de #Angular ❤️, que entre que soy junior y hace 🔟 meses que no lo toco aprox. lo tengo un poco oxidado. Dejo la duda por aquí, os cuento mis sospechas y a ver cómo lo resolvemos. #typescript #it
Aquí tenemos el menú que estoy intentando implementar. Este sería el HTML del componente public header. Teóricamente debería funcionar. #angular #programacion #typescript
Aquí tenemos el módulo de Layout, que creo que es por dónde puede estar el problema, pero no acabo de identificarlo. #angular #programacion #typescript #frontend
#RxJS 🐉es una librería básica para trabajar con #Angular ❤️. ¿Quieres aprender a trabajar con esta librería GRATIS y DESDE CERO? ¡Adentro HILO 🧵! ⬇️⬇️⬇️ #frontend #programacion #software
En menos de 1⃣ hora, @domini_code nos hace una magnífica introducción a los conceptos básicos de #RxJS, a través de ejemplos prácticos. MUY recomendable. #frontend #angular #programacion #typescript #software
Este vídeo de Laith Academy da una introducción a esta librería, abordando los conceptos más básicos de una forma muy masticadita. 1⃣h para meter los pies en el barro de #RxJS de forma apropiada. #frontend #angular #programacion #typescript #software
Understanding directive composition API in Angular 15
@angular #angular #angular15 #typescript #javascript
It’s one of the most requested feature from the Angular community since 2016. (From Angular 2 onwards)
(1/n)
@angular #angular #angular15 #typescript #javascript
It’s one of the most requested feature from the Angular community since 2016. (From Angular 2 onwards)
(1/n)
Create a stand alone directive and add some functionality like css style
Add it in the component declaration using
`hostDirectives` property
`hostDirectives` property
#Angular #techtalks were in the spotlight this September with an overwhelming number of videos featuring experts from all over the world. This time we hand selected the top 5 of them for you to pick up all you can. Enjoy!
blog.meetupfeed.io/angular-septem…
blog.meetupfeed.io/angular-septem…
1st: Let's talk about the Jamstack architecture and where Angular fits with @Tzmanics
meetupfeed.io/talk/what-is-a…
meetupfeed.io/talk/what-is-a…
2nd: @DecodedFrontend will share with you different error handling strategies in Angular that will help you to solve 80% of possible scenarios that might occur in your applications
meetupfeed.io/talk/error-han…
meetupfeed.io/talk/error-han…
Bienvenidos a mi twitter profesional. Aquí encontrarás contenido relacionado con #programacion 💻y #psicologia 🧠. ¡Sígueme para no perderte nada de este contenido! Aquí te dejo todos los hilos que he ido haciendo, con muchísimo contenido útil y gratis. Hope it helps 😉⬇️⬇️⬇️ #it
Los mejores recursos GRATIS para comprender #React #Context 🔯 #reacthooks #typescript #javascript #frontend
Los mejores recursos GRATIS para aprender #Angular ❤️desde CERO #typescript #javascript #frontend #programacion
Te dejo un HILO 🧵con los 5⃣ mejores recursos para #aprender #Angular ❤️ desde cero (Y GRATIS). ¡Sigue leyendo! #informatica #frontend #typescript
Aquí tienes un tutorial de casi 5⃣ horas de @domini_code dónde aprenderás desde los conceptos básicos de #Angular ❤️ hasta crear una aplicación sencilla para ponerlos en práctica #informatica #frontend #typescript #javascript
Si buscas algo más avanzado, aquí tienes un curso de 1⃣7⃣h de @freeCodeCamp dónde vas a ver desde lo más básico (introducción a #TypeScript 💙, introducción a #Angular ❤️) hasta conceptos más avanzados como Routing Avanzado, Formularios Reactivos...
If you are still using ng-deep to style child components you really should consider the alternatives.
Host styling, content projection, and CSS variables are all potential solutions for this common problem.
Let’s explore the options below 👇
#Angular
Host styling, content projection, and CSS variables are all potential solutions for this common problem.
Let’s explore the options below 👇
#Angular
First a couple of words why we need ng-deep in the first place.
In Angular, component's styles are encapsulated within the component's element so that they don't affect the rest of the application.
That has a side effect of making it difficult to style child components.
In Angular, component's styles are encapsulated within the component's element so that they don't affect the rest of the application.
That has a side effect of making it difficult to style child components.
To alleviate this issue, Angular provides an ng-deep selector which pierces the encapsulation of the child component.
All is good then?
Not really, the selector has been deprecated for years and is not recommended by the official docs.
All is good then?
Not really, the selector has been deprecated for years and is not recommended by the official docs.
🔥 Easiest guide you will find online for this!! (A Long Thread🧵)
#Angular #web3 #Metamask #Ethereum #javascript
#Angular #web3 #Metamask #Ethereum #javascript
1) First of all, we will begin with installing all the packages we need
npm i web3 crypto-browserify stream-browserify assert stream-http https-browserify os-browserify browser url os-browserify process -S
Then we add this bit of code to the respective files
npm i web3 crypto-browserify stream-browserify assert stream-http https-browserify os-browserify browser url os-browserify process -S
Then we add this bit of code to the respective files
2) Then we create a service using Angular-CLI
ng g s metamask
in this service, we start by creating a basic getter for our wallet info which returns wallet connection status and its address.
ng g s metamask
in this service, we start by creating a basic getter for our wallet info which returns wallet connection status and its address.
Another month has passed so we’re back with the most watched #Angular #meetups from June.
Dive right into internationalization, inject services, smart apps, libraries, providers and much more. Extend your knowledge with the highest-rated #techtalks.
blog.meetupfeed.io/angular-tech-t…
Dive right into internationalization, inject services, smart apps, libraries, providers and much more. Extend your knowledge with the highest-rated #techtalks.
blog.meetupfeed.io/angular-tech-t…
Introduction to Internationalization in Angular via @marktechson
Mark Thompson covers in 15 minutes how to internationalize and localize an #application in #Angular to do exactly what you wish for!
meetupfeed.io/talk/introduct…
Mark Thompson covers in 15 minutes how to internationalize and localize an #application in #Angular to do exactly what you wish for!
meetupfeed.io/talk/introduct…
New Way to Inject Services in #Angular 14 via @DecodedFrontend
Let’s have a look at some base use cases.
meetupfeed.io/talk/new-way-t…
Let’s have a look at some base use cases.
meetupfeed.io/talk/new-way-t…
Are you a #JavaScript #developer looking for ways to improve from day to day? You’ve come to the right place! Bury yourself in encryption, testing, closures and many more talks from #JS experts all over the world.
blog.meetupfeed.io/7-javascript-m…
#programming
blog.meetupfeed.io/7-javascript-m…
#programming
The Art of Writing Secrets - Encryption for JavaScript Developers via @WomenWhoCode @jischr
Jen Schreiber is a Senior #SoftwareEngineer . In this talk, she introduces you to encryption in JavaScript- all you need to know.
meetupfeed.io/talk/the-art-o…
Jen Schreiber is a Senior #SoftwareEngineer . In this talk, she introduces you to encryption in JavaScript- all you need to know.
meetupfeed.io/talk/the-art-o…
#JavaScript Tests in #Node, the Browser, and CI via @rob_rich
Watch as Rob live-codes sync tests, async with callbacks, promise-based tests, and async/await tests. He crafts tests in Node, tests in the Browser, and unit tests that run from CI.
meetupfeed.io/talk/java-scri…
Watch as Rob live-codes sync tests, async with callbacks, promise-based tests, and async/await tests. He crafts tests in Node, tests in the Browser, and unit tests that run from CI.
meetupfeed.io/talk/java-scri…
(1) Sigo trabajando con el clon de Gamezonia (desarrollado inicialmente en #angular gamezonia.netlify.app) para #react y hoy me he metido con el carrito de compra.
He cambiado la perspectiva de cómo lo hice antes y ahora en vez de un menú lateral, tengo un componente a página👇
He cambiado la perspectiva de cómo lo hice antes y ahora en vez de un menú lateral, tengo un componente a página👇
(2) completa y hago en principio la gestión sin comerme mucho la cabeza. Guardo todo en un localStorage y gestiono con varias acciones dentro de un custom hook (useCart) y bueno, por el momento guay, mejorable pero seguimos avanzando.
Esto lo meteré en la librería👇
Esto lo meteré en la librería👇
(3) "react-shop-ui" que estoy desarrollando y que todavía no quiero compartirlo oficialmente, ya que quiero documentarlo todo bien. Esta librería es el clon de ng-shop-ui: npmjs.com/package/@mugan… que use para agilizar el proceso en el curso de MEAN+GraphQL y así enseñar👇
¿Quieres saber cómo está el mercado de talento #tech en Latinoamérica? (incluyendo salarios)
@getonbrd lanzó su reporte anual con datos de:
23,000+ trabajos
900,000+ aplicaciones
250,000+ professionales
❤️ RT
👇🏽 HILO
@getonbrd lanzó su reporte anual con datos de:
23,000+ trabajos
900,000+ aplicaciones
250,000+ professionales
❤️ RT
👇🏽 HILO
🥷🏽 ¿Cuáles son los skills más solicitados por las empresas?
En programación en general:
💛 #JavaScript de primero (obvio Boby)
2️⃣ #CSS, #Git y #React peleándose el segundo lugar
🇺🇸 "English" en un sólido tercer lugar.
En programación en general:
💛 #JavaScript de primero (obvio Boby)
2️⃣ #CSS, #Git y #React peleándose el segundo lugar
🇺🇸 "English" en un sólido tercer lugar.
👩🏽🎨 En Diseño / #UX
El primer lugar es una pelea a cuchillo entre @figmadesign y @Adobe
Seguido de #UIDesign, #wireframes y @sketch
Y por supuesto Inglés.
El primer lugar es una pelea a cuchillo entre @figmadesign y @Adobe
Seguido de #UIDesign, #wireframes y @sketch
Y por supuesto Inglés.
It may seem simple as you may have some data in tables (hello, MySQL) and you want them on a web page (hi, <table>). But you start joining data from other tables and you end up displaying a tree in a table. How? You never know how to do it until you try to use that. UX!
(2/6)
(2/6)
But if you have tree-data, tree-database (hello, Mongo), and tree components on website, you still need tables to present the data of similar structure. It's all 2D and are brains are trained to get information presented as combination of 2 axes. Hello, tables!
(3/6)
(3/6)
Après des mois de travail à distance imposé, notre bureau #Montpellier se réinvente pour accompagner notre transition sur le modèle d'Hybrid Workplace : nouveaux espaces de collaboration et de visio-conf, nouveaux espaces de travail #flexoffice et nouvelle déco ! 🔽 thread !
Le télétravail existe depuis toujours à Hawk, mais force est de constater que durant ces deux dernières années il a pris une part prépondérante dans notre quotidien. Notre organisation future sera un modèle hybride où télétravail, présentiel et remote cohabiteront harmonieusement
Le flex office, pour ou contre ? Chez Hawk la réponse a été quasi-unanime : POUR 👍 ! Parfait pour booster le foisonnement d'idées et favoriser l'émergence de solutions innovantes.
Et pour soutenir ce changement, quoi de mieux que des nouveaux espaces de travail modernisés ?
Et pour soutenir ce changement, quoi de mieux que des nouveaux espaces de travail modernisés ?
It’s already October? Don’t forget to check out last month’s most popular videos of #Angular. 👀
Congrats @ngconf @WomenWhoCode @Frontend_Love 👏
blog.meetupfeed.io/angular-septem…
Congrats @ngconf @WomenWhoCode @Frontend_Love 👏
blog.meetupfeed.io/angular-septem…
At first, let @ManfredSteyer guide you through the implementation of #Micro-Frontends into several projects he has been involved in the past 🧐
meetupfeed.io/talk/federated…
meetupfeed.io/talk/federated…
Don’t miss out on the making of Capacitor Flux with #NativeScript by @nathanwalker197 & Osei Fortune in this next video:
meetupfeed.io/talk/ionic-ang…
meetupfeed.io/talk/ionic-ang…
Got a few new gigs coming up.
#freelance #developer #fullstack #node #react #next #jamstack #webflow #remote
A thread.
#freelance #developer #fullstack #node #react #next #jamstack #webflow #remote
A thread.
Webflow developer - More here >>> bit.ly/3l3yCkd
Sr Full-stack Node, React + Next Dev [Open application] More info here >>> bit.ly/3DZ7kUI
First up: @John_Papa's talk at @pluralsight. John talks about all the news regarding the #Angular framework, tooling and the developer experience.
meetupfeed.io/talk/angular-w…
meetupfeed.io/talk/angular-w…
We love collaborations! @AngularDutch, together with @AthensAngular and @ngbrum held a joint #Angular meetup with @mgechev and @JoostK discussing topics like the state of Angular and the libraries in Angular 12.
meetupfeed.io/talk/angular-s…
meetupfeed.io/talk/angular-s…
Already *before* the #Angular announced the deprecation of protractor, 64 % (!) of Angular devs used @Cypress_io, @rainerhahnekamp tells us at our meetup.
Here are some more stats!
