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

1. Sparked goes SharePoint 2010 for developers

3. SharePoint Solution Architect

4. Work experience: WUR, Sara Lee, Flora Holland

5. @rbethleh

6. E-Mail: roelhans.bethlehem@sparked.nl

7. Alexander Meijers

8. SharePoint Solution Architect

9. Work experience: Facilicom, Logica Intranet

10. Twitter: @ameijers

13. UX Platform

14. The Ribbon

15. The Toolbar

16. Dialog Framework

17. Tools

20. Better tools for developers and designers

21. End-to-end integration with PowerShell

22. Improvements to lists and events

23. New client-side object model and runtime

24. Enhanced support for developing workflow applications

25. Development can now be done on client OS

26. New connector framework enhances Search infrastructure

27. User solutions and partially trusted code (sandboxing)What’s new?

28. UX Platform 7

30. Masterpages (dynamic) + _layouts

31. The Ribbon

32. Status Bar/Notification Area

33. Dialog Framework

34. New Theming Infrastructure

35. Silverlight Web Part

36. Client OMUX Platform Philosophy: Allow users to complete tasks quickly in context with a simple interface and reusable controls

38. Targeting WCAG 2.0 AA standards

39. Reduced use of tables

40. Cross-browser support: IE 7+, Firefox, Safari

41. Visual upgrade

42. UI upgrade separated from database upgrade (can keep V12 UI while running on V14)

43. Enhanced vs2010 project templates

44. Client OM

45. JavaScript and Silverlight wrappers for SharePoint OMUX Platform

47. Split into multiple files, only download what’s necessary for the page

48. Existing sites based on SharePoint CSS will need to be redesigned

49. JavaScript

50. Script On Demand allows delaying JavaScript download until it’s needed

51. Debug versions of files show clear JavaScript before optimizing

52. SP.* “namespace” an effort to draw a line between “public” and “internal” JavaScriptUX Platform

54. Can use “~masterurl/default.master” or “~masterurl/custom.master” tokens to reference System or Site masterpage

55. Page must derive from Microsoft.SharePoint.WebControls.LayoutsPageBase

56. Exceptions: Pages which reference simple.master

57. accessdenied, confirmation, error, login, reqacc, signout, webdeleted

58. These seven pages can be replaced using OM or PowerShellUX Platform

60. Client OM allows Silverlight or JavaScript to access SharePoint data

61. Fluid Application Model

62. App can be hosted outside of SharePoint

63. Still access SharePoint data if given permissionUX Platform

64. The Ribbon 13

66. Contextual tab model

67. Controls: near parity with Client Ribbon

68. Super tool tipsThe Ribbon

70. Split button menu

71. Static

72. Stated

73. Drop down & Flyout menus

74. Customizable

75. Hierarchical

76. Checkbox

77. ToggleButton

78. Label

79. Textbox

80. Combo box

81. Spinner

82. Table control

83. Color picker

84. In-Ribbon gallery control

85. Drop down grids can give same functionality

86. Can also “fake” it with buttons in the Ribbon15 The Ribbon

88. Remove any of the OOB controls

89. Add new controls anywhere in the Ribbon

90. Potential to replace the Ribbon entirely

91. Backwards compatible

92. Custom Actions added to Toolbars in v3 will automatically show up in the “Custom Commands” tab in the Ribbon

93. Adding a control to the Ribbon:

94. Ribbon XML defines the UI of the control

95. Simple behavior can be defined declaratively alongside Ribbon XML, more complicated behavior requires a JavaScript Page ComponentThe Ribbon

96. The Toolbar 17

98. Status bar should be used to display persistent information such as page status or version

99. Notifications should be used for transient or semi-transient messagesThe Toolbar

101. Show below Ribbon

102. Will display 1 of 5 pre-set background colors depending on importance

103. Add / Remove messages with Javascript API

104. Messsage is HTML and can include links / icons

105. Transient information

106. Appears on the right side of the page underneath the Ribbon

107. Default message will last 5 seconds

108. Add / Remove messages with Javascript API

109. Messsage is HTML and can include links / icons

110. Sticky parameter availableThe Toolbar

111. Toolbar code examples 20 Status APIs: SP.UI.Status.addStatus(strTitle, strHtml, atBeginning) SP.UI.Status.updateStatus(sid, strHtml) SP.UI.Status.removeStatus(sid) SP.UI.Status.removeAllStatus(hide) SP.UI.Status.setStatusPriColor(sid, strColor) Notification APIs: SP.UI.Notify.addNotification(strHtml, bSticky, tooltip, onclickHandler) SP.UI.Notify.removeNotification(id) The Toolbar

112. Dialog Framework 21

113. Keeping the user in the context Dialog Platform V4 UI

115. Contents load in an iframe inside a floating div

116. Dialogs are modal

117. Allow dragging within browser window

118. Can be maximized to size of browser windowDialog Framework

120. Contents can be a page (URL) or DOMElement

121. Optional parameters to set title, width, height, whether or not to launch maximized, etc

122. Design a page once to display both inside a dialog and as a full page

123. CSS class “s4-notdlg” can be used to hide UI when a page is shown within a dialogDialog Framework

124. Dialog code example 25 function myCallback(dialogResult, returnValue) { alert(“Hello World!”); } var options = { url: “/_layouts/somepage.aspx”, width: 500, dialogReturnValueCallback:myCallback }; SP.UI.ModalDialog.showModalDialog(options); Dialog Framework

125. Theming Engine 26

127. Parses CSS for comment-style markup, replaces colors/fonts and recolors images as directed

128. Automatically generates new CSS for each theme when it is applied

129. Automatically populates theme list from Theme Gallery filesTheming Engine

131. 2 FontsUser Clicks Apply NEW NEW NEW 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

132. Theming engine example 29 /* [ReplaceColor(themeColor:"Light1")] */ background-color:#fff; /* [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

133. Tools 30

135. What event handlers were fired?

136. In what sequence did these events handlers fire?

137. Alpha release needs PowerShell to enable this dashboard

138. Set –SPFarm –DeveloperDashboardEnabled

139. Set –SPFarm –DeveloperDashboardEnabled $falseTools

141. SharePoint admins/devs must learn PowerShell basics

142. You can write powerful scripts against WSS OM

143. You can develop custom PowerShell snap-insTools

145. Each SharePoint object has a summary page

146. More powerful workflow Designer

147. Reusable workflows

148. Prototypes created in SharePoint Designer can be migrated into Visual Studio 2010 (import / Export)

149. Workflow design in Visio 2010 possible

150. SharePoint Designer work exported to .WSP files (possible to import into Visual Studio 2010)Tools

152. SharePoint Explorer for site exploration

153. SharePoint 2010 project and item templates

154. Visual designers for core scenarios

155. Migration path for Visual Studio 2008 & WSS 3.0

156. Extensible by 3rd party developers (e.g. STSDEV)

157. Benefits to SharePoint Developers

158. Abstracts away details of RootFiles directory

159. Abstracts ways details of building .WSP file

160. Lessens / eliminates need for external utilitiesTools

162. Easy way to examine site artifacts

163. Quick way to launch browser into site

164. SharePoint Explorer Extensibility

165. Developer can write add-ins to populate nodes and provide contextual menu commandsTools

167. Common Project Properties

168. Project file, Project Folder, Assembly Deployment Target, Sandboxed solution, Site URL, Startup Item

169. Standard Project Nodes

171. Each SPI has folder with SPI files

172. Compilation & deployment details abstracted away through SPI file propertiesTools

174. Layouts folder maps to virtual path /_layouts

175. Images folder maps to virtual path /_layouts

176. Layouts folder key to creating application pages

177. Best practice to create solution-specific folders inside Layouts folderTools

179. Feature designer provides design mode and XML text mode

180. Customize feature properties in designer and/or property grid

181. Use Context menu of feature node to add feature event receiver

182. Feature designer allows adding/removing SPIs

183. Customize feature activation dependenciesTools

185. Modify package properties with designer or XML text

186. Modify package properties using property grid

187. Designer allows you to add / remove features and SPIsTools

188. Web Part Development 41

190. ASP.NET Web Parts are preferred

191. WSS Web Parts are being phased out

192. Code Access Security

193. What is changed?

194. Emphasis on feature deployed .webparts

195. More functionality offered to ASP.NET Web Parts

196. what is new?

197. Versioning

198. AJAX

199. Client Object Model

200. Cross-site scripting safeguards

201. Sandboxed solutions

202. Built on User Controls

203. Designed for Farm solution deployment

204. Great for leveraging the designerWeb Part Development

205. Source of content 43 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.