Vue 3 with TypeScript Tutorial #4 - Types & Props

In this Vue & TypeScript tutorial you'll learn how to work with typed props in nested Vue compoents.

🐱‍👤 View this course in full without ads on Net Ninja Pro:

🐱‍💻 Course Files:

🐱‍👤 JOIN THE YOUTUBE NET NINJA GANG -

🐱‍💻 🐱‍💻 My Udemy Courses:

🐱‍💻 Useful playlists:

🐱‍💻 🐱‍💻 Other links:

🐱‍💻 Social Links:

[tihomirgrujic]

I said that before and I must say that again, bro you are the best teacher on the for everything...

[drac.]

I don't comment often, but I must say that this video series feels like it came straight out of a LinkedIn Learning or Udemy course which people pay for. 😎 Thank you very much for this! All the best. 👍

[brambekkers]

Thanks for the tutorials. For new users: Make use of the Volar plugin instead of Vetur.

[jorgeluisrodriguez]

For anyone new. if you installed vetur for this videos. as of 5/13/2023 there is another extension called "Vue Language Features (Volar)" in which you dont have to manually modify de settings 7:08. If you install both you will get a "known error" at the bottom right of VSCode and you will also get the suggestions twice. (id, location, salary, title, id, location, ...)

[randomcheezyMcmuffin]

8:40 For JobsList styles
.job-list {
max-width: 960px;
margin: 40px auto;
}
.job-list ul {
padding: 0;
}
.job-list li {
list-style-type: none;
background: white;
padding: 16px;
margin: 16px 0;
border-radius: 4px;
}
.job-list h2 {
margin: 0 0 10px;
text-transform: capitalize;
}
.salary {
display: flex;
}
.salary img {
width: 30px;
}
.salary p {
color: #17bf66;
font-weight: bold;
margin: 10px 4px;
}

[webmade]

Such high quality content - this is perfect as an engineer who's about to transition from React to VueJS!

[darkangel_luma]

Amazing series, thanks so much. It is helping a lot about my understanding of Vue 3 with Typescript.

[MaxProgramming]

I was amazed to see you used rupees as the currency. Love the British accent btw

[noopurp]

Thanks a ton for this. This video helped me in one of my projects...

[manojyadav]

Please also describe how to implement pagination and search filter with typescript while fetching data from api

[martinvalenzuelamagallanes]

Wow I had this issue with props as Arrays, this video showed me how to solve it, Thanks

[ahmedtouzani]

I really enjoy your courses . Plz i have a question can you make some courses about strapi ?!

[elisaresmini]

😊 It's work!!! I love this tutorial!!

[ayushdedhia]

Ohh god how can you be so nice...❤️ This is the exact tutorial I was looking so far 🔥

[rawhoyt]

what do you use to create slides? Your slides are really nice

[erykczajkowski]

Hmm what about Union types for props? If we have a type (string | number) but prop requires to choose String or Number?

[Andrew-nocd]

is it vue-cli on webpack? vite doesn't support "@" aliasses?

[VELIXYZ]

Hi! Thank you for your videos, i wanted to learn more Typescript to VUE 3

I made an Array of my new Type People as Peoples: [] as PropType<People[]>
but how to push new objects in ?

It is telling Property 'push' does not exist on type 'PropConstructor<People[]> | PropConstructor<People[]>[]'.

[ismalzikri]

so, when you make react + typescript tutorial ?

[notme]

how to import @, i get red error on vscode