This Tagline for NAPA development tools for SharePoint Online 2013 and Office 365 Preview sums up everything what you really want to know about what NAPA is intended for SharePoint Online development – “If you have an Office 365 account, a browser, and “Napa” you can build apps for Office documents, mail items, and SharePoint”. I am not really sure where I read this but It sums up everything what I learned about Napa tools so far.
First thing first, let me clarify. NAPA development tools are intended for only SharePoint Online Apps development at this moment. If you are planning to perform traditional SharePoint Online development to build SharePoint web parts, SharePoint pages, and extending SharePoint platform, Sandbox Solutions for SharePoint Online environment using Visual Studio 2010 or Visual Studio 2012 are still valid.
Over the last month, we have launched SP2013 readiness at our organization and one of my focus areas of new improvements in SharePoint Online 2013 Preview and new NAPA development tools for SharePoint Online Apps development. Couple of weeks ago, while watching Sunday Night Football game, I decided to fire up Napa tools and see what Microsoft planning to bring for SharePoint App developers in SharePoint Online space.
Here is my first experience with Napa Tools and some of my initial experiments with this promising Online development technology.
Step 1 – Provision Developer Site Collection in Office 365 Preview environment.
- You can accomplish provisioning developer site for Napa tools two different ways and both requires Office 365 account
- First Option – Shared Developer Site => Create Site Collection based on Developer Site template in your organization Office 365 preview environment - http://www.microsoft.com/office/preview/en/whats-new, This would allow you to create Shared development environment for team based testing and deployment
- Second Option – Individual Developer Site => Create developer Office 365 environment and Developer Site for individual developers – http://msdn.microsoft.com/en-us/library/fp179924(v=office.15).aspx, This should provision developer specific office 365 environment and site collection (not sure about whether it’s free or not once it goes preview goes RTM but my understanding is it would be free like MSDN licenses)
Step 2 – Install Napa Tools – App on the Developer Site Collection
- Once you have developer site collection in Office 365 environment, you need to visit SharePoint store and download “Napa” App. “Napa” is a free app for SharePoint. Since “Napa” is web based, one of the major benefits of Napa tools are you don’t need to install anything on your machine to start developing for Office and SharePoint. Just fire up your browser and start coding. As your application matures and you need more advanced tools, you can seamlessly switch to the more powerful, fully featured Visual Studio IDE, and continue developing there.
- To download Napa App, Login to the SharePoint Store using live id associated with your Organization or Personal account. Please note that this ID doesn’t have to same as your Office 365 account. e.g. I have logged into the SharePoint Store using my Hotmail account
- Add App – “Napa” Office 365 Development Tools from the office store, “Napa” is basically browser based code editor to build quick and easy apps for Office 2013 and SharePoint 2013. “Napa” itself is a cloud app hosted in Windows Azure and provides lightweight, in-browser experience, an online companion to Visual Studio.
Step 3 – Create your first App
- Click on “Napa” Office 365 Development Tools App to create App from the Developer Site
- You have option to create any of four kind of Apps – SharePoint 2013 hosted App or 3 kind of Office 2013 Apps – SharePoint Hosted App, Mail App, Task Pane App, & Content App
- In this walkthrough, we will Create your first SharePoint hosted App, For more detailed example for your first working NAPA App – http://msdn.microsoft.com/en-us/library/office/apps/jj220041(v=office.15) or http://msdn.microsoft.com/en-us/library/office/apps/jj220030(v=office.15)
- Some of the things I have noticed while creating first NAPA App
- Napa automatically added jquery files from Microsoft CDN
- Code Navigation – No toolbar but Use Visual Studio Short Cuts e.g. Undo (CTRL+Z), Find (CTRL+F), and Find/Replace (CTRL+H). For the full list of key bindings, hit (CTRL+’) to bring up a page with a list of all of the keyboard shortcuts
- App Properties – “Napa” allows you to edit your App Manifest and properties visually using a lightweight designer for the most common settings, I have noticed that there is no direct access to App manifest XML and you can change App manifest values declaratively only using project properties window
- Only Immersive App experience and client web part is available by default, Since we don’t have access to App Manifest XML, I am not sure how we can add App Actions
- Additional things you can perform with Napa tools
- Open in Visual Studio
- Share Project with Others
Step 4 – Deploy and Test Napa App
- Since SharePoint hosted App has been built using Napa Apps from the SharePoint 2013 Developer Site, you can directly deploy Napa App by running Run button.
- Click Run button to deploy App to your developer site
- If the app doesn’t start automatically because, for example, a popup blocker is enabled, choose the app link to launch the app
- You can test App immersive and App client web part experience.
Step 5 – Managing Napa Apps Projects
- Napa App keeps list of all the Napa projects
- You can create New App – SharePoint Hosted App, Mail App, Task Pane App, & Content App
- For all the Napa projects – You can open in VS, you can delete, or you can rename
- Project Items
- How can you package it up from DEV environment and move it to the integration/staging/prod environment?
- This is the big question and I am yet to find answer for this. I would love to find how to package Napa App and deploy it to another Site Collection in same tenant or different tenant without exporting them to Visual Studio for final packaging.
- Major Benefits
- No local SharePoint farm or Visual Studio required for office 365 Apps development or start initial development before moving into visual studio
- Within few minutes or hours, start developing SharePoint and Office Apps for SharePoint Online
- Very useful for independent software developer – lone ranger in the organization & no need for hard core visual studio development. All the apps built by Napa are Non-Managed code/declarative code
- Major Limitations
- Napa tools in team based development and version control limitations – As of today, Napa is not integrated with TFS Preview. Whenever you are ready for source control, you can export Napa App to the Visual Studio and use either TFS Preview or on-premises TFS Server for source control.
- What’s it future?
- Very promising – Since it’s app, MS just need to publish newer version of App to add more features, e.g. around Sep 25th, MS has added new feature “Share Projects” to share App code with other Office 365 accounts
Additional Resources – Ted Pattison’s Article is must read..
- Chak’s SharePoint Corner
- Building your first SharePoint App using “Napa” Office 365 Development Tools – http://blogs.msdn.com/b/chaks/archive/2012/08/16/building-your-sharepoint-app-using-napa-office-365-development-tools.aspx
- Napa Just Got Social! – http://blogs.msdn.com/b/chaks/archive/2012/09/30/napa-just-got-social.aspx
- Ted Pattison
- Using NAPA to create SharePoint 2013 Apps in O365 PreviewMy first weekend in Napa – http://blog.tedpattison.net/Lists/Posts/Post.aspx?ID=17
- Scot Hilliar
- Using NAPA to create SharePoint 2013 Apps in O365 Preview – http://www.shillier.com/archive/2012/07/18/using-napa-to-create-sharepoint-2013-apps-in-o365-preview.aspx
- Microsoft Resources
- Building Office and SharePoint Apps with “Napa” and Visual Studio – http://channel9.msdn.com/Shows/Visual-Studio-Toolbox/Building-Office-and-SharePoint-Apps-with-Napa-and-Visual-Studio
- Jason Zander’s blog – Introducing “Napa” – Office 365 Development Tools – http://blogs.msdn.com/b/jasonz/archive/2012/07/17/introducing-napa-office-365-development-tools.aspx
Overall, it’s step in right direction and would love to see where Microsoft takes it from here.