{"id":20915,"date":"2018-03-25T14:25:00","date_gmt":"2018-03-25T14:25:00","guid":{"rendered":"https:\/\/blogs.msdn.microsoft.com\/premier_developer\/?p=20915"},"modified":"2019-02-14T20:18:22","modified_gmt":"2019-02-15T03:18:22","slug":"getting-started-with-azure-app-services-development","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/premier-developer\/getting-started-with-azure-app-services-development\/","title":{"rendered":"Getting started with Azure App Services Development"},"content":{"rendered":"<p>In this post, Application Development Manager, Vijetha Marinagammanavar, demonstrates how to get started with Azure App Services.<\/p>\n<hr>\n<p>To get started with Azure development we need to have Visual Studio 2013 or later, Azure SDK, and an active Azure subscription. We are using Visual Studio 2017 with our demo. <\/p>\n<p>If using VS2013 then download the SDK from <a href=\"https:\/\/azure.microsoft.com\/en-us\/downloads\/\">https:\/\/azure.microsoft.com\/en-us\/downloads\/<\/a><\/p>\n<p><br><\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image00216.jpg\"><img decoding=\"async\" width=\"1028\" height=\"437\" title=\"clip_image002\" alt=\"clip_image002\" src=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image002_thumb15.jpg\" border=\"0\"><\/a><\/p>\n<p><i>Figure 1 Download Azure SDK<br><\/i><\/p>\n<p><br><\/p>\n<p>Follow instructions below to deploy web application to Azure by creating App Service Plan<\/p>\n<p><b>Azure<\/b> <b>App<\/b> <b>Service<\/b> is a fully managed &#8220;Platform as a <b>Service<\/b>&#8221; (PaaS) that integrates Microsoft <b>Azure<\/b> Websites, Mobile <b>Services<\/b>, and BizTalk <b>Services<\/b> into a single <b>service<\/b>, adding new capabilities that enable integration with on-premises or cloud systems.<\/p>\n<p><br><\/p>\n<p>1. Open VS2017<\/p>\n<p>Note: Same steps will apply to all previous versions of the VS.<\/p>\n<p><br><\/p>\n<p>2. Create a new Web Application in Visual Studio by following the path<\/p>\n<p>Click on File \u2013&gt; New \u2013&gt; Project \u2013&gt; Templates \u2013&gt; Visual C# \u2013&gt; Web<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image00410.jpg\"><img decoding=\"async\" width=\"1028\" height=\"771\" title=\"clip_image004\" alt=\"clip_image004\" src=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image004_thumb9.jpg\" border=\"0\"><\/a><\/p>\n<p><i>Figure 2 Create new Web Application in Visual Studio<br><\/i><\/p>\n<p><br><\/p>\n<p>3. Create MVC application with authentication set to Individual User Account, this authentication type will allow us to register users and maintain the profile in SQL Server database.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image0065.jpg\"><img decoding=\"async\" width=\"1028\" height=\"483\" title=\"clip_image006\" alt=\"clip_image006\" src=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image006_thumb5.jpg\" border=\"0\"><\/a><\/p>\n<p><i>Figure 3 MVC project with Authentication set to Individual User<\/i><\/p>\n<p><br><\/p>\n<p>4. The project would look like below after creating it<i><br><\/i><\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image0083.jpg\"><img decoding=\"async\" width=\"567\" height=\"772\" title=\"clip_image008\" alt=\"clip_image008\" src=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image008_thumb3.jpg\" border=\"0\"><\/a><\/p>\n<p><i>Figure 4 MVC Web Application<br><\/i><\/p>\n<p><br><\/p>\n<p>5. Now let\u2019s build the project.<\/p>\n<p>Build: Click on Build then Build Solution<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image0103.jpg\"><img decoding=\"async\" width=\"883\" height=\"772\" title=\"clip_image010\" alt=\"clip_image010\" src=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image010_thumb3.jpg\" border=\"0\"><\/a><\/p>\n<p><i>Figure 5 Build the project<\/i><\/p>\n<p><br><\/p>\n<p>6. Next step is to publish the application to Azure using an active subscription. Right click on the project in solution explorer and select Publish option.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image0123.jpg\"><img decoding=\"async\" width=\"628\" height=\"772\" title=\"clip_image012\" alt=\"clip_image012\" src=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image012_thumb3.jpg\" border=\"0\"><\/a><\/p>\n<p><i>Figure 6 Publishing MVC project from Visual Studio 2017<br><\/i><\/p>\n<p><br><\/p>\n<p>7. Now choose Microsoft Azure App Service then hit Publish. Then add your Microsoft Account on which you have your Active Azure Subscription.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image0141.jpg\"><img decoding=\"async\" width=\"1028\" height=\"557\" title=\"clip_image014\" alt=\"clip_image014\" src=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image014_thumb1.jpg\" border=\"0\"><\/a><\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image016.jpg\"><img decoding=\"async\" width=\"1028\" height=\"490\" title=\"clip_image016\" alt=\"clip_image016\" src=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image016_thumb.jpg\" border=\"0\"><\/a><\/p>\n<p><i>Figure 7 Create Microsoft Azure App Service Plan using VS2017<\/i><\/p>\n<p><i><br><\/i><\/p>\n<p>8. Now name your Web Application and choose active subscription. <\/p>\n<p>Create new Resource Group if needed. Same applies to App Service Plan. You can create new in case one does not exist. In your case, you will create new one, choose the Location that is near to you, check <a href=\"http:\/\/azurespeedtest.azurewebsites.net\/\">http:\/\/azurespeedtest.azurewebsites.net\/<\/a> for response time of different data center to find out best location to use according to your location.<\/p>\n<p>An App Service plan is the container for your app. The App Service plan settings will determine the location, features, cost and compute resources associated with your app. <\/p>\n<p>After some time, it will automatically take you to the website, you have created.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image0181.jpg\"><img decoding=\"async\" width=\"1028\" height=\"602\" title=\"clip_image018\" alt=\"clip_image018\" src=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image018_thumb1.jpg\" border=\"0\"><\/a><\/p>\n<p><i>Figure 8 Web App is created using Visual Studio 2017<br><\/i><\/p>\n<p><br><\/p>\n<p>9. Now it is time to publish our Application to the server<\/p>\n<p>Just change the Home page view which is under Views \u2013&gt; Home \u2013&gt; Index.cshtml and make some changes to this page.<\/p>\n<p>Note: I have made changes to the text inside the jumbotron css class.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image020.jpg\"><img decoding=\"async\" width=\"1028\" height=\"570\" title=\"clip_image020\" alt=\"clip_image020\" src=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image020_thumb.jpg\" border=\"0\"><\/a><\/p>\n<p><i>Figure 9 Change the Index.html in MVC Project<br><\/i><\/p>\n<p><br><\/p>\n<p>10. Right click on the Project and hit Publish.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image022.jpg\"><img decoding=\"async\" width=\"1028\" height=\"539\" title=\"clip_image022\" alt=\"clip_image022\" src=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image022_thumb.jpg\" border=\"0\"><\/a><\/p>\n<p><i>Figure 10.a Publishing Profile connected to Azure<br><\/i><\/p>\n<p><br><\/p>\n<p>Hit the publish button once you reach above screen, it may take some time to upload the files for first time and depending upon your Internet Connection Upload speed. Once uploaded we can see our change is reflected.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image0241.jpg\"><img decoding=\"async\" width=\"1028\" height=\"583\" title=\"clip_image024\" alt=\"clip_image024\" src=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/31\/2019\/04\/clip_image024_thumb1.jpg\" border=\"0\"><\/a><\/p>\n<p><i>Figure 10.b Publishing Change using Visual Studio 2017 to Azure App Service<br><\/i><\/p>\n<p>You have successfully created new App Service Plan using Visual Studio and Azure SDK and published your very first change to Azure App Service.<\/p>\n<hr>\n<p><a href=\"https:\/\/blogs.msdn.com\/b\/premier_developer\/archive\/2014\/09\/15\/welcome.aspx\">Premier Support for Developers<\/a> provides strategic technology guidance, critical support coverage, and a range of essential services to help teams optimize development lifecycles and improve software quality.&nbsp; Contact your Application Development Manager (ADM) or <a href=\"https:\/\/blogs.msdn.microsoft.com\/premier_developer\/contact-us\/\">email us<\/a> to learn more about what we can do for you.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In this post, Application Development Manager, Vijetha Marinagammanavar, demonstrates how to get started with Azure App Services. To get started with Azure development we need to have Visual Studio 2013 or later, Azure SDK, and an active Azure subscription. We are using Visual Studio 2017 with our demo. If using VS2013 then download the SDK [&hellip;]<\/p>\n","protected":false},"author":582,"featured_media":37840,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[25,113,55],"tags":[53,24,3],"class_list":["post-20915","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-azure","category-visual-studio","category-web","tag-app-services","tag-azure","tag-team"],"acf":[],"blog_post_summary":"<p>In this post, Application Development Manager, Vijetha Marinagammanavar, demonstrates how to get started with Azure App Services. To get started with Azure development we need to have Visual Studio 2013 or later, Azure SDK, and an active Azure subscription. We are using Visual Studio 2017 with our demo. If using VS2013 then download the SDK [&hellip;]<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/posts\/20915","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/users\/582"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/comments?post=20915"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/posts\/20915\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/media\/37840"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/media?parent=20915"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/categories?post=20915"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/tags?post=20915"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}