Creating Cloud Hosted Line Of Business Applications with

Creating Cloud Hosted Line Of Business Applications with Apps for Office, O 365, Azure, and WP 8 Michael Sherman Todd Baginski Canviz Consulting, LLC.

Who is this guy? Michael Sherman Sr. Share. Point Architect, Share. Point & Web, CANVIZ Consulting 10 -year Share. Point geek (dev, ops & arch. ) 20 -year 12 th Man (#gohawks) @UWSherm http: //www. linkedin. com/in/uwsherm/ http: //www. canviz. com

Who is this guy? Todd Baginski Vice President, Mobility & Share. Point Solutions, CANVIZ Consulting Wannabe ski patroller & ski instructor, 8 Time Share. Point MVP, and Share. Point Top 25 Influencer @toddbaginski http: //www. canviz. com http: //www. toddbaginski. com/blog http: //sharepointpromag. com/blog/todd-baginski-sharepointdevelopment

Agenda Set the stage How do Apps for Office, Office 365, and Azure make creating line of business apps in the cloud easy? Demo Architecture & Code Wrap up

Key Takeaways With the cloud app model for Share. Point, Apps for Office, and Azure you can create secure cloud hosted line of business applications for a mobile workforce.

Architecture Components Clients MS Word + Apps for Office Qualify ideas MS Excel + Apps for Office Triage, evaluate, display results Windows Phone 8 App View Announcements, submit ideas Cloud Private O 365 Share. Point Site Contest information Leaderboard Announcements My Ideas Qualify, Triage, Assess ideas Collaboration Windows Azure Access Control Service Authentication Windows Azure Cloud Services/ Web Sites Send notifications Create Share. Point sites Provision Share. Point sites Implement Apps for Office Windows Azure SQL Database Store idea, contest, and financial data

Core Technologies O 365 Private Web Sites Apps for Office Microsoft Office Windows Phone 8 Windows Azure • Web Sites • SQL Database • Mobile Services

Fundamental Toolsets ASP. NET MVC 5 Entity Framework 6 Visual Studio 2013 HTML 5 CSS 3 Java. Script / JQuery / AJAX

Begin Innovation Management Demo Michael Sherman Todd Baginski

Employee

Submitting Ideas

Calling all mobile users View Announcements Share. Point List Data Submit Idea Windows Azure SQL Database

Going Mobile Data Sources Share. Point Announcements List http: //<tenancy>. sharepoint. com/innovation/lists/Announcements Windows Azure SQL Database Data Access Model C# Code uses SP CSOM to read Announcements list C# Code calls ASP. NET Web API uses Entity Framework to Query and Update Windows Azure SQL Database UI Model XAML Controls Notifications Azure Mobile Services

Office 365 Web Sites can do a lot! Custom Apps ECM Collaboration Search Workflow etc.

Leaderboard Provider-hosted App Data Source Windows Azure SQL Database Data Access Model ASP. NET Web API uses Entity Framework to Query Windows Azure SQL Database UI Model Windows Azure Web Site HTML/ASP. NET MVC Presented on Share. Point Page Using Client Web Part

MVC Controller public Action. Result Leader. Board() { Dictionary<string, List<Leader. Board. Model. DTO>> ret. Dic = new Dictionary<string, st<Leader. Board. Model. DTO>>(); Leader. Board. Model leader. Board. Model = new Leader. Board. Model(); ret. Dic = leader. Board. Model. Get. Leader. Model(); … return View(ret. Dic); }

My Ideas Provider-hosted App Data Source Windows Azure SQL Database Data Access Model ASP. NET Web API uses Entity Framework to Query Windows Azure SQL Database UI Model Windows Azure Web Site HTML/ASP. NET MVC Presented on Share. Point Page Using Client Web Part

Announcements Provider-hosted App Data Source Share. Point Announcements List on O 365 Private Share. Point site Data Access Model ASP. NET Web API [Share. Point. Context. Filter] attribute passes Share. Point Context seamlessly Just decorate and code! Web API uses Managed CSOM to query Announcements List UI Model Windows Azure Web Site HTML/ASP. NET MVC Presented on Share. Point Page Using Client Web Part

Admin Links Provider-hosted App Data Source Windows Azure SQL Database Data Access Model ASP. NET Web API JSONP Service Controller ASP. NET Web API uses Entity Framework to execute Stored Procedures in the Windows Azure SQL Database UI Model HTML/JQuery Part of the Share. Point Master Page

Master Page / Azure Code $("#Admin-link-go"). click( function () { var admin. Text = $("#agave_admintext"). html(); var azure. Site. Url = $("#Azure. Site. Hostname"). val(); var turl; if (admin. Text == "0 - Seed first round ideas") { turl = azure. Site. Url + "/Jsonp. Service/Seed. First. Round. Ideas"; } $. ajax({ async: true, url: turl, type: 'GET', data. Type: 'jsonp', success: function (data) { if (data. status. to. Locale. Lower. Case() == "ok") { alert("Success. "); } }) return false; });

How did you make it so pretty?

A new way to brand your sites! Remote provisioning branding pattern Web API uses Managed CSOM to Provision root site and sub sites Provision branding artifacts (Master Page, Images, CSS, JS, Page Layouts) Create Announcements list and add Announcements Create Tasks list and add Tasks Clear and set home page contents Add and install SP Apps Add documents to document libraries in SP Apps via App Installed event MSDN Code Samples Now Available! Share. Point Online Solution Pack for branding and provisioning

Resume Innovation Management Demo Michael Sherman Todd Baginski

Employee

Apps for Office

There’s an App for that, even Office! What is an App for Office? What can it do? Mix and match Office Client Toolbar Office Document Body Task Pane App for Office

Sounds pretty cool, how do I make one? Architectural Patterns Templates

Here’s the pattern we used Data Source Windows Azure SQL Database Data Access Model JQuery invokes ASP. NET Web API uses Entity Framework to Query Windows Azure SQL Database UI Model Office. js Office. context. document. url Available after document is saved Pre-provisioning makes documents ready to go! Does not apply to Mail Apps for Office Windows Azure Web Site HTML / CSS / JQuery

Word App For Office – Qualify Idea Multiple Task Pane AFOs From Store Custom Read/Write Deploy Provider-hosted SP App

HTML Code <div class="holder"> <label>Interests / Hobbies</label> <div class="styled-select"> <select id="Interests. Hobbies"> <option></option> <option>Automotive</option> <option>Clothing</option> <option>Electronics</option> <option>Garden</option> <option>Home</option> <option>Health and Beauty</option> <option>Sports</option> <option>Toys</option> </select> </div>

Azure Code [Action. Name("Get. Idea")] [Http. Get] public Idea. DTO Get. Idea(string Idea. Name) { Idea. DTO idea. DTO = new Idea. DTO(); idea. DTO = (from i in db. Ideas where i. Name == Idea. Name select new Idea. DTO { Id = i. Id, Name = i. Name, Description = i. Description, Department. Name = i. Department. Name, Submitter = i. Submitter, Team. Site. URL = i. Team. Site. URL, Qualified = i. Qualified }). First. Or. Default(); . . . return idea. DTO; }

Office. js Code function bind. Content. Controls() { update. Status("Bind Content Control. "); Office. context. document. bindings. add. From. Named. Item. Async('cc. Product. Name', Office. Binding. Type. Text, { id: 'cc. Product. Name' }, function () { }); … } function get. Idea. Data. From. Azure() { . . . $. ajax({ async: false, url: full. Url, type: 'GET', data. Type: 'json', success: function (data) { Office. select("bindings#cc. Product. Name") . set. Data. Async(data. Name, function () { }); . . . }

Mail App for Office – Vote for Ideas Single AFO Custom Task Pane Read/Write Data Visualization Voting Deploy App for Office 2013 Upload to tenancy Possible Compose App

HTML Code <ul class="block" id="block 1"> <li class="first"><label for="IDEA 1"><span class="idea">IDEA 1</span><input id="IDEA 1" name="group_1" type="radio" /></label><p class="dept">department of idea</p><p class="desc">description of idea. . . </p></li> <li class="last"><label for="IDEA 2"><span class="idea">IDEA 2</span><input id="IDEA 2" name="group_1" type="radio" /></label><p class="dept">department of test</p><p class="desc">description of test. . . </p></li> </ul>

Resume Innovation Management Demo Michael Sherman Todd Baginski

Triage Lead

Excel App for Office – Triage Idea Single Custom AFO Read/Write Data Visualization Charting Deploy Provider-hosted SP App

Resume Innovation Management Demo Michael Sherman Todd Baginski

Executive Review

Excel App for Office – Evaluate Results Multiple AFOs From Store Custom Task Pane Embedded Read/Write Data Visualization Mapping Deploy Provider-hosted SP App

Office. js Code Office. context. document. bindings. add. From. Named. Item. Async(sheetname + "!F 5: F 23", "matrix", { id: sheetid + "cc. Product" }, function (async. Result) { var array = new Array(azuredata. Name), new Array(""), new Array(azuredata. Description), new Array(""), new Array(azuredata. Department. Name), new Array(""), new Array(azuredata. Intended. Customer. Age), new Array(""), new Array(azuredata. Intended. Customer. Sex), new Array(""), new Array(azuredata. Intended. Customer. Income), new Array(""), new Array(azuredata. Intended. Customer. Occupation), new Array(""), new Array(azuredata. Intended. Customer. Interests)); Office. select("bindings#" + async. Result. value. id) . set. Data. Async(array, { coercion. Type: "matrix" }, function () {}); } });

Takeaways: Windows Azure

You name it, I can do it! Web Sites ASP. NET MVC Web Site ASP. NET Web API Share. Point. Context. Filter SQL Database Entity Framework Create Model From Cloud Database! Mobile Services Push Notifications

Takeaways: Visual Studio

Visual Studio has a crush on Azure Publishing Share. Point Apps Windows Azure Web Sites SQL Azure Database integration Remote Debugging

Wrap Up

Did you drink enough coffee to get all that? With the cloud app model for Share. Point, Apps for Office, and Azure you can create cloud hosted line of business applications for a mobile workforce. Apps for Office include a rich set of integration points with Office client applications. Azure is the glue! Plumbing Share. Point and OAuth with MVC Web Sites is a piece of cake. Visual Studio enables high developer productivity with templates and tooling.

Related content SPC 283 - Get started developing Apps for Office & Share. Point 2013 http: //channel 9. msdn. com/Events/Share. Point. Conference/2014? sort=sequential&direction=desc&term=283 SPC 351 - Office Power Hour - new developer APIs and features for Apps for Office http: //channel 9. msdn. com/Events/Share. Point. Conference/2014? sort=sequential&direction=desc&term=351

Related content SPC 294 - Achieving better business productivity through Apps for Office http: //channel 9. msdn. com/Events/Share. Point. Conference/2014? sort=sequential&direction=desc&term=294 SPC 391 - Deep dive into Mail Compose Apps APIs http: //channel 9. msdn. com/Events/Share. Point. Conference/2014? sort=sequential&direction=desc&term=391

Related content MSDN Apps for Office Developer Center http: //msdn. microsoft. com/en-US/office/aa 905340 MSDN Apps for Office dev quick start guide http: //msdn. microsoft. com/en-US/office/dn 448457 Introducing MVC support for apps for Share. Point http: //blogs. msdn. com/b/officeapps/archive/2013/07/09/introducing-mvcsupport-for-apps-for-sharepoint. aspx

Related content Site Provisioning Techniques and remote provisioning http: //blogs. msdn. com/b/vesku/archive/2013/08/23/site-provisioning-techniques -and-remote-provisioning-in-sharepoint-2013. aspx Self Service Site Provisioning Using Apps for Share. Point 2013 http: //blogs. msdn. com/b/richard_dizeregas_blog/archive/2013/04/04/self-service -site-provisioning-using-apps-for-sharepoint-2013. aspx

Related content Share. Point Online Solution Pack for branding and provisioning http: //blogs. msdn. com/b/vesku/archive/2014/03/02/sharepoint-online-solutionpack-for-branding-and-provisioning-released. aspx

Explore Play Follow Get Answers Give Feedback

Patterns and practices 30+ Visual Studio projects Common scenarios Contribute

OFC-B 254 Integrating Yammer and Microsoft Share. Point Using. NET DEV-B 230 Most Commonly Asked for On-Premises Customizations Reimagined as Applications for Share. Point DEV-B 319 Get Started Developing Applications for Microsoft Office and Share. Point Server 2013 DEV-B 231 Office Power Hour: New Developer APIs and Features for Applications for Office DEV-B 227 Anyone Can Build a Share. Point Application with Microsoft Access OFC-B 274 Implementing Microsoft Share. Point 2013 Hybrid for Search, Business Connectivity Services, Microsoft One. Drive for Business and Yammer

DEV-B 232 Creating Cloud Hosted Line-of-Business Applications with Apps for Office, Microsoft Office 365, Microsoft Azure, and Windows Phone 8 OFC-B 311 A Practical Use of External Data Sources DEV-B 357 Developing Office 365 Cloud Business Applications DEV-B 387 Deep Dive into Mail Compose Applications APIs DEV-B 386 Setting Up Your On-Premises Environment for App Development DEV-B 228 Build Connected Productivity Apps for Share. Point and Office DEV-B 390 Share. Point Power Hour: New Developer APIs and Features for Apps for Share. Point DEV-B 389 Who Are You and What Do You Want? Working with OAuth in Microsoft Share. Point 2013

EXM 04 Exam Prep: 70 -331 and 70 -332

http: //channel 9. msdn. com/Events/Tech. Ed www. microsoft. com/learning http: //microsoft. com/technet http: //microsoft. com/msdn