Learn Angular 10, Web API & SQL Server by Creating a Web Application from Scratch
HTML-код
- Опубликовано: 31 июл 2020
- Source Code: github.com/ArtOfEngineer/Angu...
Related Tutorials:
--------------------
React JS + Python Django + SQLite full-stack app
• React JS + Python Djan...
--------------------
React JS + .NET Core Web API + Microsoft SQL full stack app
• React JS + .NET Core W...
--------------------
.NET Core API + Vue JS + Microsoft SQL full-stack web app
• .NET Core API + Vue JS...
--------------------
ASP .NET Core Web API + Microsoft SQL CRUD APIs
• ASP .NET Core Web API ...
--------------------
ASP .Net Core Web API + MySQL | CRUD APIs Tutorial
• ASP .Net Core Web API ...
--------------------
.NET Core Web API + PostgreSQL | CRUD APIs
• .NET Core Web API + Po...
--------------------
.Net Core Web API + MongoDB CRUD APIs
• .Net Core Web API + Mo...
--------------------
Python Django + SQLite | REST APIs
• Python Django + SQLite...
--------------------
Python Django + PostgreSQL | REST API Tutorial
• Python Django + Postgr...
--------------------
Python Django + MySQL CRUD API Tutorial
• Python Django + MySQL ...
--------------------
Python Django + MongoDB CRUD API Tutorial
• Python Django + MongoD...
--------------------
Python Django + Microsoft SQL Server CRUD API Tutorial
• Python Django + Micros...
--------------------
 Kite is a free AI-powered coding assistant that will help you code faster and smarter. The Kite plugin integrates with all the top editors and IDEs to give you smart completions and documentation while you’re typing. www.kite.com/get-kite/?...
Python and Angular app tutorial video: • Learn Angular 10, Pyth...
Learn to create a simple web application from scratch using Angular 10, ASP .NET Web API and Microsoft SQL Server.
1:12 : Install SQL Server and SQL Server Management Studio.
4:26 : Install Visual Studio.
5:50 : Install Visual Studio Code.
6:56 : Install POSTMAN.
7:44 : Install Node JS.
8:43 : Install Angular 10.
10:01 : Create DB and Tables in Microsoft SQL Server.
16:51 : Create .NET Web API Project.
20:38 : Force API to return JSON response only.
22:49 : Enable CORS.
24:52 : Create Models.
27:22 : API for Department Screen : GET.
33:13 : API for Department Screen : POST, PUT and DELETE.
36:48 : APIs for Employee Screen.
43:30 : Upload Photo API.
46:32 : Angular Project Intro.
48:02 : Create Angular 10 Project.
51:38 : Generate Components and Services in the Angular Project.
53:57 : Add Service methods to consume APIs.
59:32 : Routing in Angular.
1:01:42 : Add Bootstrap to our Angular App.
1:02:45 : Navigation Menu using Bootstrap.
1:04:50 : Show Department Screen with Bootstrap Table.
1:08:49 : Modal Pop Up Window using Bootstrap.
1:12:39 : Add and Edit Pop Up Screen for Department.
1:17:24 : Delete Department.
1:19:12 : Show Employee Screen with Bootstrap table.
1:22:31 : Upload Photo, Add and Edit Employee Details Pop Up Screen.
1:31:34 : Custom Sorting and Filtering to our Bootstrap table.
1:36:41 : How to get Publishable files of .NET Web API and Angular.
What a good way to to teach!. First time in my life, too much learning in minimum period of time and everything is conceptually clear. Thanks 🥰😍
So much content in so clear and compressed format. Amazing work.
Excellent job!! Thank God for the pause button because the context moved quickly! I love it!! Many thanks!!
If only college & university tutors were as clear and straight forward to the end-product. Then 90% of IT students would end up as great software developers. You made it seem like a walk in the park.
Thank you for making tutorial videos like this. It's astounding how the practical skills needed to build applications are neglected at the university level in favor of pure theory. This is excellent content. Please keep doing what you're doing.
You prolly dont care at all but does someone know of a way to get back into an Instagram account??
I stupidly lost my account password. I would love any assistance you can offer me
@@salvadorrhett5078 do you at least know the email address for the Instagram account?
@@salvadorrhett5078 answer bro
Excellent Video - deals with some many concepts/areas with just the right amount of detail.
Excellent video, thanks for sharing. I think the only part missing was authentication and authorization part but rest all looks awesome
Thank you so much! Such a useful video...I have created my own API and done CRUD using this one video! Kudos to the creator
THESE ARE EXACTLY THE TECHNOLOGIES I REQUIRE!
Amazing video. So many concepts in one well done piece of knowledge art. Thanks.
Excellent video! This is the way to introduce Angular to experienced developers.
You are the best instructor I have ever seen
really very useful video...the flow u explained is admirable...Great work...
best instructor I have ever seen !!
A live deployment tutorial will complete this.
BTW, excellent explanation!
This is very helpful! I'm able to learn more about developing with APIs this way!
Thank you so much for providing such good content. this video gives me the confidence to learn Angular.
Excellent demo.. I ah really happy..you saved a lot of time..this helps to any developer who wants to migrate to anguler
This is such a great and useful tutorial, thank you so much!!
Very nice...very well explained....keep making such videos 👍👍
Wow!!!. I learned so much in 1.5 hours!!! Many Thanks!!!
Excellent, Clarity, useful
I think it is the best tutorial on this topic. Thank you.
Thanks a lot for this! it helped me understand a lot!
It is really helpful even for beginners . thanks for such a wonderful video,😊😀😊😊❤️❤️
This is great!! Thank you!!
Very good tutorial, an amazing and well explained overview for someone who begin with this stack. Thank u so mutch
Thank you so much! It is really great way of teaching
Thank you so much! It really helpful for me! thank!
Very useful tutorial, keep it doing...
Holy shit, you are my savior.
I can not thank you enough!!!!!!!!You saved me!
very very nice video and explanation even speedy move. i enjoyed the video and learnt the Angular , Big thank you :)
just what i needed ...thanks
Thank you! Excellent video!
Excellent tutorial. Thanks a lot.
Definitely awesome. thanks for sharing.
Your tutorial is perfect!!!
Thank you so much, it is fantastic video, step by step , easy to learn quickly and clearly
I love all your video sir, it's really helpful, i gain a lot from your video , continue uploading angular,web api and SQL tutorial , hoping next tutorial is for log in with google auth.
excellent, at first looks easy, but it is quite hard indeed
Thanks man. Hope you create a deployment tutorial of this. :D
Nice video. Pls continue it
Routing : 59:29
Bootstrap: 1:01:43
Navigation Menu: 1:02:44
Show Department Screen: 1:04:50
Thanks for Creating this Video 🙌
Thank you my lord. Very good content
thank u so much now i get clarity how angular works
Very useful tutorial thank you very much sir
great tutorial ! thank you a lot
Thanks a lot !!! This video is a life saver
Can you please do the same for .net core web api, with stored procedures execution
Thank you for the nice tutorial. It helped a lot.
Thank You for the video! Is there another video to show working with deployable’s?
I simply use Python Flask (+ extensions) / Brython(Transpiler to JS) / HTML / CSS (W3CSS Framework)
It's very easy to learn and you can create all kind of apps in a very short time.
I know everyone has their preferences, but too many peoples just follow what others
are doing. JS is very much saturated, so many different flavors. It makes it difficult
to master the language like one could master C++
Thank you so much for this video ❤️very helpful ✌️
It is a very good introduction !
Absolutely brilliant
Nice explanation 👍 keep it up.
brilliant video thanks very much god bless you
Very nice explanation .Thank you!!!😀😀😀😀😀
Thank you! good tutorial)
The best video tutorial I even seen on RUclips till the date
Thank you so much
Thanka bro. I am a java developer . But wanted to learn this
how do we integrate these two apps? got a problem publish it to IIS, Someone help
Amazing work Thaks for your time.
I'm facing an issue in deleting department. Although, it is working in postman but not in angular.
It says: "No MediaTypeFormatter is available to read an object of type 'Department' from content with media type 'application/octet-stream'."
please help!
I used slightly quicker things such as using $@ instead of @+ or using the Code terminal instead of the Command Prompt. I would have used a scaffolder to do the modelling but I couldn't be bothered.
Excellent video!
God bless u my friend, absolutely save me
1:29:54 You write in 'add-edit-emp-component.html' depName.DepartmentName, but since DepartmentName is a variable from add-edit-dep-component.ts' and we are in different class, how is this going to work? I am new to Angular , please help me :)
does it include setting up authentication and user registration?
I keep on getting this error when trying to save an image "SaveFile()"
"Message": "The request entity's media type 'multipart/form-data' is not supported for this resource.",
"ExceptionMessage": "No MediaTypeFormatter is available to read an object of type 'Employee' from content with media type 'multipart/form-data'.",
Any help would be awesome
Thank you so much!!
the delete didn't work. i've been stuck at cors problem issue.. can i integrate this for mobile app development?
how can solve cors problem when performs delete method . also no error when performs get,post and put method.
SQL like at 39:26 is ripe for a SQL injection attack. SQL statements should *never* be prepared by concatenating user input (even if your user input has validation that attempts to prevent injection.) As an example, query = "insert into dbo.Employee values (@employeeName, @department,@dateOfJoining,@photoFileName)" and then add parameters to the SqlCommand is the way to do it.
He specifically mentions at around 28:10 that he will skip some of the best practices just to keep the tutorial simple.
Nice thank you, I will be using this for my next project!
I couldn't install CORS in Visual studio 2019.
Very helpful video sir... just one question can I use visual studio 2015 for Web API and some lower version of Angular to build the same application?as the same setup is not available on our development server.
Thanks in advance
Awaiting for reply
Thank you so much!
good job vatijaa
Very very useful video
Thank you!!
Let me ask I couldnt continue after 31:33 because on cmd argument from new SqlAdapter I get an error message which says: "cannot convert from WebAPI.Controllers.SQLcommand to System.Data.Sqlclient.SqlCommand". I dont find anything accurate on the web. Anyone could explain it?
the video is excellent. than you mister
Excellent work
Thanks mate.
very helpful demo sir
if anyone has problems with the modal:
"Take attention that in bootstrap 5 changed data-toggle to data-bs-toggle and data-target to data-bs-target"
bro mine doesn't show department woeks, it rather shows > symbol
Thank you
Hi, I am getting IndexOutOfRange exception when i try to upload files from postman, any idea why?
Bro where did you add the bootstrap js file for model pop up window in my case the model pop up doesn't works
thank you!
32:34 - There are lines of code using inserted in the method. Are they all a shortcut to importing namespaces and declaring at the same time? It is a bit difficult to read.
Im trying to reproduce, but I got stuck in Add department button , the modal is not displaying like the popup at 1:12:12 timestamp
Thank you so much bro ❤❤❤
You are amazing. Just one question. If you didn't want to pick a date with datepicker but instead wanted GETDATE() current date how to you go about it in the web api? It works on sql server but gives an error in the api with that string query.
thank you man , really helpful but why you don't use models instead of any data type ?
you are always the best
It is great. Can you make a video using core api and angular10?
How to save the voting(count like and dislike) of video in the database in access using angular?