locked
Web API and Angular 4 RRS feed

  • Question

  • User-590375999 posted

    Hi,

    i want to develop  back end in web api and front end in angular 4

    1. is it recommended to develop web application with both ( web api and angular ) in same application other wise should i create 2 separate apps ?
    2.  Can i create asp.net web api 2 in vs2013 ?
    3.  Any good tutorial to use angular with asp.net web api  ?

    Tuesday, March 6, 2018 4:16 AM

All replies

  • User516094431 posted
    1. is it recommended to develop web application with both ( web api and angular ) in same application other wise should i create 2 separate apps ?

         It's better create 2 separate projects.

    1.  Can i create asp.net web api 2 in vs2013 ?

         Yes, You can.

    1.  Any good tutorial to use angular with asp.net web api  ?

         Go through following link video. It will really help full for you.

    https://www.youtube.com/watch?v=WWQZCDegWHg&list=PL6n9fhu94yhWqGD8BuKuX-VTKqlNBj-m6

    Tuesday, March 6, 2018 11:06 AM
  • User-474980206 posted

    1) to avoid CORS issues, I'd have a frontend webi project which hosted the static angular file(s), and a webapi for the angular ajax calls. I'd have a second web api project, which contained the business logic, that was called by the frontend project. 

    remember your frontend webapi will become a public interface anyone can use. you should limit it as much as possible.

    2) why would you want to do an angular 4 project in vs2013? it will not support the typescript 2.0 syntax used by angular 4.  

    3) there are lots of tutorials on writing a rest api with webapi. almost all angular tutorials assume a rest api.

    Tuesday, March 6, 2018 5:02 PM
  • User-590375999 posted

    1) to avoid CORS issues, I'd have a frontend webi project which hosted the static angular file(s), and a webapi for the angular ajax calls. I'd have a second web api project, which contained the business logic, that was called by the frontend project. 

    Hi Bruce,

    you mean create 2 api projects?

    1st for front end( Angular and Web API )

    2nd for Web API ( business login )

    call web api from web api ?

    Wednesday, March 7, 2018 3:47 AM
  • User283571144 posted

    Hi sivapooja,

    1st for front end( Angular and Web API )

    2nd for Web API ( business login )

    call web api from web api ?

    Yes, bruce's opinion is call web api from web api.

    By using this way, you could avoid CORS.

    Also you could set the CORS url setting to avoid CORS.

    More details, you could refer to below article.

    https://docs.microsoft.com/en-us/aspnet/web-api/overview/security/enabling-cross-origin-requests-in-web-api 

    Besides, in my opinion, this is according to your requirement.

    If your app is small, you could just create one web api project with angular app in it.

    If your app is large, you could 2 separate projects.

    Best Regards,

    Brando

    Wednesday, March 7, 2018 6:29 AM
  • User-590375999 posted

    Brando ZWZ

    Yes, bruce's opinion is call web api from web api.

    Hi Brando,

    1. create service web api ( Business logic )
    2. client web api ( with CORS )
    3. Angular Client call  client web api and client web api call service web api to retrive data?

    correct me if i am wrong.

    Wednesday, March 7, 2018 7:49 AM
  • User-590375999 posted

    Hi mshoablibra,

    https://www.youtube.com/watch?v=WWQZCDegWHg&list=PL6n9fhu94yhWqGD8BuKuX-VTKqlNBj-m6

    this tutorial shows biuld angular app in visual studio 2015 but it doesn't show how to combine both ( Angualr 4 and Web API 2 ) in same project????

    Friday, March 9, 2018 2:51 PM
  • User283571144 posted

    Hi sivapooja,

    Hi Brando,

    1. create service web api ( Business logic )
    2. client web api ( with CORS )
    3. Angular Client call  client web api and client web api call service web api to retrive data?

    correct me if i am wrong.

    Yes, bruce means use the client web api call service web api.

    Then your client web api could avoid using CORS to allow all the client get the data.

    this tutorial shows biuld angular app in visual studio 2015 but it doesn't show how to combine both ( Angualr 4 and Web API 2 ) in same project???? 

    I suggest you could try to follow below article to know how to combine angualr4 and web api.

    https://sudiptach.wordpress.com/2017/08/09/angular4-crud-aspnetwebapi-ef-sqlserver/

    Best Regards,

    Brando

    Monday, March 12, 2018 1:58 AM