Thank you everybody! Make sure to leave a comment if you want a free T-shirt. https://angularfirebase.com/lessons/ask-me-anything-april-2018/

NgConf - https://www.ng-conf.org/
2024-02-04T07:37:38.010Z
nova-2
2-general-nova
2024-01-09.29447
30089e05-99d1-4376-b32e-c263170674af
5bfba7f3-de63-40db-bf8a-b3885ea22091
f358b070b9b6c1f0940f2dcdb0602aed6fdc712d52dad8955c7a7ede8983f79a
67875a7f-c9c4-48a0-aa55-5bdb8a91c34a
deprecated
April is a special month for this channel.
It's the 1 year anniversary of the first video.
It's the month we first surpassed 1,000,000 views, and it's also the month that I got to meet a lot of people in person that I know from this project at NG Conf in Salt Lake City.
This video marks episode 100, and for it we're going to do something a little bit different than normal.
I'm going to spend some time answering questions that you've asked on Slack and YouTube that wouldn't normally fit into this channel's content.
But before we get into that, I just wanted to say thank you to everybody who supports this channel either with a pro membership or just by simply liking and watching the videos.
It's your feedback that really drives the direction of this content and I'm really grateful for that.
To show my appreciation, I'm going to provide 10 free t shirts or gift cards to anybody that comments on this video with a suggestion about what they wanna see next.
Just leave a comment and I will randomly select the winners by the end of this week.
Okay.
So now let's jump into question number 1.
How was n g dot conf?
I have been to quite a few tech conferences in the past, and most of them are pretty boring.
But I have to say n g dot conf stands out as being extremely well organized and engaging.
If you ever get the chance to go, it's well worth the investment.
But what I really wanna share is my top five most exciting things happening in the Angular world.
Number 1 by far for me is Angular Elements.
This allows us to build Angular components and use them as custom elements in HTML without bootstrapping an entire Angular app.
This opens up an entirely new paradigm Time for Angular development, where we can focus on building components and then drop them into existing applications.
For example, if you have a Ruby on Rails application, you can build an Angular component, provide a script, and then use that component in your Rails app.
It's a total game changer for Angular developers.
Number 2 is the new Ivy render engine.
The first thing it's going to do is dramatically reduce bundle sizes with advanced tree shaking techniques.
A compressed and minified Hello World app is only 2.7 kilobytes, which is extremely small.
But if that's not enough, it's also going to dramatically improve debugging capabilities.
If you've ever seen the expression has changed after it's been checked error, then you probably know that it's very frustrating to debug.
But Ivy includes a much improved stack trace that will take you exactly to the point in the template where that error occurred.
So very much looking forward to Ivy in version 6.
I'm also looking forward to RxJS version 6.
If you're like me, your components probably have 20 different lines dedicated to RxJS imports, and that's because there's hundreds of different import points in the library.
But in version 6, there will only be 2 main import locations, which will dramatically reduce the number of lines of code it takes to use Rx in your Angular project.
Now moving on to number 4 is the new Versus Code live share mode, which was announced at ng conf.
This feature allows multiple for people to collaborate on a document in real time, similar to how Google Docs works.
This means that you can pair program remotely on a shared document, which opens up the or for all kinds of cool stuff with education and just teamwork in general.
The last thing I wanna show you is a new feature from Stackblitz called teleport.
It will show you real time changes happening to your app across all devices.
So if you're building a PWA on your desktop and you wanna see how it works on a mobile device, You can do that using teleport.
Stackblitz will give you a URL that you can load up on your iPhone, and then you can see the changes happening in real time similar to how real time features work in Firebase.
That wraps up the top five for me, but make sure to watch all the talks on YouTube because there was so much great stuff that I just wasn't able to over here.
I want to switch gears to a question I get asked frequently, which is how do you make your videos?
The first thing I do is I write a bunch of code on my Ubuntu workspace and make sure that I have a solid working demo before doing anything else.
From there, I have a special patented technique that I use for recording code snippets.
What I do is I delete things in reverse order, then I click record on my camera, and then hit control z or undo to rebuild the function step by step.
Once I have those recorded, I use Adobe Creative Cloud to produce the video, mostly Adobe Premiere, but also Adobe After Effects for certain animations.
I create the videos on Windows, but I also have a Mac, which is equally effective at producing videos.
The next question I want to address is what is a Cordova plugin, which was asked by Hayden on our Slack channel.
This is a great question because Cordova plug ins basically feel like a black box, and we just kind of trust that they're doing what they're supposed to do.
The underlying problem that Cordova plug ins solve is that we want to use JavaScript to interact with SDKs that only understand Java, active c, Swift, and Kotlin.
So a Cordova plugin can be thought of as a bridge that allows us to use a JavaScript interface to write code that normally only runs in these other languages that native mobile apps understand.
If you look at the source code for a plugin, You'll see that its code base is normally split between JavaScript and then Android and iOS code.
You'll generally see a file for iOS, which is going to have some Objective C Files.
Then you'll see an Android folder, which generally has some Java files.
On my future video list, I have building a capacitor plugin from Scratch, which is very similar to Cordova, but that video is probably still a couple months off.
The next question comes from Raul on YouTube.
I've never used a state management library.
Should I learn ngrx or NGXS?
But I think a much more important question is, do I need a state management library at all?
Because both libraries will add additional overhead and complexity to your application in an effort to make complex state more predictable and easy to test.
There's a good saying in the React world that says, you don't need Redux until you know you need Redux.
And I think there's a lot of truth in that.
I have a quick start lesson for both, so test drive them and and see which one fits your actual coding style and the preferences of your team.
The final question comes from Pierre on Slack, and that's how do I build an online shop with Angular and Firebase.
The beauty of the Angular Firebase stack is that it affords you a ton of flexibility, but at the same time, it helps you build things quickly and reliably.
Whenever building something involving payments or ecommerce, I recommend leveraging a 3rd party API because building this from scratch is something that's hard to pull off for most businesses.
Stripe payments, for example, gives you a ton of tools implement your own ecommerce solution, but there's a bunch of other alternatives that you should compare and contrast such as Square, Braintree, and a new one called Molten that I haven't actually tried, but it does look very interesting.
What's really interesting is now that Angular Elements is on the horizon, it opens up the door to use Angular components and platforms like Shopify.
So you could use the underlying platform for your ecommerce solution and then add interactivity on top of it with Angular Elements.
I'm gonna go ahead and wrap things up here.
If This video helped you, please like and subscribe, and don't forget to leave a comment for your chance to win a free t shirt or a gift card.
Thanks again for your support, and I can't wait to see what the next one our videos will bring.

Speaker 0: April is a special month for this channel. It's the 1 year anniversary of the first video. It's the month we first surpassed 1,000,000 views, and it's also the month that I got to meet a lot of people in person that I know from this project at NG Conf in Salt Lake City. This video marks episode 100, and for it we're going to do something a little bit different than normal. I'm going to spend some time answering questions that you've asked on Slack and YouTube that wouldn't normally fit into this channel's content.

But before we get into that, I just wanted to say thank you to everybody who supports this channel either with a pro membership or just by simply liking and watching the videos. It's your feedback that really drives the direction of this content and I'm really grateful for that. To show my appreciation, I'm going to provide 10 free t shirts or gift cards to anybody that comments on this video with a suggestion about what they wanna see next. Just leave a comment and I will randomly select the winners by the end of this week. Okay.

So now let's jump into question number 1. How was n g dot conf? I have been to quite a few tech conferences in the past, and most of them are pretty boring. But I have to say n g dot conf stands out as being extremely well organized and engaging. If you ever get the chance to go, it's well worth the investment.

But what I really wanna share is my top five most exciting things happening in the Angular world. Number 1 by far for me is Angular Elements. This allows us to build Angular components and use them as custom elements in HTML without bootstrapping an entire Angular app. This opens up an entirely new paradigm Time for Angular development, where we can focus on building components and then drop them into existing applications. For example, if you have a Ruby on Rails application, you can build an Angular component, provide a script, and then use that component in your Rails app.

It's a total game changer for Angular developers. Number 2 is the new Ivy render engine. The first thing it's going to do is dramatically reduce bundle sizes with advanced tree shaking techniques. A compressed and minified Hello World app is only 2.7 kilobytes, which is extremely small. But if that's not enough, it's also going to dramatically improve debugging capabilities.

If you've ever seen the expression has changed after it's been checked error, then you probably know that it's very frustrating to debug. But Ivy includes a much improved stack trace that will take you exactly to the point in the template where that error occurred. So very much looking forward to Ivy in version 6. I'm also looking forward to RxJS version 6. If you're like me, your components probably have 20 different lines dedicated to RxJS imports, and that's because there's hundreds of different import points in the library.

But in version 6, there will only be 2 main import locations, which will dramatically reduce the number of lines of code it takes to use Rx in your Angular project. Now moving on to number 4 is the new Versus Code live share mode, which was announced at ng conf. This feature allows multiple for people to collaborate on a document in real time, similar to how Google Docs works. This means that you can pair program remotely on a shared document, which opens up the or for all kinds of cool stuff with education and just teamwork in general. The last thing I wanna show you is a new feature from Stackblitz called teleport.

It will show you real time changes happening to your app across all devices. So if you're building a PWA on your desktop and you wanna see how it works on a mobile device, You can do that using teleport. Stackblitz will give you a URL that you can load up on your iPhone, and then you can see the changes happening in real time similar to how real time features work in Firebase. That wraps up the top five for me, but make sure to watch all the talks on YouTube because there was so much great stuff that I just wasn't able to over here. I want to switch gears to a question I get asked frequently, which is how do you make your videos?

The first thing I do is I write a bunch of code on my Ubuntu workspace and make sure that I have a solid working demo before doing anything else. From there, I have a special patented technique that I use for recording code snippets. What I do is I delete things in reverse order, then I click record on my camera, and then hit control z or undo to rebuild the function step by step. Once I have those recorded, I use Adobe Creative Cloud to produce the video, mostly Adobe Premiere, but also Adobe After Effects for certain animations. I create the videos on Windows, but I also have a Mac, which is equally effective at producing videos.

The next question I want to address is what is a Cordova plugin, which was asked by Hayden on our Slack channel. This is a great question because Cordova plug ins basically feel like a black box, and we just kind of trust that they're doing what they're supposed to do. The underlying problem that Cordova plug ins solve is that we want to use JavaScript to interact with SDKs that only understand Java, active c, Swift, and Kotlin. So a Cordova plugin can be thought of as a bridge that allows us to use a JavaScript interface to write code that normally only runs in these other languages that native mobile apps understand. If you look at the source code for a plugin, You'll see that its code base is normally split between JavaScript and then Android and iOS code.

You'll generally see a file for iOS, which is going to have some Objective C Files. Then you'll see an Android folder, which generally has some Java files. On my future video list, I have building a capacitor plugin from Scratch, which is very similar to Cordova, but that video is probably still a couple months off. The next question comes from Raul on YouTube. I've never used a state management library.

Should I learn ngrx or NGXS? But I think a much more important question is, do I need a state management library at all? Because both libraries will add additional overhead and complexity to your application in an effort to make complex state more predictable and easy to test. There's a good saying in the React world that says, you don't need Redux until you know you need Redux. And I think there's a lot of truth in that.

I have a quick start lesson for both, so test drive them and and see which one fits your actual coding style and the preferences of your team. The final question comes from Pierre on Slack, and that's how do I build an online shop with Angular and Firebase. The beauty of the Angular Firebase stack is that it affords you a ton of flexibility, but at the same time, it helps you build things quickly and reliably. Whenever building something involving payments or ecommerce, I recommend leveraging a 3rd party API because building this from scratch is something that's hard to pull off for most businesses. Stripe payments, for example, gives you a ton of tools implement your own ecommerce solution, but there's a bunch of other alternatives that you should compare and contrast such as Square, Braintree, and a new one called Molten that I haven't actually tried, but it does look very interesting.

What's really interesting is now that Angular Elements is on the horizon, it opens up the door to use Angular components and platforms like Shopify. So you could use the underlying platform for your ecommerce solution and then add interactivity on top of it with Angular Elements. I'm gonna go ahead and wrap things up here. If This video helped you, please like and subscribe, and don't forget to leave a comment for your chance to win a free t shirt or a gift card. Thanks again for your support, and I can't wait to see what the next one our videos will bring.
April is a special month for this channel. It's the 1 year anniversary of the first video. It's the month we first surpassed 1,000,000 views, and it's also the month that I got to meet a lot of people in person that I know from this project at NG Conf in Salt Lake City. This video marks episode 100, and for it we're going to do something a little bit different than normal. I'm going to spend some time answering questions that you've asked on Slack and YouTube that wouldn't normally fit into this channel's content. But before we get into that, I just wanted to say thank you to everybody who supports this channel either with a pro membership or just by simply liking and watching the videos. It's your feedback that really drives the direction of this content and I'm really grateful for that.
youtube
television
video gaming
customer support
seasons
media
netflix
To show my appreciation, I'm going to provide 10 free t shirts or gift cards to anybody that comments on this video with a suggestion about what they wanna see next. Just leave a comment and I will randomly select the winners by the end of this week. Okay. So now let's jump into question number 1. How was n g dot conf? I have been to quite a few tech conferences in the past, and most of them are pretty boring. But I have to say n g dot conf stands out as being extremely well organized and engaging. If you ever get the chance to go, it's well worth the investment. But what I really wanna share is my top five most exciting things happening in the Angular world. Number 1 by far for me is Angular Elements. This allows us to build Angular components and use them as custom elements in HTML without bootstrapping an entire Angular app. This opens up an entirely new paradigm Time for Angular development, where we can focus on building components and then drop them into existing applications. For example, if you have a Ruby on Rails application, you can build an Angular component, provide a script, and then use that component in your Rails app. It's a total game changer for Angular developers. Number 2 is the new Ivy render engine. The first thing it's going to do is dramatically reduce bundle sizes with advanced tree shaking techniques. A compressed and minified Hello World app is only 2.7 kilobytes, which is extremely small. But if that's not enough, it's also going to dramatically improve debugging capabilities. If you've ever seen the expression has changed after it's been checked error, then you probably know that it's very frustrating to debug. But Ivy includes a much improved stack trace that will take you exactly to the point in the template where that error occurred. So very much looking forward to Ivy in version 6. I'm also looking forward to RxJS version 6. If you're like me, your components probably have 20 different lines dedicated to RxJS imports, and that's because there's hundreds of different import points in the library. But in version 6, there will only be 2 main import locations, which will dramatically reduce the number of lines of code it takes to use Rx in your Angular project. Now moving on to number 4 is the new Versus Code live share mode, which was announced at ng conf. This feature allows multiple for people to collaborate on a document in real time, similar to how Google Docs works.
This means that you can pair program remotely on a shared document, which opens up the or for all kinds of cool stuff with education and just teamwork in general. The last thing I wanna show you is a new feature from Stackblitz called teleport. It will show you real time changes happening to your app across all devices. So if you're building a PWA on your desktop and you wanna see how it works on a mobile device, You can do that using teleport.
multimedia
programming
networking
phones
Stackblitz will give you a URL that you can load up on your iPhone, and then you can see the changes happening in real time similar to how real time features work in Firebase.
That wraps up the top five for me, but make sure to watch all the talks on YouTube because there was so much great stuff that I just wasn't able to over here. I want to switch gears to a question I get asked frequently, which is how do you make your videos?
youtube
video gaming
The first thing I do is I write a bunch of code on my Ubuntu workspace and make sure that I have a solid working demo before doing anything else.
From there, I have a special patented technique that I use for recording code snippets. What I do is I delete things in reverse order, then I click record on my camera, and then hit control z or undo to rebuild the function step by step. Once I have those recorded, I use Adobe Creative Cloud to produce the video, mostly Adobe Premiere, but also Adobe After Effects for certain animations. I create the videos on Windows, but I also have a Mac, which is equally effective at producing videos. The next question I want to address is what is a Cordova plugin, which was asked by Hayden on our Slack channel. This is a great question because Cordova plug ins basically feel like a black box, and we just kind of trust that they're doing what they're supposed to do.
youtube
video gaming
multimedia
streaming
animation
The underlying problem that Cordova plug ins solve is that we want to use JavaScript to interact with SDKs that only understand Java, active c, Swift, and Kotlin. So a Cordova plugin can be thought of as a bridge that allows us to use a JavaScript interface to write code that normally only runs in these other languages that native mobile apps understand. If you look at the source code for a plugin, You'll see that its code base is normally split between JavaScript and then Android and iOS code. You'll generally see a file for iOS, which is going to have some Objective C Files. Then you'll see an Android folder, which generally has some Java files. On my future video list, I have building a capacitor plugin from Scratch, which is very similar to Cordova, but that video is probably still a couple months off. The next question comes from Raul on YouTube. I've never used a state management library. Should I learn ngrx or NGXS? But I think a much more important question is, do I need a state management library at all?
Because both libraries will add additional overhead and complexity to your application in an effort to make complex state more predictable and easy to test. There's a good saying in the React world that says, you don't need Redux until you know you need Redux. And I think there's a lot of truth in that.
software
software development
I have a quick start lesson for both, so test drive them and and see which one fits your actual coding style and the preferences of your team. The final question comes from Pierre on Slack, and that's how do I build an online shop with Angular and Firebase. The beauty of the Angular Firebase stack is that it affords you a ton of flexibility, but at the same time, it helps you build things quickly and reliably. Whenever building something involving payments or ecommerce, I recommend leveraging a 3rd party API because building this from scratch is something that's hard to pull off for most businesses. Stripe payments, for example, gives you a ton of tools implement your own ecommerce solution, but there's a bunch of other alternatives that you should compare and contrast such as Square, Braintree, and a new one called Molten that I haven't actually tried, but it does look very interesting.
What's really interesting is now that Angular Elements is on the horizon, it opens up the door to use Angular components and platforms like Shopify. So you could use the underlying platform for your ecommerce solution and then add interactivity on top of it with Angular Elements. I'm gonna go ahead and wrap things up here. If This video helped you, please like and subscribe, and don't forget to leave a comment for your chance to win a free t shirt or a gift card. Thanks again for your support, and I can't wait to see what the next one our videos will bring.
youtube
advertising
animation
social media
multimedia
media
television
April is a special month for this channel. It's the 1 year anniversary of the first video. It's the month we first surpassed 1,000,000 views, and it's also the month that I got to meet a lot of people in person that I know from this project at NG Conf in Salt Lake City. This video marks episode 100, and for it we're going to do something a little bit different than normal. I'm going to spend some time answering questions that you've asked on Slack and YouTube that wouldn't normally fit into this channel's content. But before we get into that, I just wanted to say thank you to everybody who supports this channel either with a pro membership or just by simply liking and watching the videos. It's your feedback that really drives the direction of this content and I'm really grateful for that. To show my appreciation, I'm going to provide 10 free t shirts or gift cards to anybody that comments on this video with a suggestion about what they wanna see next. Just leave a comment and I will randomly select the winners by the end of this week. Okay. So now let's jump into question number 1. How was n g dot conf? I have been to quite a few tech conferences in the past, and most of them are pretty boring. But I have to say n g dot conf stands out as being extremely well organized and engaging. If you ever get the chance to go, it's well worth the investment. But what I really wanna share is my top five most exciting things happening in the Angular world. Number 1 by far for me is Angular Elements. This allows us to build Angular components and use them as custom elements in HTML without bootstrapping an entire Angular app. This opens up an entirely new paradigm Time for Angular development, where we can focus on building components and then drop them into existing applications. For example, if you have a Ruby on Rails application, you can build an Angular component, provide a script, and then use that component in your Rails app. It's a total game changer for Angular developers. Number 2 is the new Ivy render engine. The first thing it's going to do is dramatically reduce bundle sizes with advanced tree shaking techniques. A compressed and minified Hello World app is only 2.7 kilobytes, which is extremely small. But if that's not enough, it's also going to dramatically improve debugging capabilities. If you've ever seen the expression has changed after it's been checked error, then you probably know that it's very frustrating to debug. But Ivy includes a much improved stack trace that will take you exactly to the point in the template where that error occurred. So very much looking forward to Ivy in version 6. I'm also looking forward to RxJS version 6. If you're like me, your components probably have 20 different lines dedicated to RxJS imports, and that's because there's hundreds of different import points in the library. But in version 6, there will only be 2 main import locations, which will dramatically reduce the number of lines of code it takes to use Rx in your Angular project. Now moving on to number 4 is the new Versus Code live share mode, which was announced at ng conf. This feature allows multiple for people to collaborate on a document in real time, similar to how Google Docs works. This means that you can pair program remotely on a shared document, which opens up the or for all kinds of cool stuff with education and just teamwork in general. The last thing I wanna show you is a new feature from Stackblitz called teleport. It will show you real time changes happening to your app across all devices. So if you're building a PWA on your desktop and you wanna see how it works on a mobile device, You can do that using teleport. Stackblitz will give you a URL that you can load up on your iPhone, and then you can see the changes happening in real time similar to how real time features work in Firebase. That wraps up the top five for me, but make sure to watch all the talks on YouTube because there was so much great stuff that I just wasn't able to over here. I want to switch gears to a question I get asked frequently, which is how do you make your videos? The first thing I do is I write a bunch of code on my Ubuntu workspace and make sure that I have a solid working demo before doing anything else. From there, I have a special patented technique that I use for recording code snippets. What I do is I delete things in reverse order, then I click record on my camera, and then hit control z or undo to rebuild the function step by step. Once I have those recorded, I use Adobe Creative Cloud to produce the video, mostly Adobe Premiere, but also Adobe After Effects for certain animations. I create the videos on Windows, but I also have a Mac, which is equally effective at producing videos. The next question I want to address is what is a Cordova plugin, which was asked by Hayden on our Slack channel. This is a great question because Cordova plug ins basically feel like a black box, and we just kind of trust that they're doing what they're supposed to do. The underlying problem that Cordova plug ins solve is that we want to use JavaScript to interact with SDKs that only understand Java, active c, Swift, and Kotlin. So a Cordova plugin can be thought of as a bridge that allows us to use a JavaScript interface to write code that normally only runs in these other languages that native mobile apps understand. If you look at the source code for a plugin, You'll see that its code base is normally split between JavaScript and then Android and iOS code. You'll generally see a file for iOS, which is going to have some Objective C Files. Then you'll see an Android folder, which generally has some Java files. On my future video list, I have building a capacitor plugin from Scratch, which is very similar to Cordova, but that video is probably still a couple months off. The next question comes from Raul on YouTube. I've never used a state management library. Should I learn ngrx or NGXS? But I think a much more important question is, do I need a state management library at all? Because both libraries will add additional overhead and complexity to your application in an effort to make complex state more predictable and easy to test. There's a good saying in the React world that says, you don't need Redux until you know you need Redux. And I think there's a lot of truth in that. I have a quick start lesson for both, so test drive them and and see which one fits your actual coding style and the preferences of your team. The final question comes from Pierre on Slack, and that's how do I build an online shop with Angular and Firebase. The beauty of the Angular Firebase stack is that it affords you a ton of flexibility, but at the same time, it helps you build things quickly and reliably. Whenever building something involving payments or ecommerce, I recommend leveraging a 3rd party API because building this from scratch is something that's hard to pull off for most businesses. Stripe payments, for example, gives you a ton of tools implement your own ecommerce solution, but there's a bunch of other alternatives that you should compare and contrast such as Square, Braintree, and a new one called Molten that I haven't actually tried, but it does look very interesting. What's really interesting is now that Angular Elements is on the horizon, it opens up the door to use Angular components and platforms like Shopify. So you could use the underlying platform for your ecommerce solution and then add interactivity on top of it with Angular Elements. I'm gonna go ahead and wrap things up here. If This video helped you, please like and subscribe, and don't forget to leave a comment for your chance to win a free t shirt or a gift card. Thanks again for your support, and I can't wait to see what the next one our videos will bring.
April
april
is
is
a
a
special
special
month
month
for
for
this
this
channel.
channel
It's
it's
the
the
1
1
year
year
anniversary
anniversary
of
of
the
the
first
first
video.
video
It's
it's
the
the
month
month
we
we
first
first
surpassed
surpassed
1,000,000
1,000,000
views,
views
and
and
it's
it's
also
also
the
the
month
month
that
that
I
i
got
got
to
to
meet
meet
a
a
lot
lot
of
of
people
people
in
in
person
person
that
that
I
i
know
know
from
from
this
this
project
project
at
at
NG
ng
Conf
conf
in
in
Salt
salt
Lake
lake
City.
city
This
this
video
video
marks
marks
episode
episode
100,
100
and
and
for
for
it
it
we're
we're
going
going
to
to
do
do
something
something
a
a
little
little
bit
bit
different
different
than
than
normal.
normal
I'm
i'm
going
going
to
to
spend
spend
some
some
time
time
answering
answering
questions
questions
that
that
you've
you've
asked
asked
on
on
Slack
slack
and
and
YouTube
youtube
that
that
wouldn't
wouldn't
normally
normally
fit
fit
into
into
this
this
channel's
channel's
content.
content
But
but
before
before
we
we
get
get
into
into
that,
that
I
i
just
just
wanted
wanted
to
to
say
say
thank
thank
you
you
to
to
everybody
everybody
who
who
supports
supports
this
this
channel
channel
either
either
with
with
a
a
pro
pro
membership
membership
or
or
just
just
by
by
simply
simply
liking
liking
and
and
watching
watching
the
the
videos.
videos
It's
it's
your
your
feedback
feedback
that
that
really
really
drives
drives
the
the
direction
direction
of
of
this
this
content
content
and
and
I'm
i'm
really
really
grateful
grateful
for
for
that.
that
To
to
show
show
my
my
appreciation,
appreciation
I'm
i'm
going
going
to
to
provide
provide
10
10
free
free
t
t
shirts
shirts
or
or
gift
gift
cards
cards
to
to
anybody
anybody
that
that
comments
comments
on
on
this
this
video
video
with
with
a
a
suggestion
suggestion
about
about
what
what
they
they
wanna
wanna
see
see
next.
next
Just
just
leave
leave
a
a
comment
comment
and
and
I
i
will
will
randomly
randomly
select
select
the
the
winners
winners
by
by
the
the
end
end
of
of
this
this
week.
week
Okay.
okay
So
so
now
now
let's
let's
jump
jump
into
into
question
question
number
number
1.
1
How
how
was
was
n
n
g
g
dot
dot
conf?
conf
I
i
have
have
been
been
to
to
quite
quite
a
a
few
few
tech
tech
conferences
conferences
in
in
the
the
past,
past
and
and
most
most
of
of
them
them
are
are
pretty
pretty
boring.
boring
But
but
I
i
have
have
to
to
say
say
n
n
g
g
dot
dot
conf
conf
stands
stands
out
out
as
as
being
being
extremely
extremely
well
well
organized
organized
and
and
engaging.
engaging
If
if
you
you
ever
ever
get
get
the
the
chance
chance
to
to
go,
go
it's
it's
well
well
worth
worth
the
the
investment.
investment
But
but
what
what
I
i
really
really
wanna
wanna
share
share
is
is
my
my
top
top
five
five
most
most
exciting
exciting
things
things
happening
happening
in
in
the
the
Angular
angular
world.
world
Number
number
1
1
by
by
far
far
for
for
me
me
is
is
Angular
angular
Elements.
elements
This
this
allows
allows
us
us
to
to
build
build
Angular
angular
components
components
and
and
use
use
them
them
as
as
custom
custom
elements
elements
in
in
HTML
html
without
without
bootstrapping
bootstrapping
an
an
entire
entire
Angular
angular
app.
app
This
this
opens
opens
up
up
an
an
entirely
entirely
new
new
paradigm
paradigm
Time
time
for
for
Angular
angular
development,
development
where
where
we
we
can
can
focus
focus
on
on
building
building
components
components
and
and
then
then
drop
drop
them
them
into
into
existing
existing
applications.
applications
For
for
example,
example
if
if
you
you
have
have
a
a
Ruby
ruby
on
on
Rails
rails
application,
application
you
you
can
can
build
build
an
an
Angular
angular
component,
component
provide
provide
a
a
script,
script
and
and
then
then
use
use
that
that
component
component
in
in
your
your
Rails
rails
app.
app
It's
it's
a
a
total
total
game
game
changer
changer
for
for
Angular
angular
developers.
developers
Number
number
2
2
is
is
the
the
new
new
Ivy
ivy
render
render
engine.
engine
The
the
first
first
thing
thing
it's
it's
going
going
to
to
do
do
is
is
dramatically
dramatically
reduce
reduce
bundle
bundle
sizes
sizes
with
with
advanced
advanced
tree
tree
shaking
shaking
techniques.
techniques
A
a
compressed
compressed
and
and
minified
minified
Hello
hello
World
world
app
app
is
is
only
only
2.7
2.7
kilobytes,
kilobytes
which
which
is
is
extremely
extremely
small.
small
But
but
if
if
that's
that's
not
not
enough,
enough
it's
it's
also
also
going
going
to
to
dramatically
dramatically
improve
improve
debugging
debugging
capabilities.
capabilities
If
if
you've
you've
ever
ever
seen
seen
the
the
expression
expression
has
has
changed
changed
after
after
it's
it's
been
been
checked
checked
error,
error
then
then
you
you
probably
probably
know
know
that
that
it's
it's
very
very
frustrating
frustrating
to
to
debug.
debug
But
but
Ivy
ivy
includes
includes
a
a
much
much
improved
improved
stack
stack
trace
trace
that
that
will
will
take
take
you
you
exactly
exactly
to
to
the
the
point
point
in
in
the
the
template
template
where
where
that
that
error
error
occurred.
occurred
So
so
very
very
much
much
looking
looking
forward
forward
to
to
Ivy
ivy
in
in
version
version
6.
6
I'm
i'm
also
also
looking
looking
forward
forward
to
to
RxJS
rxjs
version
version
6.
6
If
if
you're
you're
like
like
me,
me
your
your
components
components
probably
probably
have
have
20
20
different
different
lines
lines
dedicated
dedicated
to
to
RxJS
rxjs
imports,
imports
and
and
that's
that's
because
because
there's
there's
hundreds
hundreds
of
of
different
different
import
import
points
points
in
in
the
the
library.
library
But
but
in
in
version
version
6,
6
there
there
will
will
only
only
be
be
2
2
main
main
import
import
locations,
locations
which
which
will
will
dramatically
dramatically
reduce
reduce
the
the
number
number
of
of
lines
lines
of
of
code
code
it
it
takes
takes
to
to
use
use
Rx
rx
in
in
your
your
Angular
angular
project.
project
Now
now
moving
moving
on
on
to
to
number
number
4
4
is
is
the
the
new
new
Versus
versus
Code
code
live
live
share
share
mode,
mode
which
which
was
was
announced
announced
at
at
ng
ng
conf.
conf
This
this
feature
feature
allows
allows
multiple
multiple
for
for
people
people
to
to
collaborate
collaborate
on
on
a
a
document
document
in
in
real
real
time,
time
similar
similar
to
to
how
how
Google
google
Docs
docs
works.
works
This
this
means
means
that
that
you
you
can
can
pair
pair
program
program
remotely
remotely
on
on
a
a
shared
shared
document,
document
which
which
opens
opens
up
up
the
the
or
or
for
for
all
all
kinds
kinds
of
of
cool
cool
stuff
stuff
with
with
education
education
and
and
just
just
teamwork
teamwork
in
in
general.
general
The
the
last
last
thing
thing
I
i
wanna
wanna
show
show
you
you
is
is
a
a
new
new
feature
feature
from
from
Stackblitz
stackblitz
called
called
teleport.
teleport
It
it
will
will
show
show
you
you
real
real
time
time
changes
changes
happening
happening
to
to
your
your
app
app
across
across
all
all
devices.
devices
So
so
if
if
you're
you're
building
building
a
a
PWA
pwa
on
on
your
your
desktop
desktop
and
and
you
you
wanna
wanna
see
see
how
how
it
it
works
works
on
on
a
a
mobile
mobile
device,
device
You
you
can
can
do
do
that
that
using
using
teleport.
teleport
Stackblitz
stackblitz
will
will
give
give
you
you
a
a
URL
url
that
that
you
you
can
can
load
load
up
up
on
on
your
your
iPhone,
iphone
and
and
then
then
you
you
can
can
see
see
the
the
changes
changes
happening
happening
in
in
real
real
time
time
similar
similar
to
to
how
how
real
real
time
time
features
features
work
work
in
in
Firebase.
firebase
That
that
wraps
wraps
up
up
the
the
top
top
five
five
for
for
me,
me
but
but
make
make
sure
sure
to
to
watch
watch
all
all
the
the
talks
talks
on
on
YouTube
youtube
because
because
there
there
was
was
so
so
much
much
great
great
stuff
stuff
that
that
I
i
just
just
wasn't
wasn't
able
able
to
to
over
over
here.
here
I
i
want
want
to
to
switch
switch
gears
gears
to
to
a
a
question
question
I
i
get
get
asked
asked
frequently,
frequently
which
which
is
is
how
how
do
do
you
you
make
make
your
your
videos?
videos
The
the
first
first
thing
thing
I
i
do
do
is
is
I
i
write
write
a
a
bunch
bunch
of
of
code
code
on
on
my
my
Ubuntu
ubuntu
workspace
workspace
and
and
make
make
sure
sure
that
that
I
i
have
have
a
a
solid
solid
working
working
demo
demo
before
before
doing
doing
anything
anything
else.
else
From
from
there,
there
I
i
have
have
a
a
special
special
patented
patented
technique
technique
that
that
I
i
use
use
for
for
recording
recording
code
code
snippets.
snippets
What
what
I
i
do
do
is
is
I
i
delete
delete
things
things
in
in
reverse
reverse
order,
order
then
then
I
i
click
click
record
record
on
on
my
my
camera,
camera
and
and
then
then
hit
hit
control
control
z
z
or
or
undo
undo
to
to
rebuild
rebuild
the
the
function
function
step
step
by
by
step.
step
Once
once
I
i
have
have
those
those
recorded,
recorded
I
i
use
use
Adobe
adobe
Creative
creative
Cloud
cloud
to
to
produce
produce
the
the
video,
video
mostly
mostly
Adobe
adobe
Premiere,
premiere
but
but
also
also
Adobe
adobe
After
after
Effects
effects
for
for
certain
certain
animations.
animations
I
i
create
create
the
the
videos
videos
on
on
Windows,
windows
but
but
I
i
also
also
have
have
a
a
Mac,
mac
which
which
is
is
equally
equally
effective
effective
at
at
producing
producing
videos.
videos
The
the
next
next
question
question
I
i
want
want
to
to
address
address
is
is
what
what
is
is
a
a
Cordova
cordova
plugin,
plugin
which
which
was
was
asked
asked
by
by
Hayden
hayden
on
on
our
our
Slack
slack
channel.
channel
This
this
is
is
a
a
great
great
question
question
because
because
Cordova
cordova
plug
plug
ins
ins
basically
basically
feel
feel
like
like
a
a
black
black
box,
box
and
and
we
we
just
just
kind
kind
of
of
trust
trust
that
that
they're
they're
doing
doing
what
what
they're
they're
supposed
supposed
to
to
do.
do
The
the
underlying
underlying
problem
problem
that
that
Cordova
cordova
plug
plug
ins
ins
solve
solve
is
is
that
that
we
we
want
want
to
to
use
use
JavaScript
javascript
to
to
interact
interact
with
with
SDKs
sdks
that
that
only
only
understand
understand
Java,
java
active
active
c,
c
Swift,
swift
and
and
Kotlin.
kotlin
So
so
a
a
Cordova
cordova
plugin
plugin
can
can
be
be
thought
thought
of
of
as
as
a
a
bridge
bridge
that
that
allows
allows
us
us
to
to
use
use
a
a
JavaScript
javascript
interface
interface
to
to
write
write
code
code
that
that
normally
normally
only
only
runs
runs
in
in
these
these
other
other
languages
languages
that
that
native
native
mobile
mobile
apps
apps
understand.
understand
If
if
you
you
look
look
at
at
the
the
source
source
code
code
for
for
a
a
plugin,
plugin
You'll
you'll
see
see
that
that
its
its
code
code
base
base
is
is
normally
normally
split
split
between
between
JavaScript
javascript
and
and
then
then
Android
android
and
and
iOS
ios
code.
code
You'll
you'll
generally
generally
see
see
a
a
file
file
for
for
iOS,
ios
which
which
is
is
going
going
to
to
have
have
some
some
Objective
objective
C
c
Files.
files
Then
then
you'll
you'll
see
see
an
an
Android
android
folder,
folder
which
which
generally
generally
has
has
some
some
Java
java
files.
files
On
on
my
my
future
future
video
video
list,
list
I
i
have
have
building
building
a
a
capacitor
capacitor
plugin
plugin
from
from
Scratch,
scratch
which
which
is
is
very
very
similar
similar
to
to
Cordova,
cordova
but
but
that
that
video
video
is
is
probably
probably
still
still
a
a
couple
couple
months
months
off.
off
The
the
next
next
question
question
comes
comes
from
from
Raul
raul
on
on
YouTube.
youtube
I've
i've
never
never
used
used
a
a
state
state
management
management
library.
library
Should
should
I
i
learn
learn
ngrx
ngrx
or
or
NGXS?
ngxs
But
but
I
i
think
think
a
a
much
much
more
more
important
important
question
question
is,
is
do
do
I
i
need
need
a
a
state
state
management
management
library
library
at
at
all?
all
Because
because
both
both
libraries
libraries
will
will
add
add
additional
additional
overhead
overhead
and
and
complexity
complexity
to
to
your
your
application
application
in
in
an
an
effort
effort
to
to
make
make
complex
complex
state
state
more
more
predictable
predictable
and
and
easy
easy
to
to
test.
test
There's
there's
a
a
good
good
saying
saying
in
in
the
the
React
react
world
world
that
that
says,
says
you
you
don't
don't
need
need
Redux
redux
until
until
you
you
know
know
you
you
need
need
Redux.
redux
And
and
I
i
think
think
there's
there's
a
a
lot
lot
of
of
truth
truth
in
in
that.
that
I
i
have
have
a
a
quick
quick
start
start
lesson
lesson
for
for
both,
both
so
so
test
test
drive
drive
them
them
and
and
and
and
see
see
which
which
one
one
fits
fits
your
your
actual
actual
coding
coding
style
style
and
and
the
the
preferences
preferences
of
of
your
your
team.
team
The
the
final
final
question
question
comes
comes
from
from
Pierre
pierre
on
on
Slack,
slack
and
and
that's
that's
how
how
do
do
I
i
build
build
an
an
online
online
shop
shop
with
with
Angular
angular
and
and
Firebase.
firebase
The
the
beauty
beauty
of
of
the
the
Angular
angular
Firebase
firebase
stack
stack
is
is
that
that
it
it
affords
affords
you
you
a
a
ton
ton
of
of
flexibility,
flexibility
but
but
at
at
the
the
same
same
time,
time
it
it
helps
helps
you
you
build
build
things
things
quickly
quickly
and
and
reliably.
reliably
Whenever
whenever
building
building
something
something
involving
involving
payments
payments
or
or
ecommerce,
ecommerce
I
i
recommend
recommend
leveraging
leveraging
a
a
3rd
3rd
party
party
API
api
because
because
building
building
this
this
from
from
scratch
scratch
is
is
something
something
that's
that's
hard
hard
to
to
pull
pull
off
off
for
for
most
most
businesses.
businesses
Stripe
stripe
payments,
payments
for
for
example,
example
gives
gives
you
you
a
a
ton
ton
of
of
tools
tools
implement
implement
your
your
own
own
ecommerce
ecommerce
solution,
solution
but
but
there's
there's
a
a
bunch
bunch
of
of
other
other
alternatives
alternatives
that
that
you
you
should
should
compare
compare
and
and
contrast
contrast
such
such
as
as
Square,
square
Braintree,
braintree
and
and
a
a
new
new
one
one
called
called
Molten
molten
that
that
I
i
haven't
haven't
actually
actually
tried,
tried
but
but
it
it
does
does
look
look
very
very
interesting.
interesting
What's
what's
really
really
interesting
interesting
is
is
now
now
that
that
Angular
angular
Elements
elements
is
is
on
on
the
the
horizon,
horizon
it
it
opens
opens
up
up
the
the
door
door
to
to
use
use
Angular
angular
components
components
and
and
platforms
platforms
like
like
Shopify.
shopify
So
so
you
you
could
could
use
use
the
the
underlying
underlying
platform
platform
for
for
your
your
ecommerce
ecommerce
solution
solution
and
and
then
then
add
add
interactivity
interactivity
on
on
top
top
of
of
it
it
with
with
Angular
angular
Elements.
elements
I'm
i'm
gonna
gonna
go
go
ahead
ahead
and
and
wrap
wrap
things
things
up
up
here.
here
If
if
This
this
video
video
helped
helped
you,
you
please
please
like
like
and
and
subscribe,
subscribe
and
and
don't
don't
forget
forget
to
to
leave
leave
a
a
comment
comment
for
for
your
your
chance
chance
to
to
win
win
a
a
free
free
t
t
shirt
shirt
or
or
a
a
gift
gift
card.
card
Thanks
thanks
again
again
for
for
your
your
support,
support
and
and
I
i
can't
can't
wait
wait
to
to
see
see
what
what
the
the
next
next
one
one
our
our
videos
videos
will
will
bring.
bring
success
The success of YouTube and other channels is highlighted, includingENT and Cordova forENT, a new version of the app Versus Code live share mode, and a new plugin called Cordova for building websites and apps. The process for creating videos and creating a plugin for developers is discussed, along with the benefits of using Angular and Android platforms for ecommerce applications. Viewers are encouraged to like and subscribe to the channel and may receive a chance to win a free t-shirt or a gift card.
Episode 100 - NgConf and the Exciting Future of Angular
April is a special month for this channel. It's the 1 year anniversary of the first video. It's the month we first surpassed 1,000,000 views, and it's also the month that I got to meet a lot of people in person that I know from this project at NG Conf in Salt Lake City. This video marks episode 100, and for it we're going to do something a little bit different than normal. I'm going to spend some time answering questions that you've asked on Slack and YouTube that wouldn't normally fit into this channel's content. But before we get into that, I just wanted to say thank you to everybody who supports this channel either with a pro membership or just by simply liking and watching the videos. It's your feedback that really drives the direction of this content and I'm really grateful for that. To show my appreciation, I'm going to provide 10 free t shirts or gift cards to anybody that comments on this video with a suggestion about what they wanna see next. Just leave a comment and I will randomly select the winners by the end of this week. Okay. So now let's jump into question number 1. How was n g dot conf? I have been to quite a few tech conferences in the past, and most of them are pretty boring. But I have to say n g dot conf stands out as being extremely well organized and engaging. If you ever get the chance to go, it's well worth the investment. But what I really wanna share is my top five most exciting things happening in the Angular world. Number 1 by far for me is Angular Elements. This allows us to build Angular components and use them as custom elements in HTML without bootstrapping an entire Angular app. This opens up an entirely new paradigm Time for Angular development, where we can focus on building components and then drop them into existing applications. For example, if you have a Ruby on Rails application, you can build an Angular component, provide a script, and then use that component in your Rails app. It's a total game changer for Angular developers. Number 2 is the new Ivy render engine. The first thing it's going to do is dramatically reduce bundle sizes with advanced tree shaking techniques. A compressed and minified Hello World app is only 2.7 kilobytes, which is extremely small. But if that's not enough, it's also going to dramatically improve debugging capabilities. If you've ever seen the expression has changed after it's been checked error, then you probably know that it's very frustrating to debug. But Ivy includes a much improved stack trace that will take you exactly to the point in the template where that error occurred. So very much looking forward to Ivy in version 6. I'm also looking forward to RxJS version 6. If you're like me, your components probably have 20 different lines dedicated to RxJS imports, and that's because there's hundreds of different import points in the library. But in version 6, there will only be 2 main import locations, which will dramatically reduce the number of lines of code it takes to use Rx in your Angular project. Now moving on to number 4 is the new Versus Code live share mode, which was announced at ng conf. This feature allows multiple for people to collaborate on a document in real time, similar to how Google Docs works. This means that you can pair program remotely on a shared document, which opens up the or for all kinds of cool stuff with education and just teamwork in general. The last thing I wanna show you is a new feature from Stackblitz called teleport. It will show you real time changes happening to your app across all devices. So if you're building a PWA on your desktop and you wanna see how it works on a mobile device, You can do that using teleport. Stackblitz will give you a URL that you can load up on your iPhone, and then you can see the changes happening in real time similar to how real time features work in Firebase. That wraps up the top five for me, but make sure to watch all the talks on YouTube because there was so much great stuff that I just wasn't able to over here. I want to switch gears to a question I get asked frequently, which is how do you make your videos? The first thing I do is I write a bunch of code on my Ubuntu workspace and make sure that I have a solid working demo before doing anything else. From there, I have a special patented technique that I use for recording code snippets. What I do is I delete things in reverse order, then I click record on my camera, and then hit control z or undo to rebuild the function step by step. Once I have those recorded, I use Adobe Creative Cloud to produce the video, mostly Adobe Premiere, but also Adobe After Effects for certain animations. I create the videos on Windows, but I also have a Mac, which is equally effective at producing videos. The next question I want to address is what is a Cordova plugin, which was asked by Hayden on our Slack channel. This is a great question because Cordova plug ins basically feel like a black box, and we just kind of trust that they're doing what they're supposed to do. The underlying problem that Cordova plug ins solve is that we want to use JavaScript to interact with SDKs that only understand Java, active c, Swift, and Kotlin. So a Cordova plugin can be thought of as a bridge that allows us to use a JavaScript interface to write code that normally only runs in these other languages that native mobile apps understand. If you look at the source code for a plugin, You'll see that its code base is normally split between JavaScript and then Android and iOS code. You'll generally see a file for iOS, which is going to have some Objective C Files. Then you'll see an Android folder, which generally has some Java files. On my future video list, I have building a capacitor plugin from Scratch, which is very similar to Cordova, but that video is probably still a couple months off. The next question comes from Raul on YouTube. I've never used a state management library. Should I learn ngrx or NGXS? But I think a much more important question is, do I need a state management library at all? Because both libraries will add additional overhead and complexity to your application in an effort to make complex state more predictable and easy to test. There's a good saying in the React world that says, you don't need Redux until you know you need Redux. And I think there's a lot of truth in that. I have a quick start lesson for both, so test drive them and and see which one fits your actual coding style and the preferences of your team. The final question comes from Pierre on Slack, and that's how do I build an online shop with Angular and Firebase. The beauty of the Angular Firebase stack is that it affords you a ton of flexibility, but at the same time, it helps you build things quickly and reliably. Whenever building something involving payments or ecommerce, I recommend leveraging a 3rd party API because building this from scratch is something that's hard to pull off for most businesses. Stripe payments, for example, gives you a ton of tools implement your own ecommerce solution, but there's a bunch of other alternatives that you should compare and contrast such as Square, Braintree, and a new one called Molten that I haven't actually tried, but it does look very interesting. What's really interesting is now that Angular Elements is on the horizon, it opens up the door to use Angular components and platforms like Shopify. So you could use the underlying platform for your ecommerce solution and then add interactivity on top of it with Angular Elements. I'm gonna go ahead and wrap things up here. If This video helped you, please like and subscribe, and don't forget to leave a comment for your chance to win a free t shirt or a gift card. Thanks again for your support, and I can't wait to see what the next one our videos will bring.
The success of YouTube and other channels is highlighted, includingENT and Cordova forENT, a new version of the app Versus Code live share mode, and a new plugin called Cordova for building websites and apps. The process for creating videos and creating a plugin for developers is discussed, along with the benefits of using Angular and Android platforms for ecommerce applications. Viewers are encouraged to like and subscribe to the channel and may receive a chance to win a free t-shirt or a gift card.