[0:02] hey I was going everybody
[0:05] I guess I'll start the scream off by
[0:07] saying thank you because we had just
[0:09] recently passed 50,000 subscribers and
[0:12] I'm super grateful for that and that's
[0:15] actually one of the main reasons that I
[0:17] wanted to do this stream because I have
[0:23] a bunch of stuff to give away so we
[0:26] let's see here we'll start oops I'm
[0:31] sorry can you guys hear me alright okay
[0:46] okay yeah sorry about that interruption
[0:48] always having some audio issues again
[0:51] yeah basically we have a couple
[0:54] giveaways in this video so that at the
[0:56] end of the video we'll give away the
[0:58] free one of a kind t-shirt that we that
[1:01] I showed you in the last video it's a as
[1:02] the JavaScript logo and then I also have
[1:07] a giveaway to everybody on this stream
[1:09] and that was that's gonna be done with a
[1:12] angular firebase app that I actually
[1:14] just put together last night and so
[1:17] hopefully that everything goes okay
[1:19] there um but before we really get into
[1:23] that I just wanted to give you a couple
[1:25] updates on the things that I'm working
[1:26] on currently and so for this week later
[1:30] this week we'll have a tensorflow J s
[1:32] video which should definitely be really
[1:34] cool and that should be out maybe
[1:35] tomorrow or Wednesday at the latest and
[1:38] then also working on a extension to the
[1:42] ionic course if you remember we did a
[1:45] poll about a couple weeks ago when the
[1:48] ionic course first came out and the top
[1:50] votes were for a chat feature and for a
[1:54] file uploading system with the camera so
[1:57] I think we're gonna try and not bolt
[1:58] those out in a single feature and do a
[2:00] chat real-time chat with file uploads
[2:03] and possibly even geolocation features
[2:06] in the future as well and I'd say about
[2:09] that's probably roughly two weeks out
[2:11] from being added to the existing course
[2:16] so those are the main things that I'm
[2:18] working on currently I'm also making
[2:20] quite a bit of progress on the fire ship
[2:22] IL project for pro members I'll probably
[2:25] have like an early preview out on that
[2:26] in about a month and some more details
[2:29] all kind of some more details out about
[2:33] that here in the next few weeks but for
[2:37] now I'm gonna go ahead and screen share
[2:39] and I'll show you what I'm giving away
[2:41] to everybody on the stream currently
[2:43] well hopefully it depends on how many
[2:45] people get on this stream but we'll see
[2:47] so I'm gonna switch over to a screen
[2:51] share get real quick and so this is what
[2:59] we're giving away and it's a it's a
[3:02] die-cut sticker like a pretty good size
[3:03] good size for your laptop um and it's a
[3:08] real-time app so there's like 199 of
[3:10] these remaining I ordered that 200 of
[3:12] them and I'm gonna take one for myself
[3:15] and basically what you do is when you
[3:18] get on this app you can log in with
[3:20] Google and then there's a little form
[3:22] for you to fill out here which will just
[3:24] take your address they'll make sure that
[3:26] looks correct and then once you're
[3:29] confirmed it's going to save your
[3:30] address and Fire store and I'll be able
[3:33] to export all these all together so I
[3:34] can format address shipping labels for
[3:36] everybody and so it is kind of a
[3:39] time-sensitive thing if you're on this
[3:41] stream now there's about a hundred and
[3:43] 680 people on now to everybody right now
[3:46] it's got a chance to get one of these
[3:48] stickers and I just put the link there
[3:53] hopefully that old yeah hopefully I'll
[3:58] give everybody on the stream a chance to
[3:59] to grab one of these but if you're a pro
[4:02] member and you miss out on one of these
[4:03] I've also added a link to the pro
[4:05] dashboard and if you go on to Angela
[4:08] firebase.com on the dashboard you'll see
[4:11] a link under the pro extras for a Google
[4:13] Form and you can fill one out there and
[4:15] that will also get you a sticker shipped
[4:18] out in this in this order and
[4:24] so I'll give everybody a few minutes to
[4:27] fill this out and there's actually a few
[4:29] things with this app that I want to show
[4:31] you because there's some interesting
[4:32] patterns that that you want to know if
[4:36] you're building an app like this because
[4:37] it's kind of interesting you can see
[4:38] here we're already at 172 and all of
[4:42] these addresses are being added to the
[4:44] firestore database in real time that
[4:46] we're looking at here which is pretty
[4:47] cool so yeah hopefully everything goes
[4:53] well but I mean it looks like firebase
[4:55] is handling this you know spike in
[4:56] traffic seamlessly at least on my end
[4:59] but if you are if you do run into any
[5:02] problems with the app let me know
[5:03] because I'm kind of curious to see how
[5:04] all that works out let's see here so I'm
[5:09] gonna now switch over to vs code and
[5:15] this is pretty much just a vanilla
[5:16] angular app with with firebase installed
[5:20] everything is in red here because I
[5:21] don't have the NPM packages installed so
[5:24] you can kind of ignore that but well
[5:28] everybody's filling that out I wanted to
[5:30] show what I think is one of the more
[5:32] important patterns that you'll see in an
[5:34] angular firebase app because a lot of
[5:37] times what happens is you have a user
[5:39] authenticated and then you have some
[5:41] additional information about that user
[5:43] that's based on their user ID so in this
[5:46] example when you login with Google it's
[5:48] going to create a user ID then we save a
[5:50] document and fire store with your
[5:52] address and that document is your user
[5:54] ID so you can only save you know request
[5:56] one sticker per per user let's see yeah
[6:03] and it looks like these are go pretty
[6:04] quick there's actually over 200 people
[6:06] on the screen now so if you don't happen
[6:08] to get one on this video I'm probably
[6:10] gonna do this again very soon and then
[6:13] like I said if you're a pro member
[6:15] you'll get one anyway so yeah last time
[6:19] we only had about a hundred a little
[6:20] over a hundred people on the stream so
[6:21] it's a little more than I expected
[6:25] let's see here
[6:28] okay so getting back to that pattern
[6:31] after when I want a user and with
[6:32] firebase using angular fire two I'm
[6:34] gonna have that user available as an
[6:36] observable which I'm working
[6:38] here and then to get their information
[6:42] from the database we can do something
[6:44] like this where we take that user and
[6:46] pipe in the switch map operator and when
[6:50] you do a switch map you're switching to
[6:51] a new you're taking one observable and
[6:53] then switching to a new observable so in
[6:57] this case we can also get a document in
[7:00] fire store that has an observable which
[7:02] we can do by calling collection stickers
[7:05] with the documents user ID and then
[7:07] value changes so if you have a component
[7:11] like like in a real world app you're
[7:13] normally gonna have an authentication
[7:15] service you can inject that service in a
[7:17] component that maybe shows this
[7:19] confirmed confirmed record from the
[7:20] database and then you just switch map to
[7:23] the observable and you'll have a
[7:25] reactive component that you know always
[7:28] stays up-to-date in real time so that's
[7:32] just something to one pattern that
[7:35] you'll find very useful as you're doing
[7:37] angularfire
[7:38] firebase development and let's see here
[7:44] so there's some more code going on here
[7:49] it's pretty a pretty straightforward
[7:52] stuff we just have a reactive form set
[7:54] up and then a couple of button the event
[7:56] handlers to log in and log out and the
[8:01] more there's one more pattern that I
[8:02] want to show you in the HTML and one
[8:05] thing that I really like to do is use
[8:07] the ng-if directive and then you take
[8:10] your observable and pipe in the async or
[8:14] use the async pipe and then you set it
[8:17] as a template variable so like you can
[8:20] see right here we're doing this on the
[8:21] main main element in this component so
[8:25] when we do that we'll have this count
[8:27] observable available throughout the HTML
[8:30] so now we can set up like additional
[8:32] energy of statements that says this says
[8:35] if the count is less than 200 then we'll
[8:37] show the sticker form but once the count
[8:40] goes above 200 that means we're all sold
[8:42] out of stickers and we'll show a
[8:44] different template to the user so like
[8:50] going
[8:51] back to our component type script that
[8:52] means we never have to actually
[8:53] subscribe to anything it all just just
[8:57] works in the HTML and a huge benefit of
[9:00] doing that is that the async pipe will
[9:02] automatically unsubscribe from the
[9:03] server rules when the components
[9:05] destroyed so you never have to worry
[9:07] about memory leaks or anything like that
[9:09] and you can also improve performance
[9:12] because if you only use the async pipe
[9:14] and observables for your presentational
[9:16] data you can turn off angular's change
[9:18] detection but it will still update the
[9:21] changes in the component because the
[9:24] async pipe knows what to do basically
[9:27] and what it actually does under the hood
[9:30] is it marks your data for change
[9:32] detection so it will run on each new
[9:34] cycle of change detection so those are
[9:40] just a couple of cool patterns that I
[9:42] found you know working with angular
[9:45] firebase apps let's see I'm gonna go
[9:50] check on the chat and see everything's
[9:53] going for everybody oh are you guys okay
[10:04] looks like some are you getting audio
[10:05] but some somewhere okay yeah I'm gonna
[10:18] go ahead and yeah pasted in that's blank
[10:21] here that's how you get the sticker so
[10:27] okay cool looks like audio is fine so
[10:29] sorry about that and yeah and looks like
[10:34] fire source handling all this data might
[10:36] you know as far as my on my interior
[10:39] looks like everything is working as
[10:42] planned so that's cool and yeah I think
[10:48] I don't really have any other tips like
[10:51] as far as that code goes I was going to
[10:53] put together some additional JavaScript
[10:55] tips but I kind of just ran out of time
[10:57] before this stream so there is one more
[11:01] thing to give away and for this one it's
[11:03] going to pool
[11:05] the comments from last week's video
[11:06] which is the JavaScript pro tips code
[11:08] this not that so if you so if you
[11:15] haven't I'm sorry I'm just reading the
[11:22] comments here I'll try and jump back
[11:23] here and answer some of these questions
[11:25] towards the end but for now we'll go
[11:28] ahead and pick the t-shirt winner from
[11:30] that from that video all right so
[11:36] there's going to be about a five-second
[11:37] delay here and then whoever's name pops
[11:40] up here from the comments you win that
[11:42] shirt all right so Navin II I'm not
[11:52] gonna say the name right but you were at
[11:54] index 74 of a hundred and fifty comments
[11:58] there this is a lucky comment and yeah
[12:01] you're right it was lucky so
[12:05] congratulations and if you're on our
[12:07] slack channel the best way to redeem the
[12:10] shirt is to message me on slack
[12:11] otherwise I will post a comment on your
[12:15] original comment and you can send me an
[12:16] email directly okay yeah someone asked
[12:21] any advice on how to get involved on
[12:23] machine learning Kevin Rodriguez and the
[12:28] I think in my opinion the best way to
[12:29] learn start learning machine learning is
[12:32] to compete in data science competitions
[12:34] on Kaggle if you go to casual comm it's
[12:39] a it's good website where companies can
[12:43] put up money to crowdsource their data
[12:45] science needs um but you as someone who
[12:50] is learning data science can go on the
[12:53] side and like actually see what it's
[12:55] like to work with real-world data and I
[12:58] used to be really into this and like
[13:00] achieved a fairly high rank in the
[13:02] overall community but I haven't had a
[13:04] whole lot of time to do data science
[13:05] competitions recently um but it's pretty
[13:10] cool and if you get good at this you
[13:11] know the prices go up to a hundred
[13:13] thousand dollars or even you know above
[13:15] a million dollars in some cases
[13:20] see here I'm just gonna jump to the
[13:22] comments and see if I can grab something
[13:24] out of here so Kyle asks can you tell us
[13:29] the difference between angular firebase
[13:31] and fire there's a couple reasons
[13:35] that I wanted to kind of rebrand
[13:37] everything because the name angular
[13:39] firebase is not well like I said at the
[13:42] beginning of the video that I originally
[13:44] started this project with just like
[13:47] really only expecting to do a few videos
[13:48] and using the name angular firebase sort
[13:53] of ties me to those two technologies and
[13:55] it also sort of kind of like infringes
[13:57] on their turf a little bit and so I just
[14:00] want something that's my own brand that
[14:01] I can you know do for the long term and
[14:05] then as far as features go and really
[14:07] like trying to work hard to make the
[14:10] content experience as optimized as
[14:13] possible for kind of the intermediate to
[14:15] advanced developer who's actually
[14:17] building a software product so I'll
[14:20] provide some more details about that in
[14:22] the future but a lot of it centered
[14:24] around you know keeping content
[14:26] up-to-date and keeping things really as
[14:29] efficient and user-friendly as possible
[14:34] and let's see okay axe last in the
[14:39] videos we always write code like if
[14:41] you're oppressing control Z how do you
[14:43] do that and that's exactly how I do it
[14:45] is by pressing control Z I just delete
[14:49] everything in Reverse and then do
[14:52] control Z I've explained that in a in
[14:54] episode 100 I think so if you yeah
[14:58] episode 100 if you check that out you'll
[14:59] be able to see exactly how I do it and
[15:02] there
[15:13] hmm okay it's cool so if anyone's just
[15:18] like jumping on right now the giveaway
[15:21] link is right here in the chat go on
[15:25] their register your address and then I'm
[15:27] going to export all of these and mail
[15:30] them out and let's say give us give us
[15:35] your PC spec so actually the PC I'm
[15:38] using I built myself it's got an Intel
[15:43] i7 processor it's a couple years old now
[15:47] so I'm actually thinking about building
[15:49] another PC and I'll probably do that in
[15:52] near future
[15:52] especially now because the new NVIDIA
[15:55] GPUs just came out recently so I'll
[15:57] probably just build a new computer from
[15:59] scratch and with the new with the new
[16:02] GPU and this one has a GTX 1080 which is
[16:05] a pretty popular one which is now the
[16:07] previous generation and see me at any
[16:13] conference soon yes well yes no so I
[16:17] have a newborn which is made it pretty
[16:20] difficult to travel and there's a GD
[16:22] Google developer expert summit that's
[16:25] coming up here in November that'll be at
[16:28] which will be in the Bay Area so if
[16:31] you're if you're around the Bay Area we
[16:32] could grab a beer or something and then
[16:36] traveling to big conferences I'll
[16:38] probably have to put off until probably
[16:40] until next year just because it's yeah
[16:42] it's tough to travel with the baby and
[16:47] let's see why don't you start doing a
[16:48] bunch of flutter tutorials that's a good
[16:51] question I I've thought about doing
[16:53] flutter flutter tutorials and I've done
[16:57] quite a bit of messing around with water
[16:58] but still I don't know I still wouldn't
[17:00] call myself an expert at building mobile
[17:03] apps with water but that's definitely
[17:06] something on my mind that I might do in
[17:08] the future because it's relatively easy
[17:10] to jump to especially if you know
[17:11] typescript like darts a pretty intuitive
[17:13] programming language that has really
[17:15] good tooling and everything
[17:16] [Music]
[17:21] and we'll see give me one second here
[17:24] I'm going to switch over it looks like
[17:25] yeah there's 30 31 stickers remaining so
[17:28] yeah make sure to get your address in
[17:30] there
[17:59] all right so I'm probably gonna go ahead
[18:04] and wrap up the livestream pretty soon
[18:06] here and I'm gonna try and do these live
[18:10] streams maybe hopefully once a week but
[18:13] maybe every two weeks or so and I'll try
[18:17] and like collect questions beforehand
[18:19] just so we can be a little more prepared
[18:20] I mostly just wanted to do the giveaway
[18:22] in this video so if we went everybody
[18:24] could grab that and then we have our
[18:26] winner here for the t-shirt so make sure
[18:28] that I get in touch with me yeah I need
[18:38] okay so sir off says I need your
[18:41] autograph when I send out these stickers
[18:42] I'm also going to send out a little
[18:43] business card and I'm gonna do either an
[18:46] autograph where a little note for each
[18:47] one of them as well so just FYI I'm
[18:52] doing that on top of just the sticker
[18:56] are you self-employed or do you work
[18:59] from a company and do this on the side
[19:00] and so I'm self-employed I've actually
[19:03] been doing web development consulting
[19:05] for over five years independently now
[19:08] and since I started this last year it's
[19:11] slowly become like the main priority of
[19:14] what I work on I still have a couple of
[19:16] consulting clients but primarily I want
[19:19] to focus on building the fire ship
[19:22] product which will be sort of the
[19:23] successor to angular firebase and really
[19:26] just trying to make the best possible
[19:28] developer education and consulting
[19:31] content that exists in the world that's
[19:33] really my mission more than anything
[19:43] do i do podcast work no not really I've
[19:45] been on a couple of podcasts but yeah
[19:50] I'm definitely open to it if you have a
[19:51] podcast feel free to invite me and I'll
[19:52] you know I'll try and make it on
[20:00] alright cool well again thanks everybody
[20:03] and thanks for 50 thousand subscribers
[20:05] like I said we'll do this again here in
[20:07] the near future and then I'll leave that
[20:10] 16 Romanian stickers open so if you're
[20:13] coming in after the live stream is over
[20:15] there's still a small chance to get one
[20:17] and again if you're a pro member you can
[20:18] grab one from the pro dashboard alright
[20:22] well thanks a lot everybody and I'll see
[20:24] you soon
[20:28] [Music]
[20:35] [Music]