Vue JS 3 Tutorial for Beginners #2 - Vue.js Basics (part 1)

Рет қаралды 434,020

Күн бұрын

Hey gang, in this Vue 3 tutorial you'll learn how to quickly setup Vue.js in a web application (using the CDN) and use it to implement some basic functionality such as using data properties & reacting to click events.
---Timestamps---
0:00 - How to use Vue (CDN)
3:36 - Creating a Vue app
8:58 - Data & templates
13:34 - Click events
21:37 - Conditional Rendering
🐱‍💻 🐱‍💻 BUY THE FULL 20-hr COURSE ON UDEMY:
www.thenetninja.co.uk/udemy/v...
🐱‍💻 🐱‍💻 Course Files:
+ github.com/iamshaunjp/Vue-3-F...
🐱‍👤🐱‍👤 JOIN THE GANG -
/ @netninja
🐱‍💻 🐱‍💻 My Udemy Courses:
+ Modern JavaScript - www.thenetninja.co.uk/udemy/m...
+ Vue JS & Firebase - www.thenetninja.co.uk/udemy/v...
+ D3.js & Firebase - www.thenetninja.co.uk/udemy/d...
🐱‍💻 🐱‍💻 Helpful Links:
+ HTML & CSS Course - • HTML & CSS Crash Cours...
+ Get VS Code - code.visualstudio.com/
🐱‍💻 🐱‍💻 Social Links:
Facebook - / thenetninjauk
Twitter - / thenetninjauk
Instagram - / thenetninja

Пікірлер: 234

@marsdwarf 10 ай бұрын

For those that just started: This is hands down the best introduction video to Vue 3, and Shaun takes his time to explain what's happening what's happening when Vue is mounted. Thanks Shaun!

@astrosoup 3 жыл бұрын

Thank you so much. I've been struggling with Vue 3 as my first .js framework this past week. You made this at just the right time! Very well thought out and clearly explained.

@redspecial7 3 жыл бұрын

This is definitely the most clear and simple introduction of Vue that I found so far! Very well explained

@romko-romario 3 жыл бұрын

Just awesome tutorials, my respect to the author! Nothing unnecessary - just an informative and concise output that is perfectly understandable for everybody with basic knowledge of JavaScript and HTML. It's definitely the best thing on KZfaq about Vue 3. Glad to start learning with it!

@herol3oy 3 жыл бұрын

I think one of the core powers of your videos is `simplicity` ☁️💆☁️

@NetNinja 3 жыл бұрын

Thank you! I try to make things as simple as possible.

@FullMe7alJacke7 3 жыл бұрын

It's a lot of things I think, nice voice, good video structure, in depth, but easy to understand explanations and he does it all with you step by step. Overall good teacher.

@rabbitazteca23 3 жыл бұрын

You're the only Vue tutorial guy I've watched that explains view in a not-too-fast and not-too-slow way. Your explanations are clear too. I've never tried Vue so my first impression is that .... it's really intuitive especially when it comes to being able to manipulate things based in user response like clicking, etc... Maybe I'll learn this framework soon

@jovantancevski7629 9 ай бұрын

As of min 28, for everyone coming from React, instead of showing 2 spans which is more costly , i tried this and it worked {{showBooks ? 'Hide' : 'Show'}} Books This way we only change the content inside of the span rather than changing the whole span element with a new element

@armanzanjani5626 3 жыл бұрын

YES YES YES Epic Return of the Ninja!

@JannisAdmek 2 жыл бұрын

The way this tutorial is structured is way better than if you had started with a full vue project setup! Very nice video :)

@tsol438 2 жыл бұрын

I was about to give up on vue but you made it seem a lot simpler than the tutorials I've followed. Thank you!

@swoorp 2 жыл бұрын

I got back to coding after a few months and this voice made me boot up again. Loved it, an amazing refresher

@enduranceochonogor6291 3 жыл бұрын

One of the best around. No jokes.

@leoalvian7653 3 жыл бұрын

Thank you The Net Ninja you explain things very clearly and your video helped me a lot with my projects and also I've been waiting for this new Vue js 3 video

@ahsan_0007 10 ай бұрын

Hands down to Shaun for explaining it in such an easy and in-depth. This is by far the best Vue course on youtube

@NetNinja 10 ай бұрын

Legend! Thanks Ahsan :) that means a lot

@andryr.8221 3 ай бұрын

I've tried learning Vue by reading through documentations and tutorials, I tried crash courses, but I must say, so far this is the best introductory resource I've found, hands down. I'm nearly 26 minutes into the video and I had to replay on several occasions because I was too busy playing around with the new tools you were teaching, because guess what? Everything was crystal clear, so much so that I could afford to comfortably experiment with, well, everything. So yeah, great video, thank you for having made it.

@muslehhaj4164 2 жыл бұрын

You are #1 ❤ Very easy & going into single deep details , thanks a lot for this tutorial

@fethiourghi 3 жыл бұрын

Among the best tutorials of vue 3 !

@maskman4821 3 жыл бұрын

I love this tutorial, simple but to the points !!!

@VeronikaCullen 3 жыл бұрын

Yeah! Finally perfect tutorial! You are great! Thanks!

@fragrantbloom Жыл бұрын

This video explained the concepts so well! Thank you!

@MartinMarchev 3 жыл бұрын

You have real talent for teaching! Thanks for the great tutorial!

@iamnomana 2 жыл бұрын

It's been over a year since I last built a project in VueJS. But, due to other reasons I'm back to VueJS. Thank you "The Net Ninja" for providing this awesome tutorial for us to be able to relearn or reacquaint with VueJS.❤😉

@donl.a.6045 3 жыл бұрын

literally because of this.. I now work as a vuejs dev. thank you so much!

@mareanorton3448 2 жыл бұрын

Fantastic tutorial. Best I have tried to follow as a beginner to Vue 3. Thank you.

@temidayooladele9856 3 жыл бұрын

This came in handy, Net Ninja you are helping us out a lot over here with your awesome content... With love from Nigeria NG🇳🇬

@dalemoayokunle7330 2 жыл бұрын

@chidoziejohn9368 Ай бұрын

Na so my broda

@lennartwiedemeier2721 8 ай бұрын

I am loving your tutorial so far. I've already learned more than in my webtechnology class!

@NetNinja 8 ай бұрын

Glad you enjoy it! :)

@user-ku3lm6ib1v Жыл бұрын

love the book titles you choose as examples!

@doingsneakypeakylike 11 ай бұрын

Hi Shaun! I have learned a lot from you over the years. Thanks a lot for all of this. you're the best! :)

@NetNinja 11 ай бұрын

Happy to hear that! :) thanks for your support

@0xiah Жыл бұрын

I've been using KZfaq to learn various skills for 10+ years and I have to say, you are easily the best teacher I've come across. Your lesson structure and the focus on understanding the concepts rather than blurting out a series of instructions make the information super easy to absorb. Awesome. Thank you. ❤️

@ChapterCircle 3 жыл бұрын

I love this channel! I learned node js and now vue 3

@fireemblem2770 Жыл бұрын

I do not even know Javascript but you made this beginner tutorial on a JS framework so easy even I could understand it, follow along, and overall have a good time. Subscribed. I look forward to having you and your content on my web development journey!!

@NetNinja Жыл бұрын

Awesome to hear :) welcome aboard and have fun on your journey!

@gurudaki 2 жыл бұрын

Excellent explanation!!!By far the most comprehensive compared to many other Tutorials!

@NetNinja 2 жыл бұрын

Thanks Stavros. Glad it was helpful!

@upl1nk.v01d2 Жыл бұрын

this is a very simple vue tutorial that absolutely everything to me was easy to understand! thank you!!

@jondyason336 3 жыл бұрын

thank you Net Ninja. I have learned a lot. You explain things well. Give good context. Explain in terms where you link what people already know to the new content, rather than just being technical.

@1232gus 3 жыл бұрын

Easy to follow , keep up the good work

@fredpourlesintimes 2 жыл бұрын

I learnt so much about Javascript and NodeJS with you, that I decided that it was the time to start learning VueJS to get something cleaner than a totally handcrafted project.

@tejasc400 3 жыл бұрын

This's gonna be the world's most popular vue series ♥️

@krishnabhat2214 3 жыл бұрын

Brandon Sanderson is awesome! Thanks for associating this tutorial with him, you exponential increased my interest

@nigelpallatt 3 жыл бұрын

Absolutly fantastic! I only with I learnt this much earler!

@sengkeanky3696 2 жыл бұрын

Amazing your tutorial is very easy to follow. Thank you so much.

@celebrityconner6 Ай бұрын

watched a bit of these vids and started building a POC coz of deadline. POC approved and now Im back to understand what I built 😂. Thanks guys

@fatamajannat3457 3 жыл бұрын

It's amazing learning with you

@njorogekangethu9054 2 жыл бұрын

Great stuff. Thank you for this

@ahoymatey1234 Жыл бұрын

Another excellent tutorial series from Net Ninja!

@NetNinja Жыл бұрын

Thanks Andrew! :)

@takuyayzu Жыл бұрын

came here for Vue tutorial, was not expected to see Brandon Sanderson mentioned in this video. I'm really glad to find another fellow fan in the wild here!

@mehtabahmed6092 2 жыл бұрын

Thak you so much, always learning new stuff from you

@chrisw5509 2 жыл бұрын

A top notch video. I've just started with Vue 3. Hands down, this video is one of the best! I can only say "ditto" to all the positive comments below.

@firasbahri9989 3 жыл бұрын

the best Vue tutos

@SiddhantDalvi3 3 жыл бұрын

I love ur tutorials

@AndrewOBannon 3 жыл бұрын

Best explanation ever.

@betofc89 Жыл бұрын

Thank you so much for this tutorial! I will do the rest of them, and I am already considering paying for the course! Thank you so much!

@NetNinja Жыл бұрын

You are so welcome! :) glad it was helpful

@papajohnsuk5965 3 жыл бұрын

i love vue now, at least for what I'm doing it makes much more sense than react. Thanks

@felipemelendez5741 2 жыл бұрын

Brilliant, thank you!!!

@haustimp 4 ай бұрын

This was really great - thank you!

@NetNinja 4 ай бұрын

Glad it was helpful!

@jaxparrow1794 3 жыл бұрын

Perfect tutorial, bro!

@itsdazing1279 3 жыл бұрын

Thanks for this tutorial 😊

@alnazrereal3058 5 ай бұрын

You always make total sense

@xpdrfreeze 2 жыл бұрын

You do an excellent job of explaining the how to code in vue!

@efbYouTube Ай бұрын

excellent vid!!! TY!

@ravendfj 3 жыл бұрын

Just great! Thanks!

@Eldalion99999 3 жыл бұрын

omg I love this so much

@naucnik1977 Ай бұрын

As a profesor and developer i have tip, put side by side editors with html and js code, students will easy follow the course. If you decrees left file panel maybe you can put html preview far right to.

@LUKSvideoclips Жыл бұрын

Incrível, um brasileiro acompanhando seus vídeos kkk Thank you for your help.

2 жыл бұрын

best explained vuejs out there

@xristinaribka 2 жыл бұрын

It was really helpful! thank u so much dude

@NetNinja 2 жыл бұрын

No problem! :) thanks for the comment

@mafwanalfiansyah2023 Жыл бұрын

amazing, thank you❤❤

4 ай бұрын

Hi there, I am a late learner for Vue.js, you are the best teacher ever! God bless you!

@NetNinja 4 ай бұрын

Thank you! 😃 that means a lot

@SinhNguyen-tz6us 3 жыл бұрын

Thank you so much 🙏

@user-vd8lx2gh9f 2 ай бұрын

Thanks bro. I WILL continue through all the provide videos😊

@NetNinja 2 ай бұрын

Have fun! :)

@push2me936 Жыл бұрын

Thanks a lot Shaun! Let's give it a wow! This is teaching on Champions League level!

@ebukaachugo3412 Жыл бұрын

I really appreciate your tutorials

@NetNinja Жыл бұрын

Thanks Ebuka :)

@lemokami 3 жыл бұрын

Thank you! Sensei🤩

@NetNinja 3 жыл бұрын

Any time!

@sophiaonyoutube Жыл бұрын

you're such a good teacher! thank you :)

@NetNinja Жыл бұрын

Thank you! 😃

@germaniyadagiozbek8953 8 ай бұрын

Best explanation ever!!!

@NetNinja 8 ай бұрын

Glad it was helpful!

@azula9714 3 жыл бұрын

Thank You Senpai

@arifurislam4426 10 ай бұрын

you are a beauty !!! love it

@NetNinja 10 ай бұрын

Thank you! Hope it helped :)

@danield.7359 2 жыл бұрын

very good stuff!

@imPriyankCoder 3 жыл бұрын

wow net ninja is back :),

@dieudonnemukunzi2471 3 жыл бұрын

Yay yaay!

@MediumSizeNoob 3 жыл бұрын

Thank you Ser!

@tordurhansen333 11 ай бұрын

The Final Empire is an amazing book! :D So is this course tbh

@deki90to 3 жыл бұрын

OMG THIS VUE HAVE SO MUCH SENCE, WAY MORE THAN REACT

@hossamibrahim7890 Жыл бұрын

Thanks alot ❤

@geraldminoza2921 3 жыл бұрын

Hi Shan, when i read the docs in vue, i noticed the contents still adapts 2.6 vue.js version, its a lot different from your sample codes here... May i know the docs as your reference for this tutorial? Thanks

@polymath-403 9 ай бұрын

Such a great Tutorial

@NetNinja 9 ай бұрын

Thank you!

@user-dd1vu2ff8i Жыл бұрын

Man your my hero 🙂🙂🙂 i hope the best for you ❤️❤️

@NetNinja Жыл бұрын

Thanks!

@jianafran 3 жыл бұрын

outstanding teacher

@adhy612000151 5 ай бұрын

million thanks brother!

@NetNinja 5 ай бұрын

You're welcome! :)

@deejayerick 3 жыл бұрын

Hey shaun!... Thanks!...

@danielwarzecha2007 Жыл бұрын

clicking a button has never been so fun before

@Gandobilis 10 ай бұрын

Toggle can also be implemented like this: {{ showBooks ? 'Hide' : 'Show' }} Books

@davebudah 3 жыл бұрын

Here to make sure the video(series) trends. Thank you.

@aryayunanta1470 3 жыл бұрын

thank you!

@haizacasapao356 2 жыл бұрын

Sir do you have tutorial of installing vue complete step and creating app outside that folder, please help me why my app.js file not appearing on my code when i run it without net, but it's perfectly fine when there is an internet.

@stepanostapuk4120 4 ай бұрын

Thank you for the video

@NetNinja 4 ай бұрын

You're welcome :) thanks for watching

@pattty847 Жыл бұрын

I searched "Learn Vue in an hour" and by golly you did it.

@vincej151 Жыл бұрын

Shaun - looking at the Udemy course, what is all the "archived" material about; what's it all for?

@oxk4r01 3 жыл бұрын

Hi, and thanks a lot for this tutorials :) Could someone help me on how to enable intellisense for Vue in *.js files? I'm not getting suggestions at all. Does Vetur need extra setup for that?