Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
SharePoint + CRM Saturday Zurich 2017
SharePoint Framework the new development way
Giuliano De Luca / @giuleon
#Spszurich ...
www.delucagiuliano.com
SharePoint + CRM Saturday Zurich
May 13, 2017
• SharePoint Framework
• Toolchain
• Office UI Fabric
• SharePoint Framework Considerations
• Resources
Already available on
SharePoint Online
In the future also for
SharePoint On-Prem 2016
• Tooling
• Node.js
• Yeoman
• Gulp
• TypeScript
• Visual Studio (Code)
• Frameworks – Choose yours
• React
• Angular.js
•...
IIS Express
VS Project 
New  <Template>
Tasks Purpose
gulp serve Serving the local development environment (--nobrowser is optional)
gulp build Builds the project...
Demo Hello Word Web Part
"Keep calm and use
Office UI Fabric“
- Satya Nadella
Ohh Nooo ! I’m not
a designer
Wait a minute
Giuliano, I never
said th...
708 Icons available
Fabric JS
Lightweight and
simple
components in
vanilla Javascript
Fabric IOS
Native iOS styling
and components
written in ...
Class Name Range Breakpoint
ms-u-smxx 320px - 479px Small
ms-u-mdxx 480px - 639px Medium
ms-u-lgxx 640px - 1023px Large
ms...
Demo
Azure CDN
SharePoint
Online CDN
https://publiccdn.sharepointonline.com/<tenant host name>/<ID of the public CDN origin>/<sub-path under the origin>/
SPFx solutions
are running in
the context of
user
SPFx
• Solutions are
deployed centrally as
a tenant admin
• JavaScript is executed
with the permissions
of end user
Add-in...
So I'll write my code in
typescript and do I have to
debug in javascript ? That's
not really comfortable.
Of course not, y...
https://goo.gl/iRZZd7
https://goo.gl/SEUflx
https://goo.gl/Y46vkA
https://goo.gl/NmRG7j
https://goo.gl/uXnZJd
https://goo....
SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way
SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way
SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way
SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way
SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way
SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way
SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way
SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way
SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way
SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way
SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way
SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way
SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way
Upcoming SlideShare
Loading in …5
×

of

SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 1 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 2 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 3 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 4 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 5 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 6 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 7 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 8 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 9 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 10 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 11 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 12 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 13 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 14 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 15 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 16 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 17 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 18 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 19 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 20 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 21 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 22 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 23 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 24 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 25 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 26 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 27 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 28 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 29 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 30 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 31 SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way Slide 32
Upcoming SlideShare
What to Upload to SlideShare
Next
Download to read offline and view in fullscreen.

0 Likes

Share

Download to read offline

SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way

Download to read offline

Sharepoint Framework is the new way to develop solution totally safe for your SharePoint environment and like a plus we have a new tool chain that the developers can use also on other operative systems.
Now we have the possibility to use Typescript and other popular client side framework like Angular, React and Knockout.
In this session I would like to show, how to move the first steps with SharePoint Framework.

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all
  • Be the first to like this

SharePoint Saturday Zurich 2017 - SharePoint Framework the new development way

  1. 1. SharePoint + CRM Saturday Zurich 2017 SharePoint Framework the new development way Giuliano De Luca / @giuleon #Spszurich #crmsaturday
  2. 2. www.delucagiuliano.com SharePoint + CRM Saturday Zurich May 13, 2017
  3. 3. • SharePoint Framework • Toolchain • Office UI Fabric • SharePoint Framework Considerations • Resources
  4. 4. Already available on SharePoint Online In the future also for SharePoint On-Prem 2016
  5. 5. • Tooling • Node.js • Yeoman • Gulp • TypeScript • Visual Studio (Code) • Frameworks – Choose yours • React • Angular.js • Knockout • Etc. SharePoint Framework Toolchain
  6. 6. IIS Express VS Project  New  <Template>
  7. 7. Tasks Purpose gulp serve Serving the local development environment (--nobrowser is optional) gulp build Builds the project (transpiling)  check “lib” folder gulp test Runs the unit tests if you have written any gulp bundle | gulp Build project in DEBUG mode  check “dist” folder gulp bundle --ship | gulp --ship Build project in SHIP mode / ready for distribution  check “temp” folder gulp package-solution Packages the DEBUG solution as an app package  check “sharepoint” folder gulp package-solution --ship Packages the production ready solution  check “sharepoint” folder gulp deploy-azure-storage Add the files to your Azure CDN gulp clean Cleans the project from build artifacts (remove previous builds) gulp trust-dev-cert Add a developer certificate to your client  necessary for local development gulp untrust-dev-cert
  8. 8. Demo Hello Word Web Part
  9. 9. "Keep calm and use Office UI Fabric“ - Satya Nadella Ohh Nooo ! I’m not a designer Wait a minute Giuliano, I never said this….
  10. 10. 708 Icons available
  11. 11. Fabric JS Lightweight and simple components in vanilla Javascript Fabric IOS Native iOS styling and components written in Swift AngularJS Community-driven project for Angular apps React Fabric’s robust, up-to-date components are built with React
  12. 12. Class Name Range Breakpoint ms-u-smxx 320px - 479px Small ms-u-mdxx 480px - 639px Medium ms-u-lgxx 640px - 1023px Large ms-u-xxx 1024px - 1365px Extra Large ms-u-xxxx 1366px - 1919px Extra Extra Large ms-u-xxxxx 1920px and up Extra Extra Extra Large
  13. 13. Demo
  14. 14. Azure CDN SharePoint Online CDN
  15. 15. https://publiccdn.sharepointonline.com/<tenant host name>/<ID of the public CDN origin>/<sub-path under the origin>/
  16. 16. SPFx solutions are running in the context of user
  17. 17. SPFx • Solutions are deployed centrally as a tenant admin • JavaScript is executed with the permissions of end user Add-ins • Isolated functionalities hosted either in iframe or outside of the SharePoint Script editor web part • Scripts are added on the pages by end users • Scripts can be hosted anywhere • Same with content editor web part Script embedding • Embedding scripts with Usercustomactions or JSLink • JavaScript files can be added by site owners using API • JS files hosted in the site Characteristics Centralized approval Permissions model Works on ‘no-script’ sites
  18. 18. So I'll write my code in typescript and do I have to debug in javascript ? That's not really comfortable. Of course not, you will go in debug using ever typescript.
  19. 19. https://goo.gl/iRZZd7 https://goo.gl/SEUflx https://goo.gl/Y46vkA https://goo.gl/NmRG7j https://goo.gl/uXnZJd https://goo.gl/SJ1VHW https://dev.office.com/fabric http://www.delucagiuliano.com

Sharepoint Framework is the new way to develop solution totally safe for your SharePoint environment and like a plus we have a new tool chain that the developers can use also on other operative systems. Now we have the possibility to use Typescript and other popular client side framework like Angular, React and Knockout. In this session I would like to show, how to move the first steps with SharePoint Framework.

Views

Total views

316

On Slideshare

0

From embeds

0

Number of embeds

70

Actions

Downloads

6

Shares

0

Comments

0

Likes

0

×