Getting started with Angular Signals

Ойын-сауық

Introducing Signals, a new reactivity model in Angular. Signals equips you with high quality tools for fine-grained reactivity,
while setting you on a well lit path and providing you with guardrails to make your app performant. Learn how to start exploring the developer preview in Angular v16 today.
Resources:
Getting started with Signals → goo.gle/41T99yl
Signals Request for Comments →
Angular Twitter → goo.gle/3zyIA4Y
Speakers: Emma Twersky, Alex Rickabaugh
Watch more:
Watch all Angular Sessions → goo.gle/IO23_angular
Watch all the workshops from Google I/O 2023 → goo.gle/IO23_workshops
Watch more Web Sessions → goo.gle/IO23_web
All Google I/O 2023 Sessions → goo.gle/IO23_all
Subscribe to Angular → goo.gle/Angular
#GoogleIO

Пікірлер: 69

  • @Angular
    @Angular Жыл бұрын

    Watch all the Angular Sessions → goo.gle/IO23_angular_pin

  • @RobinMeow-le7em

    @RobinMeow-le7em

    7 ай бұрын

    I know they were called previously `SettableSignal` but since they are called `WriteableSignal` now (which I like more :thumbs_up: I think they should have the method `.write(value: T)`. This would make Kevlin henney also super happy to see less "sets" and "gets" in every code base.

  • @clashclan4739
    @clashclan4739 Жыл бұрын

    The most complicated example to learn signals on the internet

  • @manojht8036

    @manojht8036

    Жыл бұрын

    agreed

  • @samwelkinuthia1550

    @samwelkinuthia1550

    11 ай бұрын

    lmao you're right. The simple counter would have been fine

  • @cananard

    @cananard

    11 ай бұрын

    The only thing I hate about angular is that I'm obliged to use it at my job...

  • @user-kn8nl4lv5y

    @user-kn8nl4lv5y

    11 ай бұрын

    Well, it was created by people who write documentation. It explains everything. Compare React or Vue docs with Angular docs.

  • @schankam

    @schankam

    10 ай бұрын

    Clearly, I was like "wtf, a cipher game really?..."

  • @PashaSemf
    @PashaSemf9 ай бұрын

    Exactly how I imagined the people responsible for Angular!

  • @musashi542

    @musashi542

    9 ай бұрын

    naaah 💀

  • @wobsoriano

    @wobsoriano

    7 ай бұрын

    bro

  • @jazy3091

    @jazy3091

    19 күн бұрын

    Turns 2/3 towards PashaSemf, in scripted excitement: "Now that is a marvellous observation!" - displays NaturalSmile_3.

  • @baris7971
    @baris7971 Жыл бұрын

    the Example Application is pretty complicated. I Joind the other commentators mentioning to use simple Examples to explain the concepts of signals.

  • @Ryval_OW

    @Ryval_OW

    6 ай бұрын

    Skill issue.

  • @despacito2727

    @despacito2727

    3 ай бұрын

    @@Ryval_OW Expected response from a Widow main

  • @sravant
    @sravant Жыл бұрын

    Example should be simple to understand. Not sure why you choose complex examples.

  • @techwithjesus8263
    @techwithjesus8263Ай бұрын

    You both are here to confuse folks 😂😂. I love how Mark Techson explains this on Frontend Masters. I watched the video because of her.

  • @dev-rachid
    @dev-rachid Жыл бұрын

    Greatful ! thanks Angular Team 👍

  • @markusingvarsson2146
    @markusingvarsson2146 Жыл бұрын

    Loved the video! 🥳 a really awesome demo!

  • @shaikhhar6911
    @shaikhhar69113 ай бұрын

    Its just like behaviourSubject but less verbose. I like it

  • @flamousz

    @flamousz

    2 ай бұрын

    yeah no neeed to subscribe, unsubscribe and change value with next()

  • @IlijaIlijev
    @IlijaIlijev Жыл бұрын

    Too complex example for simple things

  • @starvingmusician152
    @starvingmusician152 Жыл бұрын

    Wow really interesting!

  • @themudreco
    @themudreco10 ай бұрын

    I liked it.

  • @jandrorojas6714
    @jandrorojas67147 ай бұрын

    This example... oh my god 🤦‍♂

  • @Angular

    @Angular

    7 ай бұрын

    Thanks for this feedback, we're going to make more examples in the future.

  • @ismailuwair187
    @ismailuwair1873 ай бұрын

    as i just started to work with angular again after 2-3 years of pause, i dont quite get the difference between two-way-bindings and signals as you can just pass the value and it will be shown on the UI when updated. other than that using behaviours also would do the job to track on some values, sharing with services is also possible..

  • @mxz2024
    @mxz20247 ай бұрын

    so the main difference to behavioursubjects is, that you dont need the subscribe stuff and you have less sideffects like with multiple subscriptions and chaining pipes on one subject?

  • @matthewcullum7551

    @matthewcullum7551

    7 ай бұрын

    This was my takeaway. Behavior subjects, but without all the code gymnastics and memory leaks involved

  • @arielunanue4354

    @arielunanue4354

    7 ай бұрын

    thanks @matthewcullum7551, I was wondering about the difference between BehaviorSubject and signals

  • @RenanLeandroFerreira
    @RenanLeandroFerreira Жыл бұрын

    Can we use signals with forms? How signals will be integrated into Form Builder?

  • @Gorgggg

    @Gorgggg

    11 ай бұрын

    Nothing published yet, though you can soon use signals for 2 way data binding. Reactive forms will still need quite some time. Most likely we with some something with Angular 18.

  • @marcialabrahantes3369
    @marcialabrahantes33694 ай бұрын

    This is their replacement for observables... got it!

  • @tarquin161234

    @tarquin161234

    9 күн бұрын

    It isn't a replacement. Signals are synchronous only. Rxjs also has loads of operators. This is why I'm sticking with rxjs.

  • @IbrahimKwakuDuah
    @IbrahimKwakuDuah6 ай бұрын

    My oh mine, is this the intro video? What would the advance be like?

  • @jediampm
    @jediampm Жыл бұрын

    Hi, thanks for the video. Two things: - when using stackblitz, please dont use inline template because of missing code highlighting. - in effect, please dont use var keyword to declare a internal variable. Use const in this case. Another things that dont see an answer for: - signals beside replace zone.js, will it replace also ngModel directive or banana in the box ? - What about forms, mainly template driven forms? thanks.

  • @Gorgggg

    @Gorgggg

    11 ай бұрын

    Hey there. Banana in a box will remain, though implementation will change a little. As 2 way data binding will be expressed as a writable signal (google for for signal components rfc angular github) Ng modules will remain. Though usage will most likely get less and less. There have been no stated plans to remove them. Regarding forms, nothing has been published yet. They will most likely work on that jn Angular 18.

  • @Ernestas23
    @Ernestas233 ай бұрын

    Who ever came up with this example idea, did not want for people to fully understand the signals.

  • @LogUp-uf1th
    @LogUp-uf1th9 ай бұрын

    like the example provided, the video is equally complicated to decipher! Such examples should not be for the introduction of a concept!

  • @mohammedasim3158
    @mohammedasim31586 ай бұрын

    why dont you take very simple example?...

  • @anapaulalopesaraujo3824
    @anapaulalopesaraujo38244 ай бұрын

    Is this example really necessary?! No hate, but it is pretty difficult to understand. 😒

  • @Angular

    @Angular

    4 ай бұрын

    Thanks for this feedback. We're releasing some new examples soon!

  • @koolvoid
    @koolvoid Жыл бұрын

    My team decide to not update to angular 16 because Signals are still in development mode and not ready yet for production, is that true?

  • @CodeShotsWithProfanis

    @CodeShotsWithProfanis

    Жыл бұрын

    Angular Signals are in a Developer Preview. This means that the features are there, they are fully functional and pollished but the API might change in next versions.

  • @Tobawa2601

    @Tobawa2601

    Жыл бұрын

    I mean you can still upgrade to angular 16 and your application should work just fine, because signals haven't replaced anything yet. The signals are part of the developer preview and shouldn't be used in productive environments at the moment.

  • @koolvoid

    @koolvoid

    Жыл бұрын

    @@Tobawa2601 Yhea i know my team is retarded I ask to leave :)

  • @BojanKogoj

    @BojanKogoj

    Жыл бұрын

    If you don't use them it's like they don't exist. Just update

  • @ovidiumiu6283
    @ovidiumiu6283 Жыл бұрын

    Feels like a kids video. vibes so fake

  • @h0ph1p13

    @h0ph1p13

    Жыл бұрын

    Well this happens when a company has too much money so simple 5 minute screencast video gets so many editions that it turns into a material that looks like it was made for 6 year olds. :( Not to mention the overcomplicated framework.

  • @aravindhhere
    @aravindhhere Жыл бұрын

    How this is different from BehaviourSubject ???

  • @MuhammadFaisal04

    @MuhammadFaisal04

    Жыл бұрын

    You cannot compute a BehaviorSubject.

  • @LarsRyeJeppesen

    @LarsRyeJeppesen

    Жыл бұрын

    It's sync always.

  • @MuhammadFaisal04

    @MuhammadFaisal04

    Жыл бұрын

    Also, computing a new value from a BehaviorSubject is imperative, unlike signal which is reactive.

  • @jediampm

    @jediampm

    Жыл бұрын

    Hi, just a simplification: RxJS is an async reactivity where signals are sync reactivity.

  • @hansschenker

    @hansschenker

    Жыл бұрын

    @@vkagklis Signals are not for the Devs , Signals are for the Compiler (CD)!

  • @mugatu2017
    @mugatu2017 Жыл бұрын

    We already have rxjs Subjects to multicast data

  • @SuperCompilator
    @SuperCompilator7 ай бұрын

    A simpler way to explain this is to say: a signal is a useState in react and an effect is a useEffect in react 😊 Good job though (really)

  • @chaseliu5011
    @chaseliu50114 ай бұрын

    have to say this is tutorial is so horrible

  • @siddharthkrishna2499
    @siddharthkrishna2499 Жыл бұрын

    Can use effects to emit signal values instead of calling the emit in multiple places? effect(() => { this.exampleSignalChangeEvent.emit(this.example_signal()); });

  • @andreip.8321
    @andreip.8321 Жыл бұрын

    that document.getElementById in Angular hurts my eyes :D

  • @AlanGramont
    @AlanGramont4 ай бұрын

    var result = compute(() => info.max() + cringe.max())

  • @bhanupratapsingh4879
    @bhanupratapsingh48794 ай бұрын

    Greatful ! thanks Angular Team 👍

Келесі