• Save
SharePoint 2010 For Developers
Upcoming SlideShare
Loading in...5

SharePoint 2010 For Developers



This presentation is aimed at developers that want to work with SharePoint 2010.

This presentation is aimed at developers that want to work with SharePoint 2010.



Total Views
Views on SlideShare
Embed Views



9 Embeds 247

http://www.slideshare.net 193
http://blog.sparked.nl 20
http://lightweb.zumtobelgroup.com 12
http://lv55.wikispaces.com 11
http://server2 5
http://mosskaboss.blogspot.in 2
http://sharepointbliss.blogspot.com 2
http://mosskaboss.blogspot.com 1
http://webcache.googleusercontent.com 1



Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment
  • IE 6 wordtnietmeerondersteund
  • Note: Currently with Beta1 there is no built-in UI component that allows a user to enable and disable the developer dashboard. However, you can create a simple Console application that does the trick.

SharePoint 2010 For Developers SharePoint 2010 For Developers Presentation Transcript

  • Sparked goes SharePoint 2010 for developers
  • Who are we?
    • Roel Hans Bethelehem
    • SharePoint Solution Architect
    • Work experience: WUR, Sara Lee, Flora Holland
    • @rbethleh
    • E-Mail: roelhans.bethlehem@sparked.nl
    • Alexander Meijers
    • SharePoint Solution Architect
    • Work experience: Facilicom, Logica Intranet
    • Twitter: @ameijers
    • E-Mail: alexander.meijers@sparked.nl
  • SharePoint 2010 Developer Overview
  • Challenges
    • What’s new?
    • UX Platform
    • The Ribbon
    • The Toolbar
    • Dialog Framework
    • Tools
    • Web Part Development
  • What’s new?
  • Microsoft SharePoint 2010
    • Improvements to UI and accessibility features
    • Better tools for developers and designers
    • End-to-end integration with PowerShell
    • Improvements to lists and events
    • New client-side object model and runtime
    • Enhanced support for developing workflow applications
    • Development can now be done on client OS
    • New connector framework enhances Search infrastructure
    • User solutions and partially trusted code (sandboxing)
    What’s new?
  • UX Platform
  • Changes to the UX Platform
    • General platform improvements
    • Masterpages (dynamic) + _layouts
    • The Ribbon
    • Status Bar/Notification Area
    • Dialog Framework
    • New Theming Infrastructure
    • Silverlight Web Part
    • Client OM
    UX Platform
    Philosophy: Allow users to complete tasks quickly in context with a simple interface and reusable controls
  • Key Platform Investments
    • Standards and Refactoring
    • Targeting WCAG 2.0 AA standards
    • Reduced use of tables
    • Cross-browser support: IE 7+, Firefox, Safari
    • Visual upgrade
    • UI upgrade separated from database upgrade (can keep V12 UI while running on V14)
    • Enhanced vs2010 project templates
    • Client OM
    • JavaScript and Silverlight wrappers for SharePoint OM
    UX Platform
  • Refactoring
    • CSS
    • Split into multiple files, only download what’s necessary for the page
    • Existing sites based on SharePoint CSS will need to be redesigned
    • JavaScript
    • Script On Demand allows delaying JavaScript download until it’s needed
    • Debug versions of files show clear JavaScript before optimizing
    • SP.* “namespace” an effort to draw a line between “public” and “internal” JavaScript
    UX Platform
  • Masterpages + _layouts
    • Application pages (_layouts) use a dynamic masterpage based on what site they’re accessed from
    • Can use “~masterurl/default.master” or “~masterurl/custom.master” tokens to reference System or Site masterpage
    • Page must derive from Microsoft.SharePoint.WebControls.LayoutsPageBase
    • Exceptions: Pages which reference simple.master
    • accessdenied, confirmation, error, login, reqacc, signout, webdeleted
    • These seven pages can be replaced using OM or PowerShell
    UX Platform
  • Silverlight Web Part & Client OM
    • Allows users to quickly add Silverlight apps to SharePoint
    • Client OM allows Silverlight or JavaScript to access SharePoint data
    • Fluid Application Model
    • App can be hosted outside of SharePoint
    • Still access SharePoint data if given permission
    UX Platform
  • The Ribbon
  • Design
    • Fixed position at top of page – doesn’t scroll out of view
    • Contextual tab model
    • Controls: near parity with Client Ribbon
    • Super tool tips
    The Ribbon
  • Controls
    Out of the Box
    Not in the Box, but…
    • Button
    • Split button menu
    • Static
    • Stated
    • Drop down & Flyout menus
    • Customizable
    • Hierarchical
    • Checkbox
    • ToggleButton
    • Label
    • Textbox
    • Combo box
    • Spinner
    • Table control
    • Color picker
    • In-Ribbon gallery control
    • Drop down grids can give same functionality
    • Can also “fake” it with buttons in the Ribbon
    The Ribbon
  • Extensibility
    • Fully extensible
    • Remove any of the OOB controls
    • Add new controls anywhere in the Ribbon
    • Potential to replace the Ribbon entirely
    • Backwards compatible
    • Custom Actions added to Toolbars in v3 will automatically show up in the “Custom Commands” tab in the Ribbon
    • Adding a control to the Ribbon:
    • Ribbon XML defines the UI of the control
    • Simple behavior can be defined declaratively alongside Ribbon XML, more complicated behavior requires a JavaScript Page Component
    The Ribbon
  • The Toolbar
  • Status Bar/Notification Area
    • Give the user information in context without distracting them
    • Status bar should be used to display persistent information such as page status or version
    • Notifications should be used for transient or semi-transient messages
    The Toolbar
  • Persistent / Transient Information
    • Persistent information
    • Show below Ribbon
    • Will display 1 of 5 pre-set background colors depending on importance
    • Add / Remove messages with Javascript API
    • Messsage is HTML and can include links / icons
    • Transient information
    • Appears on the right side of the page underneath the Ribbon
    • Default message will last 5 seconds
    • Add / Remove messages with Javascript API
    • Messsage is HTML and can include links / icons
    • Sticky parameter available
    The Toolbar
  • Toolbar code examples
    Status APIs:
    SP.UI.Status.addStatus(strTitle, strHtml, atBeginning)
    SP.UI.Status.updateStatus(sid, strHtml)
    SP.UI.Status.setStatusPriColor(sid, strColor)
    Notification APIs:
    SP.UI.Notify.addNotification(strHtml, bSticky, tooltip, onclickHandler)
    The Toolbar
  • Dialog Framework
  • Keeping the user in the context
    Dialog Platform
    V4 UI
  • Design
    • Reduce page transitions/keep user in context
    • Contents load in an iframe inside a floating div
    • Dialogs are modal
    • Allow dragging within browser window
    • Can be maximized to size of browser window
    Dialog Framework
  • Extensibility
    • JavaScript API to control dialogs
    • Contents can be a page (URL) or DOMElement
    • Optional parameters to set title, width, height, whether or not to launch maximized, etc
    • Design a page once to display both inside a dialog and as a full page
    • CSS class “s4-notdlg” can be used to hide UI when a page is shown within a dialog
    Dialog Framework
  • Dialog code example
    function myCallback(dialogResult, returnValue)
    alert(“Hello World!”);
    var options =
    url: “/_layouts/somepage.aspx”, width: 500, dialogReturnValueCallback:myCallback
    Dialog Framework
  • Theming Engine
  • Easy to use
    • Uses *.thmx file format – can be generated by client Office programs (PowerPoint)
    • Parses CSS for comment-style markup, replaces colors/fonts and recolors images as directed
    • Automatically generates new CSS for each theme when it is applied
    • Automatically populates theme list from Theme Gallery files
    Theming Engine
  • How does it work?
    Theming Engine
    Automatically Populates
    THMX File
    • 12 Colors
    • 2 Fonts
    User Clicks Apply
    Style Library
    Located on file system or in database in themable locations – includes 3rd party CSS in same locations
    Colors and fonts in originals are replaced by those specified in the THMX per annotation in CSS files
    Annotated CSS File
    NEWCSS File
  • Theming engine example
    /* [ReplaceColor(themeColor:"Light1")] */
    /* [ReplaceColor(themeColor:"Light2",themeShade:"0.02")] */ border:1px solid #f1f1f2;
    /* [RecolorImage(themeColor:"Accent6",method:"Tinting")] */ background-image:url("/_layouts/images/selectednav.gif");
    /* [RecolorImage(themeColor:"Accent6-Darker",method:"Tinting", includeRectangle:{x:0,y:322,width:1,height:22})] */ background:url("/_layouts/images/bgximg.png");
    Theming engine
  • Tools
  • Developer Dashboard
    SharePoint 2010 delivers a developer dashboard which provides the developer useful information
    • How long did the request take to run?
    • What event handlers were fired?
    • In what sequence did these events handlers fire?
    • Alpha release needs PowerShell to enable this dashboard
    • Set –SPFarm –DeveloperDashboardEnabled
    • Set –SPFarm –DeveloperDashboardEnabled $false
  • PowerShell
    This tool is a modern replacement for the CMD (command) shell.
    • PowerShell support effectively replaces STSADM.EXE
    • SharePoint admins/devs must learn PowerShell basics
    • You can write powerful scripts against WSS OM
    • You can develop custom PowerShell snap-ins
  • SharePoint Designer
    SharePoint Designer has gone through many significant changes.
    • SharePoint objects such as lists and workflow associations are seen as first class objects in the new UI
    • Each SharePoint object has a summary page
    • More powerful workflow Designer
    • Reusable workflows
    • Prototypes created in SharePoint Designer can be migrated into Visual Studio 2010 (import / Export)
    • Workflow design in Visio 2010 possible
    • SharePoint Designer work exported to .WSP files (possible to import into Visual Studio 2010)
  • VS2010 SharePoint Tools
    • End-to-end SharePoint 2010 developer story
    • SharePoint Explorer for site exploration
    • SharePoint 2010 project and item templates
    • Visual designers for core scenarios
    • Migration path for Visual Studio 2008 & WSS 3.0
    • Extensible by 3rd party developers (e.g. STSDEV)
    • Benefits to SharePoint Developers
    • Abstracts away details of RootFiles directory
    • Abstracts ways details of building .WSP file
    • Lessens / eliminates need for external utilities
  • SharePoint Explorer
    • Add-in for Server Explorer Window
    • Easy way to examine site artifacts
    • Quick way to launch browser into site
    • SharePoint Explorer Extensibility
    • Developer can write add-ins to populate nodes and provide contextual menu commands
  • SharePoint 2010 Project Templates & Structure
    • All projects built using standard structure
    • Common Project Properties
    • Project file, Project Folder, Assembly Deployment Target, Sandboxed solution, Site URL, Startup Item
    • Standard Project Nodes
    • Properties, References, Features, Package, SharePoint Project Items (SPIs)
  • SharePoint Project Items
    Projects are built with SharePoint Items (SPIs)
    • SPI is a logical collection of project files (e.g. Web Parts, List definitions, Workflows, etc)
    • Each SPI has folder with SPI files
    • Compilation & deployment details abstracted away through SPI file properties
  • Mapped Folders
    • Mapped Folders used to deploy to RootFiles
    • Layouts folder maps to virtual path /_layouts
    • Images folder maps to virtual path /_layouts
    • Layouts folder key to creating application pages
    • Best practice to create solution-specific folders inside Layouts folder
  • Feature node and Feature Designer
    • Feature node contains one or more features
    • Feature designer provides design mode and XML text mode
    • Customize feature properties in designer and/or property grid
    • Use Context menu of feature node to add feature event receiver
    • Feature designer allows adding/removing SPIs
    • Customize feature activation dependencies
  • Project Packaging
    • Project packaging based on Package.wspdef
    • Modify package properties with designer or XML text
    • Modify package properties using property grid
    • Designer allows you to add / remove features and SPIs
  • Web Part Development
  • The past and the future
    • What is the same?
    • ASP.NET Web Parts are preferred
    • WSS Web Parts are being phased out
    • Code Access Security
    • What is changed?
    • Emphasis on feature deployed .webparts
    • More functionality offered to ASP.NET Web Parts
    • what is new?
    • Versioning
    • AJAX
    • Client Object Model
    • Cross-site scripting safeguards
    • Sandboxed solutions
    • Built on User Controls
    • Designed for Farm solution deployment
    • Great for leveraging the designer
    Web Part Development
  • Source of content
    This presentation is based on presentations and demos provided by the Microsoft SharePoint Conference 2009.
    Our gratitude goes out to Microsoft and the SharePoint Experts who made this happen.