TypeScript and the SharePoint Framework, Better Together

I participated with PixelMill in doing this webinar on TypeScript and the SharePoint Framework. Here is the recording of the webinar. The slides are available at https://www.slideshare.net/rschouten/typescript-and-sharepoint-framework-79326529. If you have any questions don’t hesitate to reach out to me. For more information about the PixelMill webinar series go to their blog, http://blog.pixelmill.com/
Continue reading “TypeScript and the SharePoint Framework, Better Together”

SP PnP JavaScript/SPFx SIG 5-11-2017

SharePoint Development Launchpad http://dev.office.com/sharepoint

4:25 – PnP JS Core Component

  • 2.0.5 released Monday
  • Looking for feedback on new features
  • Starting to sketch out graph support
  • Exciting growth numbers for April
  • Reopen issues to continue discussions
  • https://aka.ms/SharePointPnPCommunity

7:05 – SharePoint PnP JS Core Usage Numbers

  • 18 Million requests in April

9:26 – SharePoint Framework

  • Modern Extensibility Blog Post
  • SharePoint PnP Webcast – Calling external APIs securely from SPFx
  • SharePoint Framework extensions in SharePoint page
    • Application Customizer
      • Areas in the page available to embed customizations for users
      • Can be used to add google analytics or non visible code
    • Command Set customizer
      • Used to introduce new custom actions to a list
    • Field Customizer
      • Used to customize experiences around the specific fields.
      • Currently available for only read-only scenarios, form fields coming later
    • Extensions currently only available in Modern not classic

19:48 – SPFx new Features – Vesa

  • Dev preview to start pretty soon (within weeks, not months)
  • Web part communications
    • Master and details demo
    • Communications currently done with code, UI coming later
    • Working on multiple columns – in roadmap
    • Raise event with Unique ID to SPFx
    • Details subscribes to event by Unique ID
  • Field Customizer
    • Developer has full control of the div that is being rendered
    • onRenderCell event for rendering value
  • Application customizer
    • Get placeholder by name
    • Use onRender event – *** Verify in recording
    • Have full control inside the div you are given
  • CommandSet Extensions
    • Defined command and commandIDs in manifest
  • Yeoman templates updated with extensions options – asks which type of client-side component
  • All customizers have a base class including context, etc.
  • Customizers must be deployed to app catalog
    • Security control since code is run the user’s context
  • Must enable these customizations on the fields
    • Use code or alternative options
    • Add custom action through various methods
    • Use ClientSideComponentId property and point to id of customizer
    • Field customizers add ClientSideComponentId on the field and can pass in properties through ClientSideComponnentProperties
  • No workbench for dev preview
    • Debugging enabled through querystring parameters

46:53 – SPFx Roadmap

  • Web parts GA
  • Extensions – preview soon

48:03 – Questions

  • Is SP.REquestExecutor obsolete
  • Full page apps on Roadmap – yes
  • Can use CSOM to customize groups – yes can be used to apply customizations
    • Can use CSOM, REST etc
  • Can we use GraphHttpClient to call web api or Azure Function
    • Starting with subset of scopes
    • Cannot use custom token yet
  • Plans field customizers through UI – in roadmap
  • SPFx for beginners – http://aka.ms/spfx-tutorials
  • Page layout customizations in RoadMap
    • Not explicitly part of SPFx
    • Engineering working on page layouts options

Next Meeting May 25th

Office Dev PnP – SPFx/JavaScript Special Interest Group 4/27/17

A friend of mine mentioned an idea to me that I really liked and I could definitely see the need for. He suggested that, at the moment, there is no good synopsis of what happens in the Office Dev Patterns and Practices calls that happen on a regular basis. He said he didn’t have the time to take this on but I was free to if I wanted, thank you Eric. I’ll do my best to get a synopsis published the same day as the calls. I’ll run a synopsis of all the calls for PnP.

What is Office Dev PnP?

The Office Dev PnP is an open source, community driven initiative that is backed by Microsoft and Microsoft resources. The goals are to provide tools, samples, and guidance on developing for SharePoint and Office365. There are a lot of samples in the PnP GitHub Repository. There are other repositories in this area as well if you want to contribute to the PnP.

 

Special Interest Group Calls

There are a few Special Interest Group calls relating to different areas of the Office Dev PnP. Eric Overfield does a pretty good job of explaining what these calls are and how to join them so check out his article, Participating in the SharePoint / Office 365 Dev Patterns and Practices (PnP) Community Initiative.

 

April 27, 2017 SPFx/JavaScript SIG Call

4:17 – Opportunities to Participate

  • Demo an SPFx Webpart
  • Demo sp-pnp-js in a Project
  • Contribute on GitHub
  • Provide Feedback

5:14 – PNP-Core Updates

  • 2.0.4 Released – Fixes SPFx blocking bug
  • Doing beta releases now – sp-pnp-js@beta
  • Checkout wiki and developer guide
  • Search Improvements
  • Updated React SPFx samples to work with sp-pnp-js
  • Report issues in the GitHub issues list with enough details
  • Graph support in process though early stages, discussion in issues list

11:58 – SharePoint Framework Updates

17:30 – What engineering is working on

  • New capabilities
    • Web part to web part connections – sending events
    • Modern UI extensions
      • Modern JSLink and UserCustomAction
      • Additional Yeoman templates
    • Workbench improvements
    • SPFx improvements
    • Numerous topics for both online and on-premise.
    • Working on on-premise for 2016, not 2013 at first depending on demand
  • Other
    • SharePoint document consolidation to single location eventually to docs.microsoft.com/sharepoint
      • MSDN docs will go away because the platform is super old
      • All MSDN SharePoint docs will be moved to dev.office.com/sharepoint then to final location

20:34 – Demo Vesa SPFx VS Extension http://aka.ms/spfx-vs-extension

  • Still using Yeoman for templating
  • Early alpha release available
  • Other releases coming soon
  • Template shows under the Office/SharePoint section for new project
    • Launches wizard
    • Can click generate or go to Advanced to see/modify the full yeoman command
      • -skip-install switch to skip the npm install
  • Can add more web parts
    • Add new item to project
    • Select Office/SharePoint – SharePoint Framework
    • SPFx Web Part
    • Prompted with smaller wizard
  • F5 launches gulp serve
  • Does not introduce any new templates, just uses the yeoman templating
  • Missing Features
    • Native debugging
  • This is for those that want to do SPFx in Full Visual Studio instead of VS Code

30:09 – Demo Sebastien RiotJS

  • List Viewer Web Part

Available in Github https://github.com/sebastienlevert/spfx-riot-list

  • Need riot and riot-typescript added to package.json
  • tsconfig.json add experimental decorators to true
  • Extend RiotClientSideWebPart
    • Handles the mounting to the DOM
  • Riot allows separation of view and component like Angular
  • Using await/async from TypeScript
  • Using PnP getAs ODataEntity
  • Must call update to update the ui after asynchronous calls
  • Riot also includes a router

46:08 – Open Discussion

  • Any headway with gov farm support for SPFx?
    • No dates
    • Wrong people to ask
    • Right way to find right people to ask would be to have the gov client to contact the gov farm people.

Guidance on calling external APIs, WebApi/Azure Functions early next week

Next Meeting May 11th.