Learn MVC : Using Angular And Web API And Deploy To IIS

Open any MVC using Angular application in Visual Studio 2017. Here I am going deploy my previous application from “Learn MVC Using Angular Dynamic Control in DataTable”.

Introduction:

In this article we are going to,

  • Publish MVC using Angular Application
  • Publish Web API Application
  • Deploy these applications to Internet Information Server v.10.

Publish MVC using Angular Application

Open any MVC project using Angular application in Visual Studio 2017. Here, I am going to deploy my previous application that I used in my previous article “Learn MVC Using Angular Dynamic Control in DataTable.”

After opening your application right click on above the project name. Then select publish.

MVC

It will load one window then select create new. After completion click ok button.

MVC

If you select folder, It should enable file browser control like below picture

MVC

After Publish, load output window. If there are any issues on publish, it will be indicated. Release mode is the default one. If you need to, you can change Debug mode.

MVC

Now application is ready for deployment.

Publish Web API Application

Right click above the API Application. Then select publish.

MVC

You can follow the above steps such as Publish MVC Using Angular Applications.

MVC

Deploy to Internet Information Server

Open the internet information server with administrator privilege. It will be suitable for all the Windows operating systems.

MVC

Right click on Sites Folder and Click Add Website. Enter the website name & choose the physical path of web application (Presentation Layer).

MVC

Notes

Sometimes you may face version compatibility issues. So first, do not forget to check “Application Pool”.

MVC

Then based on your framework version, it may require you to set environment to the Server or OS.

MVC

I have set port no as “8025” & binding type is http. If you have domain IP then change your IP address. If you have public IP, you can give Host name & do not allow a duplicate name.

MVC

Everything is done and the application is ready for surfing.

MVC

Right click on the application, Add one more application under the application & this is for Web APIs.

MVC

Give the alias name of application & select the API application physical path.

MVC

Note

After completion, do not forget to update security. So right click on both applications. Keep following the above picture and add all the groups & give permissions for Full control.

MVC

Right click on “Web API” then Browse & check it. Application will work based on configuration. I have given port no “8025”. So it is working fine. Replace the web application consuming URL in web.config file.

  1. <add key="APIUrl" value="http://localhost:8025/WebAPI" />  

 

You  also want to change conneciton string

  1. <connectionStrings>  
  2.     <add name="ConString" providerName="System.Data.SqlClient" connectionString="Data Source=MYLTOP;Initial Catalog=DBMyn;User ID=sa;Password=Thiru@123" />  
  3.   </connectionStrings>  

If you know the host IP address, enter in browser IP & port+Application Name or your working current system then follow localhost & port+Application Name

Output

MVC

Now the application is running from IIS

See my previous Angular JS Articles

Conclusion

In this article, we have learned about MVC using Angular & Web API to deploy to internet information server (IIS). If you have any queries, please tell me through the comments section. Because your comments are very valuable.

Happy Coding!