Transcript from the "Introduction" Lesson
[00:00:50] And routing state management properly I have done more than 100 web apps for different devices like even restricted devices such as mobile phones. Even before the iPhone era, so really restricted phones and even smart TVs. And then I have started doing mobile apps as well, so I'm also a mobile developer.
[00:01:15] And I have authored a lot of books, you can see there with a lot of translations and a lot of workshops and courses. So even here frontend masters you will find several workshops and courses that I have developed. So I'm third on Twitter on many social networks on my website is further depth.
[00:01:58] And we will explain why we want that and when maybe because I'm not here to like being a really fan of vanilla JS for everything, but at least you will see that many times it's a good idea. So we're going to talk about the DOM API. So the DOM and the DOM API, sometimes it's where you're coming from libraries, such as React or Angular.
[00:02:23] And that's the only thing you know, the DOM API looks a little scary. The DOM API, the one I don't want to deal with that. Okay, we will deal with it, that will use the Fetch API. That's probably something that you know, because it's currently available unless you're doing only Angular, where you have HTTP services there that will help you.
[00:02:44] Probably if you're coming from react or view or other libraries, you probably have to deal with the Fetch API. We will see different design patterns am not here to advocate for one specific design pattern. So we will like mix and match different design patterns on the same web app that's typically not the case in the real world you pick like one design pattern or two.
[00:03:09] So but here we are going to mix a couple So you will get a sense of different ways that you have with Vanilla JS to do things. So we are going to create a single-page application from scratch. The only thing that is already there for you is HTML and CSS.
[00:04:29] So prerequisites on that url, firtman, that's my last name .github.io/vanila, okay? You will find step-by-step guideline if you wanna follow along. The workshop, also there you have the slides, a copy of the slides in case also you wanna follow along or you wanna download that for later. Later I will get into that URL and we will see where we are on each step.
[00:05:01] Also by the end of the day on that URL, you also have the final code working code, okay in case you wanna get it later, okay. Anyway, we are going to maybe 85% of the workshop will be live coding. The rest will be slides on some theory, really theory but explanations and discussions.
[00:05:24] For the coding part, I will be pushing updates on GitHub as well, in case you want to follow along. So questions, yes, please. For those of you here, go ahead. Just ask any question, even if you feel it's a very basic question, go ahead.
>> Manipulating the DOM all the time seems like not very productive, especially when building large apps.
[00:05:48] What's your opinion?
[00:06:11] And let's say that the simplest way to manipulate the DOM, it's probably not performant for large scale applications. That is like for those of you that already know what I'm talking about, it can be just like changing innerHTML. Things like that may not scale well, but we have to understand also that libraries and frameworks are not changing the browsers and shine.
[00:07:01] And they're adding design patterns to make that things better and you maybe for your case, one specific library is better. So I'm not here to tell you that you must use Vanilla JS for everything or you must manipulate in the DOM directly for every project. But after you understand at least where are the API's?
[00:07:30] What are the possibilities? So these you can make a decision, okay? I don't wanna reinvent the wheel in this case. So I'm going to use that library, which is fine. But the problem is that when you make a decision without the knowledge, you just use the library because that's the only thing you know okay, so that's my take at this point.
[00:07:48] Okay, but I've done web apps, as I mentioned before, that are fairly large maybe in terms of screens, let's say let's measure this in different kinds of screens. It was like a game. In terms of a screen, it was I think around 80 different screens with forms and drag and drop and everything.
[00:08:13] That was an app with 10 million users and it was working fine. Didn't have any issues in terms of scalability and yeah, at one point you may think that I have created my own framework and yeah, maybe that's the case. Okay, maybe I created like a custom framework for that specific project.
[00:08:34] Yeah that may be the case for some situations okay? That's my take for now.