Тёмный

Angular 17 CRUD Operation with .NET 8 Web API, Entity Framework Core | Project Tutorial in Hindi 

Code With Ved
Подписаться 1,6 тыс.
Просмотров 30 тыс.
50% 1

Angular 17 CRUD Operation with .NET 8 Web API using Entity Framework Core SQL - Full Project Tutorial in Hindi/Urdu
In this video, I will create an Angular 17 (Javascript framework based on typescript ) web application using Angular's latest version.
We will perform Angular CRUD operations and for API we will use ASP.NET Core 8 (.NET 8) to create a Web API from scratch.
This will be a great full-stack web application using two of the popular web framework ( Angular 17 and ASP.NET 8)
In our DotNET Core 8 Web API, we will use entity framework core and SQL Server to perform our CRUD operations .
We will create a new database from scratch with Code first approach using EF Core db migrations.
In our Angular 17 application,
We will create multiple pages and we will set up routing for these pages(components).
We will use Angular material & tailwind css in our Angular app to make beautiful web components.
We will also show beautiful toaster notification of user actions.
Source Code: github.com/mevedprakash/crud-...
Chapter & Topics in this Video
00:00 Intro
00:00 Topics to be covered
04:45 angular cli new project create
05:25 angular material integration in project
05:55 tailwind css integration
09:55 New component
10:23 Angular Routing
12:40 Create API project in DotNet 8
14:32 Ef Core Setup
20:05 Add API
28:45 Get List Data API
34:23 Get Single DataAPI
37:43 Update API
42:13 Delete API
45:45 Interface (type) in angular
47:32 angular service (http call)
52:00 Table data
1:03:47 Create Employee
1:11:05 Reactive Form in Angular
1:20:45 Submit form
1:22:45 Form Validation
1:25:15 Post API call
1:28:25 CORS issue fix
1:33:25 Edit Employee
1:43:35 Disable from control
1:45:35 Delete Employee
1:49:45 toaster notification
#angular #aspnetcore
---------------------------------------------------------
About this Channel
Code with Ved
This channel is all about teaching software developers to build web applications
in various technologies / programming languages like Angular, React, NodeJS, Asp.Net, C#, JavaScript, SQL, etc.
---------------------------------------------------------
🔗 Social Links
WebSite : codewithved.com (Launching soon)
Twitter : / codewithved_
RU-vid : / @codewithved
Instagram : / codewithved_
telegram: t.me/+NizYiqADwU04NDdl
#CodeWithVed

Опубликовано:

 

29 июн 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 137   
@ligerpost751
@ligerpost751 16 дней назад
Lots of knowledge from your tutorial ❤much love sir❤❤
@rudrakhetre1003
@rudrakhetre1003 Месяц назад
thank you for making my first CRUD Operation using Angular & .Net 8 Web API
@codewithved
@codewithved Месяц назад
Welcome
@manishbasnet1605
@manishbasnet1605 3 месяца назад
Excellent video. Please make more complex projects using Angular and .NET 8 Web API. Thanks for this wonderful content.
@codewithved
@codewithved 3 месяца назад
Thanks, will do!
@MuhammadShaheryar-dx8tj
@MuhammadShaheryar-dx8tj 4 месяца назад
Great Video :) Thanks for making these type of videos
@codewithved
@codewithved 4 месяца назад
Glad you like them!
@rahulkumarsingh5156
@rahulkumarsingh5156 4 месяца назад
Thanks bro for tutorial, and for the rest, he put the title in English for seo and better reach so that we people can search it on RU-vid and watch it. Thanks again
@codewithved
@codewithved 4 месяца назад
Thanks, yes Indian people also search in English for Hindi content, that is why. But I have edited the title and added it in Hindi.
@anilchaudhary9498
@anilchaudhary9498 16 дней назад
Great video with great explanation. Thanks Ved for sharing your knowledge with us. 😇
@codewithved
@codewithved 16 дней назад
Glad you liked it!
@ayushipatel8556
@ayushipatel8556 3 месяца назад
Thank you so much for this video :)
@codewithved
@codewithved 3 месяца назад
You are so welcome! 🙏🏻
@ligerpost751
@ligerpost751 6 дней назад
Sir this video is very helpful for us thanks sir❤
@codewithved
@codewithved 6 дней назад
Thanks
@thesinghnaveen
@thesinghnaveen 5 месяцев назад
great video for beginner Good job Ved
@codewithved
@codewithved 5 месяцев назад
Glad you liked it, thanks 👍
@parithakur9413
@parithakur9413 3 месяца назад
please bring more tutorial like this , nice content
@codewithved
@codewithved 3 месяца назад
Thank you, I will, I have other videos similar to this you can watch from the channel
@Tumharaabbu-xn6cd
@Tumharaabbu-xn6cd 5 месяцев назад
Nice video Happy with Hindi Video❤❤
@codewithved
@codewithved 5 месяцев назад
Thanks, I'm glad that you liked it.
@AkashPatel-ct2to
@AkashPatel-ct2to 5 месяцев назад
Thanks it really helpful
@codewithved
@codewithved 5 месяцев назад
Glad to hear that! It helped you .
@mustafacavuslu3856
@mustafacavuslu3856 5 месяцев назад
Great video bro, can you make a simple library automation using typescript and Angular?
@codewithved
@codewithved 5 месяцев назад
Thank , I will try soon
@jaypatel2471
@jaypatel2471 3 месяца назад
just perfect
@codewithved
@codewithved 3 месяца назад
Thankyou for appreciating
@amitojhahandsomehunk
@amitojhahandsomehunk 2 месяца назад
great video
@codewithved
@codewithved 2 месяца назад
Glad you enjoyed it
@sushantparekar3687
@sushantparekar3687 5 месяцев назад
Great work bhai mast ekdam
@codewithved
@codewithved 5 месяцев назад
Thank you bhai .
@sushantparekar3687
@sushantparekar3687 5 месяцев назад
@@codewithved bhai how u learned coding like vdo dekh ke ya documentations what is real secret and real way batao na please
@codewithved
@codewithved 5 месяцев назад
Both when I learn new tech then I watch video and after that I go for documentation to get more deep knowledge.
@sushantparekar3687
@sushantparekar3687 5 месяцев назад
@@codewithved do u code along vdos take notes and which vdos RU-vid or any specific platform I m working as fullstack Dotnet dev from 5 months (angular + net core ) tell me ways to achieve mastery please bhai
@codewithved
@codewithved 5 месяцев назад
@@sushantparekar3687 not any specific channel, in case I need to learn I just search , to be good, only way Is do make projects as much as you can.
@josbexerra8115
@josbexerra8115 5 месяцев назад
Muchas gracias Mister Ved por el excelente tutorial
@codewithved
@codewithved 5 месяцев назад
Thanks 👍🙏🏻
@user-cf7ez1hx2j
@user-cf7ez1hx2j 2 месяца назад
Bhai aise hi bnao vdo
@codewithved
@codewithved 2 месяца назад
Jaroor
@sudheerm.s6792
@sudheerm.s6792 5 месяцев назад
Appreciate the effort , English subtitle will be better .Slower the speed. Following is hard with your speedy coding
@codewithved
@codewithved 5 месяцев назад
Thanks for the kind words, I will try to code slow next time sure. For subtitle I will think about it .
@sudheerm.s6792
@sudheerm.s6792 5 месяцев назад
@@codewithved ❤️ keep uploading all the best to your channel
@codewithved
@codewithved 5 месяцев назад
💜
@Mzamani557
@Mzamani557 Месяц назад
Great Video. In case i have another Table/component named Department and i want to use it as a dropdown from the Employee component. Do you have a similar video to showcase the dropdown functionality?
@codewithved
@codewithved Месяц назад
Thanks, look at my inventory management series
@swapnilbopche5383
@swapnilbopche5383 3 месяца назад
Thanh youuuuu❤❤❤❤❤❤❤
@codewithved
@codewithved 3 месяца назад
Please share with friends 🙏🏻
@ligerpost751
@ligerpost751 16 дней назад
Sir isme drop-down,checkboxlist, radio button list ka bhi video upload kar dijiye please
@codewithved
@codewithved 16 дней назад
Mera angular form ka video dekho isme hai
@codewithved
@codewithved 16 дней назад
ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-bZ8Yzbi2sE4.html
@ligerpost751
@ligerpost751 11 дней назад
Sir when we navigatebyurl then show me error (process is not defined) in when we insert data and want to display then show me that error😢 in angular 18 version
@codewithved
@codewithved 9 дней назад
Check if you are importing correct router
@VijayMali-mb3fr
@VijayMali-mb3fr Месяц назад
thankyou sir
@codewithved
@codewithved Месяц назад
My pleasure 😊
@sadiasheikh1034
@sadiasheikh1034 Месяц назад
Could you please create more projects on core mvc
@codewithved
@codewithved Месяц назад
Ok
@TrushalGondaliya
@TrushalGondaliya Месяц назад
Brother can you make a new video to implement searching sorting and pagination in this crud operation? because i am searching for this type of fully functional crud tutorial of angular + dot net core on you tube and no one is make this type of video
@codewithved
@codewithved Месяц назад
Sure will do it
@ligerpost751
@ligerpost751 6 дней назад
But sir please .net core web api k sath angular me thora complex control pe project create karihe like drop-down, checkboxlist, radio button list. I am very thankful sir
@codewithved
@codewithved 6 дней назад
I will try , busy at work
@ligerpost751
@ligerpost751 6 дней назад
@@codewithved ok sir but please try
@ligerpost751
@ligerpost751 День назад
Sir please video bana dijiye complex control ka .net core api with angular
@AlFarooqSoftinnMultan
@AlFarooqSoftinnMultan Месяц назад
helo bro , thnx for this good tutorial, can u guide , how to publish api and angular project in same domain. thnx in advance
@codewithved
@codewithved Месяц назад
Will upload soon
@AlFarooqSoftinnMultan
@AlFarooqSoftinnMultan Месяц назад
@@codewithved thnx, waiting anxiously
@AlFarooqSoftinnMultan
@AlFarooqSoftinnMultan Месяц назад
sir , one more, thing, i m new to js frameworks, i have worked with vue js, should i move to angular, or stick to vue js, plz share ur experience
@s.s.6141
@s.s.6141 2 месяца назад
hello, i ve a problem, i see loading spinning when i switch to other pages, why could it be?
@codewithved
@codewithved 2 месяца назад
Have you added any loader?
@s.s.6141
@s.s.6141 2 месяца назад
@@codewithved ty for answering, it was about my html code, i used routerlink and problem's solved
@ligerpost751
@ligerpost751 15 дней назад
With dot net core web api ddl,cbl,rbl ka video upload karna please
@codewithved
@codewithved 14 дней назад
Ok
@ligerpost751
@ligerpost751 12 дней назад
Yes sir thank you
@ashutoshmehere5915
@ashutoshmehere5915 2 месяца назад
Sir video on react and . Net api
@codewithved
@codewithved 2 месяца назад
Check I have one video on react todo app
@tanuchaudhary6651
@tanuchaudhary6651 2 месяца назад
Hello Sir!! Thank you for the this knowlegable and well explained vedio. But I have little doubt and I hope you will definetely respond to my comment. At 1.35 when we edit employee and we disable the email so that user can't update it. But issue is while we update the employee details at the employee form we don't get the employee email. How to handle it ?? Please tell me. Please respond me I'm very gratefull and thankful toward you.
@codewithved
@codewithved 2 месяца назад
employeeForm.value only gives property that is not disabled. If you want all properties then you can use employeeForm.getrawValue() . Still have any query, do connect on me on Twitter or Instagram
@tanuchaudhary6651
@tanuchaudhary6651 2 месяца назад
Your insta??
@codewithved
@codewithved 2 месяца назад
In description
@mdsafikulislam9113
@mdsafikulislam9113 5 месяцев назад
Dear Brother, Please add authentication and authorization system./ Role Base Authentication Authorization....
@codewithved
@codewithved 5 месяцев назад
Please watch other videos I have added login password and Google authentication as well, thanks for watching
@ppp5921
@ppp5921 5 месяцев назад
need more complaxe or porject base tutorial using angular and .net
@codewithved
@codewithved 5 месяцев назад
We are coding love a ecommerce project, join us today 8pm Indian time live coding
@ppp5921
@ppp5921 5 месяцев назад
how to join ?
@codewithved
@codewithved 5 месяцев назад
8pm live on the channel
@codewithved
@codewithved 5 месяцев назад
ru-vid.comnWE3yhafRe0?si=0Vp2-qasUG1XGotU
@SparkVids420
@SparkVids420 4 дня назад
Hi i am starting my journey as software developer and they have said me to learn c# and angular I need your help like how I should start learning c#
@codewithved
@codewithved 4 дня назад
Start with basic tutorial of c# and dotnet then go for angular if you know javascript
@bhanukantsms
@bhanukantsms 4 месяца назад
where to put our Api Url globally in Angular 17 unlike previous versions do have environments folder inside that "environment.prod.ts" and "environment.ts" is there where we can save api url on the basis of environment. which I am not finding in Angular 17.
@codewithved
@codewithved 4 месяца назад
You can put in environment.ts file . You have to generate environment from cli commond from angular version 17 , before 17 it was created by default
@codewithved
@codewithved 4 месяца назад
You can watch my full angular tutorial video ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-FgB6Hrzw7z0.html
@virendravishwakarma6388
@virendravishwakarma6388 4 месяца назад
Can Anyone explain here why do we have made repository we can directly add api in our controller and call
@codewithved
@codewithved 4 месяца назад
Virendra, it is best practice to make database access classes separately. And we generally call database access classes as repositories. When we create a big project we follow onion architecture,I will suggest you read about it if you have not read it . Thanks for watching please with friends this channel 👍🙏
@virendravishwakarma6388
@virendravishwakarma6388 4 месяца назад
How can we solve 404 error while updating I m getting 404 error @@codewithved
@codewithved
@codewithved 4 месяца назад
Join telegram group, show the code error
@ligerpost751
@ligerpost751 6 дней назад
Sir aapka paid course bhi hai kya
@codewithved
@codewithved 6 дней назад
No paid course
@waseembakkar
@waseembakkar 5 месяцев назад
angular material install mein ya error hai Error: This command is not available when running the Angular CLI outside a workspace.
@codewithved
@codewithved 5 месяцев назад
Aapko angular material install krne k liye project ke andar command run krni hai , aap path dekho jaha commond run kr rhe ho sayd aap project se bahar ho .
@mdrifat-iy1lv
@mdrifat-iy1lv Месяц назад
in my case if I add 1 item it is adding twice.plz response dear
@codewithved
@codewithved Месяц назад
Check possibly your function is getting called 2 Times
@mdrifat-iy1lv
@mdrifat-iy1lv Месяц назад
@@codewithved I am a beginner in Angular this is why I tried all day long but failled to solve the issue and still trying....And thanks for the quick responce dear...
@codewithved
@codewithved Месяц назад
Connect on insta and send code screenshot
@mdrifat-iy1lv
@mdrifat-iy1lv Месяц назад
@@codewithved glad to hear that dear. Finally solved.I used Save() function twice.one in form submit and 2nd in Save button. now I,m seeing your next video.if face any problem will contact you.Take ❤ from the bottom of my heart.
@santo_59
@santo_59 3 месяца назад
Are you speaking English or your language? Looks cool but I can't understand when you are talking
@codewithved
@codewithved 3 месяца назад
Yes , It is in the Indian language.
@bishalbhattarai3064
@bishalbhattarai3064 5 месяцев назад
i dont have knowledge on dotnet can i watch this tutorial
@codewithved
@codewithved 5 месяцев назад
If you want to watch just for angular you can watch and skip the dotnet api part and you can assume that you have server API and it is created by somone else
@ligerpost751
@ligerpost751 10 дней назад
Please reply sir
@ligerpost751
@ligerpost751 6 дней назад
Sir paid course bhi kya aapka??
@codewithved
@codewithved 6 дней назад
Nhi paid course to nhi h
@ligerpost751
@ligerpost751 6 дней назад
@@codewithved ok sir
@jayakumar2927
@jayakumar2927 5 месяцев назад
service side token details not available
@codewithved
@codewithved 5 месяцев назад
Provide your Google console project details
@jayakumar2927
@jayakumar2927 5 месяцев назад
@@codewithved I am talking about JWT Token . here token not passed getAllEmployee() . this is my question
@codewithved
@codewithved 5 месяцев назад
I will check , thanks
@Mahesh-op3nw
@Mahesh-op3nw 3 месяца назад
@49:49 put as (Result:any)
@codewithved
@codewithved 3 месяца назад
why
@user-gl5fy7ux6v
@user-gl5fy7ux6v 4 месяца назад
Dude, nice tutorial, but for real why you put the title in english, the description in english and you talk in indian?
@codewithved
@codewithved 4 месяца назад
Thanks, should I put the title and description in Indian as well?
@user-gl5fy7ux6v
@user-gl5fy7ux6v 4 месяца назад
@@codewithved no, the tutorial is good if u mute the audio and try to understand what is happening, just specify in ur title that is in indian IMO because i was so hyped that i finally found an .net8 and angular 17 fullstack tutorial and when i heard that you were speaking in indian i was "meh, at least i can follow the tutorial"
@codewithved
@codewithved 4 месяца назад
Thanks, for pointing out. It matters
@user-gl5fy7ux6v
@user-gl5fy7ux6v 4 месяца назад
@@codewithved so in other words keep the title in english but at the end add: -"In Indian"
@GeorgeTrajkovic
@GeorgeTrajkovic 2 месяца назад
Awesome video! Thanks! PUT doesn't work for me because disabled email text field (this.employeeForm.controls.email.disable();) is ignored and it doesn't provide input value for put operation. In response I have got an error with message "The Email field is required." Any suggestions, please?
@codewithved
@codewithved 2 месяца назад
You are picking formvalue is using employeeForm.value , use employeeForm.getRawValue().
@GeorgeTrajkovic
@GeorgeTrajkovic 2 месяца назад
​@@codewithved Great! It works! Thank you so much!
@gyasipatel-dp3od
@gyasipatel-dp3od Месяц назад
Excellent video. Please make more complex projects using Angular and .NET 8 Web API. Thanks for this wonderful content.
@codewithved
@codewithved Месяц назад
Thanks, will do!, you can suggest the project name
Далее
skibidi toilet multiverse 039 (part 1)
05:29
Просмотров 4,7 млн
С Анджилишей на тусе💃
00:15
Просмотров 172 тыс.
He turned a baseball into a stylish shoe😱
00:59
Просмотров 622 тыс.
Golang is OG?
5:16
Просмотров 6 тыс.
Senior Angular Developer Interview (theory)
41:57
Просмотров 8 тыс.
EPAM 3 Years Interview Experience | Java Spring Boot
22:36
skibidi toilet multiverse 039 (part 1)
05:29
Просмотров 4,7 млн