There are number of ways available to create app for SharePoint.
(1) Using “Napa” Office 365 Development Tools
(2) Using Visual Studio 2012 RC
In previous post for SharePoint 2013 Development – Installing and Configuring Visual Studio 2012 RC I tried to explain, how to configure Visual Studio 2012 RC for developing Office and SharePoint Apps.
In this post I will explain how to create a basic app for SharePoint by using “Napa” Office 365 Development Tools.
Prerequisites: You should have An Office 365 account and The “Napa” Office 365 Development Tools app
Note: For more information about how to set up an Office 365 account, see Sign up for an Office 365 Developer Site. For more information about Office 365 development, see Sign up for an Office 365 Developer Site.
Overview: In this post , I will try to explain a simple app which allows me to create List and Lists Item.By using “Napa” Office 365 Development Tools, you can create your apps for SharePoint inside your browser instead of in Visual Studio. At any time, you can download your project and open it in Visual Studio for more advanced scenarios. (This post uses browser interface to create app)
I am assuming, you have setup your Office 365 Developer Site. Once you done with that, your screen would look like as below screen:
Install and deploy “Napa” Office 365 Development Tools: “Napa” Office 365 Development Tools is a browser-based authoring tool that makes developing apps for Office and SharePoint quick and easy. You cannot use the “Napa” Office 365 Development Tools tools to create provider-hosted or autohosted apps for SharePoint, but you can use them to create SharePoint-hosted apps. And because you can download the solutions that you create with the “Napa” Office 365 Development Tools tools and open them in Visual Studio 2012, you can use “Napa” Office 365 Development Tools as a way to get started with developing any kind of app for SharePoint.
To Install and deploy it, Click on the Get Tools to Build Apps tile (I have already implemented this step, so you can not see this option in above screen)
On the details page of the “Napa” Office 365 Development Tools app, choose ADD IT to install the app.
Choose the Trust It button in the next window.
It may prompt for, give your account detail.
After installation is complete click on the “Napa” Office 365 Development Tools icon on the All Site contents page to launch “Napa” Office 365 Development Tools.
How to Create an app for SharePoint Project: Click on “Add New Project” and Choose the App for SharePoint tile, name the project “My SharePoint App” for SharePoint, and then choose the Create button.
The code editor opens and shows the default webpage, which already contains some sample code that you can run without doing anything else.
How to add Controls to Home Page:
Once the project is created, you can see on the left side of the page under the Pages folder, choose the Default.aspx page if it isn’t already selected.
In the PlaceHolderMain section, add appropriate code under the existing HTML. (I will update code and .js file later on)
We are done with the first part of the UI and code is in place, so go ahead and run the app to verify whether it works.
The app is packaged, deployed, and installed on your Office 365 Developer site.
After installation, the app for SharePoint starts. If the app doesn’t start automatically because, for example, a popup blocker is enabled, choose the app link to start the app.
When you finish, close the browser window, and then choose the Close button in Launch App window to return to the project that you were editing.
How to Share Apps: One of my blog reader post an issue “I have created a “Hello Word” application and that works fine but when i try to access the same aplication URL from another browser with same hotmail account, it says “Access denied, You are not a member of this site. ” any idea how can i share this app to public?”
I work around it and resolved it. The solution is as below:
(1) Give people access to the site by clicking on “SHARE” link and enter email address (Note: you can set permission level as well)
(2) Once you click on Share button, user will receive email notification to accept invitation.
(3) Click on “Accept your Invitation” button. It will redirect you to below screen, it will ask you to use your hotmail account or userid (if you have)
(5) I have used my hotmail account for login, so it will redirect me to hotmail sign in page, where i need to give my hotmail credentials.
(6) That’s it. I am able to access the shared “Developer Site” using my hotmail account now.