Introduction

[00:00:00]
>> Welcome everyone to the Complete Intro to Vue 3. My name is Ben Hong. And I'm excited to spend the next couple days with you as we go over the fundamentals of Vue and just get you all set up so that you feel confident trying out Vue for your next project.

[00:00:14]
All right, so as far as a little bit of a welcome, little fun fact I usually like to use is I'm a big fan of amusement park rides. So this is the one from Orlando Universal Studios. And so the one I really want to get up though is if you ever go to Disneyland, check out because this is the classic Jurassic Park one, they've re done the one in Disneyland to be the Jurassic World theme.

[00:00:34]
And so they've done a lot of really cool 3D, 3D effects and stuff highly highly recommend it. If you're having trouble finding me in the back, there I am raising my arms up there. But with that aside, a little bit about me. I'm a Senior Staff Developer Experience Engineer at Netlify, Vue.js Core Team Member, Nuxt Ambassador, Vue Mastery Instructor and I'm a Google Developer Expert in web technologies as well as my platform.

[00:01:01]
All right, so if you're wondering who this workshop is for. This workshop because this is a complete intro to Vue covers people looking to get started with their first JavaScript framework for basically building web user interfaces. All the way to people who are looking to either learn about what makes Vue special and really gain the skills necessary so that if they wanna try using Vue on their next project, they are certainly more than welcome to.

[00:01:23]
And of course, everyone in between. So let's say we have a good gamut here of different experiences. And so yeah, hope to cover all that in this workshop today. All right, so a couple things to know about this workshop. Some things you probably wanna know if you're watching this, and as far as, we'll call it prerequisites, is basically if you have some familiarity with HTML, CSS, and JavaScript.

[00:01:45]
So in other words, you don't need to be an expert in any of these fields. I designed it so that as long as you have the fundamentals for each of these, you'll be set to go. Familiarity with the code editor is also super helpful as we'll be doing a lot of coding in this workshop.

[00:01:59]
Because after all, while there's a lot of theoretical things to talk about, I want to get your hands on experience working with Vue to see how it feels when you're taking it for a test run. The code editor I'll be using is VS code. And I recommend that one because the VS the extensions that we'll be using also are in VS code by default.

[00:02:14]
And so, if you can't follow along with that, that'd be great. But otherwise no worries if you wanna use whatever code editor that you prefer. We'll also be doing a little bit with the terminal as well because as most of you know, when it comes to frameworks build tools are a pretty big thing.

[00:02:28]
So as you have some familiarity with running some basic commands, that'll be useful as well. In addition, we'll be also using browser dev tools. So I'll be using Chrome in this instance. But whether it's Firefox or whatever your preferred browser of choice is, basically we'll be inside of there inspecting stuff and looking at how everything's working.

[00:02:44]
And finally, basic knowledge of git and npm would be great as well because all of the resources are gonna be basically encapsulated in the repo that I have. And then we'll be installing the dependencies with npm, so just as long as you've had some basic exposure to that, you should be good to go for this workshop.

[00:03:00]
All right, and so the promised resource it's everything is going to be living at this repo which is github.com/bencodezen, and then /complete-intro-to-vue-3-workshop. So if you just go to /bencodezen and repos, you should see it at the very top. And if it looks a little barren in there, don't worry we're gonna be populating it as we go throughout the workshop.

[00:03:19]
All right, as far as what you can expect from the workshop. I'm a big fan of the workshop format of learn, question and apply. So basically we'll be going through the process of starting with the learn step, which is every time we have a new concept, we'll be going through explanations and examples so you can start getting exposed to what's going on.

[00:03:38]
Then there'll always be opportunities to ask questions, so if any clarifications, what ifs, that's a great time to kind of get in there to start engaging with the material. And finally, arguably the most important step in my mind is that we go ahead and apply what we just learned.

[00:03:50]
So there'll be lots of opportunity to do exercises, and most importantly I encourage you to play and experiment with it. I'll provide some guidance regarding some things you can do with the exercis, but the more you kinda get into it, and play around with it, the stickier it'll be for you when it comes to learning it.

[00:04:06]
And finally, even though we're here talking about Vue, an important thing to remember is that all code is compromised. So earlier we heard from people coming from different frameworks, different frameworks have made different choices and trade offs along the way as their author sort of created those things.

[00:04:20]
So just know that whatever my opinion is, I encourage you to question and or disagree with it. Because after all your opinion and experience matters. At the end of the day, the most important thing is that you choose what's best for you and your team in order to serve your customers.