2. About the Speaker
Bob German
Principal Architect at BlueMetal Architects
Developer and architect on the SharePoint platform
since it was called “Site Server 3.0”
Co-author of SharePoint 2010 Development with
Silverlight for Addison-Wesley
http://blogs.msdn.com/BobGerman
BlueMetal Architects
We are experts at building solutions that exactly meet the
needs of our customers by apply the right people, processes
and platforms.
Our focus is on modernizing applications through expertise in
Creative, Social, Development and Data.
We have offices in Boston, New York, and Chicago.
@Bob1German
#spfestchi @Bob1German
3. Who Moved the Cheese?
Traditional SharePoint
Development
New
App
Model
Old Packaging
New Approach
SharePoi
nt
Develop
er
@Bob1German
4. A Brief History of SharePoint Development
2007 • Well documented model with
“Features” and “Solutions”
2010 • Added Sandbox
• Added Client APIs
2013 • Deprecated Sandbox
• Added App Model, more Client APIs
Key concept:
Microsoft wants us to start
developing outside of SharePoint
• Similar to Facebook and other online service “apps”
• Code runs in browser or an external web site;
access SharePoint via Client API’s
• Works in Office 365 and other hosted services
• Helps with stability, upgradability on-premises as
well
2003 • First .NET version; limited API
• No documented deployment model
20032001 • ASP Classic “Digital Dashboard”
• CAML is born
5. approaches to SharePoint
development:
2007 • Well documented model with
“Features” and “Solutions”
2010 • Added Sandbox
• Added Client APIs
2013 • Deprecated Sandbox
• Added App Model, more Client APIs
2003 • First .NET version; limited API
• No documented deployment model
20032001 • ASP Classic “Digital Dashboard”
• CAML is born
A Brief History of SharePoint Development
Farm Solution Sandboxed App
Hosting: On-prem On-prem,
O365
On-prem, O365
Code runs: In browser or
On
SharePoint
servers
In browser or
In SP user
code service
process
In browser or
On external site,
out of
SharePoint
Capability: Unlimited Very Limited Emerging
API: Server Server
(limited)
Client
Security: Code can be
omnipotent
Code runs as a
user
Code runs as
app or user
1 2 3
@Bob1German
7. App Isolation
App Azure
or other provider
Host
Web
App Web
(optional)
http://myserver/sites/myweb/
http://app12345/sites/myweb/
http://whatevs.com/somepath/
Different domain names leverage
browsers’ same-origin policy
@Bob1German
8. App
Host
Web
App
Web
Mix and match App Web and Cloud
Provisioned by SharePoint on
app installation
Code in Javascript on browser
No Server Code – period!
(though you can leverage
installed ASP.NET controls)
May contain declarative, web-
scoped features (lists, site
pages, client script, images,
css)
Access host web via cross-
domain library
Auto-hosted apps are
provisioned by Office 365 on
app installation
(Office 365 only; not yet
released)
Any hosted web site can work;
pretty much anything goes
Access host and app webs via
OAuth – run under:
End user’s permissions
App permissions
App Web Provider or Autohosted @Bob1German
9. The App Model Today
Complete isolation
Apps can’t interfere with the operating
system
Apps can’t interfere with other apps
Apps have granular permissions – no
more omnipotent code
Central distribution
Vet and control apps
No more messes
The system can clean remove an app
completely
App isolation should make upgrades
easier
Applications are restricted
Can’t take advantage of server APIs
More difficult to interact with other apps
Can’t elevate privileges –
no more omnipotent code
Central distribution
Need to configure, host apps
Version 1 Challenges
No auto-hosted apps on prem or in Store
Limited functionality
Can’t change host web page (e.g.
branding)
Client API’s much better but not
complete
Can’t be provisioned in site templates
Most solutions need to be
rewritten
The Good The Bad and The Ugly
10. Will Sandboxed solutions
really go away, and when?
Where are we supposed to
host provider-hosted apps?
Will Auto-hosted apps be available
on premises?
And if they are – will they run on
premises or in Windows Azure?
Will the app model
be another flash in the
pan like Sandboxed
Solutions or Silverlight?
Will Microsoft stop
supporting Farm Solutions
some day?
Will my organization want
to run SharePoint in
the cloud?
What’s a SharePoint
Professional to do?
Is my organization ready
for SharePoint 2013?
@Bob1German
11. Develo
p
Outside
the Box
Instead of… Start to…
Running code on the
server
Run code in the
browser
Using the Server API Use the Client API
Designing solutions
the traditional way
Design solutions that
are structured like
apps
Buying products that
work only on
premises
Buy products that
work in Office 365
Pretend you might be going to Office 365…
• It’s a good bet Microsoft will invest in development
approaches that work on Office 365
• You will enjoy the stability and ease of
administration that Office 365 requires
@Bob1German
12. The Challenge
Develop useful solutions which
run in SharePoint 2010 and
can be ported to SharePoint 2013
apps with 80% common code*.
* Not including packaging or reusable glue code; explanatory or gratuitous
comments excepted; void where prohibited; subject to local challenge terms
and restrictions; code is furnished for instructional purposes only and may not
be production ready; samples are designed to clearly illustrate technical
concepts and not necessarily for reliability or maintainability
@Bob1German
14. Site Provisioning Tool
Lists and provisions child sites using a custom
Web Template
Common uses:
Manage sites within a department site collection
Manage project sites
Automatic navigation to child sites
Began its life humbly as a sandboxed solution
Now living a dual life:
In a Content Editor Web Part in SharePoint 2010
In an App in SharePoint 2013
@Bob1German
15. Site Provisioning Tool
For a detailed description and pointers to the code see:
http://blogs.msdn.com/b/bobgerman/archive/2013/10/05/future-proof-
solutions-part-1-take-a-walk-on-the-client-side.aspx
@Bob1German
16. Code Walk-through
2010 2013
1
HTML and CSS
1
1
2
Get SP Context
2
2
4
Find WebTemplate
5
Create Child Site
3
Get and display sites
3, 4, 5
3, 4, 5
17. Shared Code Analysis
2010 2013
2
Get SP Context
3
Get and display sites
4
Find WebTemplate
5
Create Child Site
1
HTML and CSS40
25
59
42
33
LINES
LINES
LINES
LINES
LINES
25 not shared
174 shared
40
42
59
42
33
LINES
LINES
LINES
LINES
LINES
42 not shared
174 shared
@Bob1German
19. IT Issues Dashboard
Visual tracking of issues across a large department
Common uses:
Track service requests (help desk, etc.)
Track workflow performance (used with an audit list)
Dashboard to display SharePoint list data
The challenge:
The solution: Run it all in a Content Editor Web Part
(or in a SharePoint Hosted App)
@Bob1German
20. Code Walk-through
2010 2013
1
HTML and CSS
1
1
2
Get SP Context
2
2
4
Compile List Data
5
Bind to Charts
3
Read List Data
3, 4, 5
3, 4, 5
21. Shared Code Analysis
2010 2013
2
Get SP Context
3
Read List Data
4
Compile List Data
5
Bind to Charts
1
HTML and CSS64
25
65
221
33
LINES
LINES
LINES
LINES
LINES
25 not shared
383 shared
64
42
65
221
33
LINES
LINES
LINES
LINES
LINES
42 not shared
383 shared
23. Location Mapping Tool
Geocodes list items and displays them on a map
Common uses:
Display store or customer locations
Adapt to plot events or photos on a map
Get ready for the new GeoLocation features in SharePoint 2013
This one started as a SharePoint Provider Hosted
App
Now moonlighting:
As a server-side event handler and
Visual Web Part in SharePoint 2010
As a remote event handler and Client Web Part
in a SharePoint Provider Hosted App
@Bob1German
24. Code Walk-through
2010
2013
4
4
4
Handle List Event
2
Locations List
2
2
3
HTML and CSS
3 3
5
Geocode; Update list
5
5
6
Get SP Context
6
6
7
Display Map
7
7
1
GeoLocation Field
1
1
25. Shared Code Analysis
2
Locations List
5
Geocode; Update list
6
Get SP Context
7
Display Map
1
GeoLocation Field
3
HTML and CSS
4
Handle List Event
2013
45
156
20
63
286
LINES
LINES
LINES
LINES
LINES
121 not shared
585 shared
13LINES
123LINES
2010
39
156
20
49
286
LINES
LINES
LINES
LINES
LINES
99 not shared
585 shared
11 LINES
123 LINES
26.
27. Summary and Call to Action
Prepare for the future:
Pretend you might be going to Office 365
Update Development Skills
Learn client side development (Javascript, jQuery, Client OM, etc.)
Learn SharePoint App design patterns
Learn Azure and Oauth
Develop more in the browser, less on the server
Favor client APIs over server APIs
Demo Code and Downloads Now Available
http://blogs.msdn.com/BobGerman
@Bob1German
28. Thank You!
BOSTON | NEW YORK | CHICAGO
44 Pleasant Street, Watertown, MA 02472
www.bluemetal.com
Blog.bluemetal.com
@bluemetalinc
Notas del editor
HTML is in the .dwp file in SharePoint 2010 and in SimpleSiteWP.aspx in 2013AppContext.js is the only unique code other than packaging. It creates 2 context objects the same in 2010, one for App web and one bridged to Host web in 2013. From there the code can use the two context objects without regard for which version it’s using.App.js contains the guts of the application
HTML is in the .dwp file in SharePoint 2010 and in SimpleSiteWP.aspx in 2013AppContext.js is the only unique code other than packaging. It creates 2 context objects the same in 2010, one for App web and one bridged to Host web in 2013. From there the code can use the two context objects without regard for which version it’s using.App.js contains the guts of the application
I am including both the declaration of the site column and the code to handle the geolocationList to hold locationsHTML (there is no CSS, calling it this for consistency)Event receiver plumbingGeocode the list item from event receiver – uses CSOM even on the serverGet SP Context for displaying the mapDisplay the map
[TODO] This is a good closing slide. The black overlay on the black image is a little messy. Spacing could also be improved.