Wednesday, 16 July 2014

The People App- Yet another SharePoint App

Inspired by the Windows  Phone 8 people app Tiles I thought why we don't have a similar SharePoint Hosted app  displays the current user profiles in the same manner.
I googled the JQuery Tile effects until I found the below plugin at the link below :
http://www.drewgreenwell.com/projects/metrojs

I chose the fourth example which display 8 different images and keep flipping them in similar manner to Windows Phone People App tiles. The whole app development took around 2 hours or less.


  1. I created a new solution in visual studio called it "People App" Choose SharePoint hosted app and I chose to deploy to my test environment (on Premise) to see how you can configure your own On Premise Environment to develop Apps please follow the guide here
  2. Add new App Part to the newly created app and name it PeopleTile
  3. Copy the metroJS files into Images, Scripts and Content App Folder
  4. Add the references to JS and CSS files to the App Part aspx Page
  5. Create new JS files and name it SearchHost, in this javascript file the app logic will be placed
  6. The app will execute Search queries to the host web and by passing the sourceID=B09A7990-05EA-4AF9-81EF-EDFAB16C4E31 it will limit the search to the People search
  7. Search Sort Expression is set to random value to retrieve random peoples each time the search is executed.
  8. After a successful search query the app will construct the appropriate metrojs markup and place the it in the correct location 
  9. The app will look like below
  10. You can download the app via office Store here
The user profile images will keep flipping ,when the user clicks on a profile image the browser will navigate to the user's mysite Url

App need to be granted single permission so it can execute search on the host web and read from user profile


I will post the full code on MSDN shortly 
Happy SharePointing !


Friday, 11 July 2014

Step by Step: Configure Your on Premise environment to develop SharePoint Apps

In this post I will explain in details how to configure your environment for app development in a standalone server setup. I find this scenario very useful when you want to debug a remote event receiver and you don't have a windows azure subscription or as in my case I wanted to test an app which requires multiple user accounts and I have a single user developer plan account and I don't want to add 10 user subscription just to test my SharePoint App.

First of All you need to add a sub-domain or separate domain to configure the Apps Url

  1. Go to DNS settings 
  2. Inside your DNS Server In my case the server name was SP , expand Forward look-up Zone
  3. Under your main domain (insight.com in my case)add new CNAME
  4. In Alias Name type *.apps and in Full qualified type *.apps.yourdomain.com in the target host type the full qualified name of your SP Server which acts like DC and DNS as well (Single server environment)
  5. to make sure that your configuration is correct open the command prompt and ping 12232.apps.yourdomain.com if it resolve to your sharepoint server IP means your DNS configuration is good to go 
  6. Now you need to make sure that the app subscription settings service application is configured and running , by default it's stopped and you need to run power-shell script to do the following

      • Create managed account
      • Create proxy for the service application 
      • Create the service application itself
      • You can follow the MSDN Guide on how to configure the subscription service application here
  7. Open Central administration and click on Apps menu item on the left side menu
  8. Click on Configure App URLs 
  9. Type the subdomain you previously configured in DNS apps.yourdomain.com , as an app prefix type app or anything else your want
  10. Click on  Manage application catalog under application management and create an application catalog 
  11. Create a news developer site collection and use it to deploy and test your SharePoint apps.
Now you can use your On-Premise Development server to test your apps