honeymoose
/
sp-dev-fx-webparts
mirror of https://github.com/pnp/sp-dev-fx-webparts.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity
sp-dev-fx-webparts/samples/react-events-dynamicdata
History
Hugo Bernier 68f7f67761 Changed from updated to modificationDateTime 2021-05-02 15:39:42 -04:00
..
assets Changed from updated to modificationDateTime 2021-05-02 15:39:42 -04:00
config Upgraded to SPFx 1.10 2020-07-08 01:31:26 -04:00
src Upgraded to SPFx 1.10 2020-07-08 01:31:26 -04:00
teams Upgraded to SPFx 1.10 2020-07-08 01:31:26 -04:00
.editorconfig Upgraded to SPFx 1.10 2020-07-08 01:31:26 -04:00
.gitignore Upgraded to SPFx 1.10 2020-07-08 01:31:26 -04:00
.yo-rc.json Upgraded to SPFx 1.10 2020-07-08 01:31:26 -04:00
README.md Changed master to main 2021-05-02 15:04:59 -04:00
gulpfile.js Upgraded to SPFx 1.10 2020-07-08 01:31:26 -04:00
package-lock.json Upgraded to SPFx 1.10 2020-07-08 01:31:26 -04:00
package.json Upgraded to SPFx 1.10 2020-07-08 01:31:26 -04:00
tsconfig.json Upgraded to SPFx 1.10 2020-07-08 01:31:26 -04:00
tslint.json Updated Dynamic Data sample to SPFx@1.7.0 (#669) 2018-11-09 09:36:29 +02:00

README.md

Dynamic data

Sample web parts illustrating using the SharePoint Framework Dynamic data capability.

Web parts placed on a modern SharePoint page showing information about events

Used SharePoint Framework Version

SPFx 1.10

Applies to

Solution

Solution Author(s)
react-events-dynamicdata Waldek Mastykarz (MVP, Rencore, @waldekm)
react-events-dynamicdata Hugo Bernier (MVP, @bernierh)

Version history

Version Date Comments
1.2 July 8, 2020 Updated sample to SPFx v1.10.0 (Hugo Bernier)
1.1 November 9, 2018 Updated sample to SPFx v1.7.0
1.0 June 5, 2018 Initial release

Disclaimer

THIS CODE IS PROVIDED AS IS WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.

Minimal Path to Awesome

  • clone this repo
  • move to right folder
  • in the command line run:
    • npm install
    • gulp bundle --ship
    • gulp package-solution --ship
  • from the sharepoint/solution folder, deploy the .sppkg file to the App catalog in your tenant
  • in the site where you want to test this solution
    • add the app named react-events-dynamicdata-client-side-solution
    • edit a page
    • add the three web parts named: Events, Event details and Map
    • configure the Event details web part:
      • as Connect to source, choose the Events option
      • as Event's properties, choose the Event option
    • configure the Map web part:
      • get a Bing maps API key (follow the link in the web part)
      • as Connect to source, choose the Events option
      • as Event's properties, choose the Location option
      • as Address, choose the address option
      • as City, choose the city option

Features

This sample contains a set of SharePoint Framework client-side web parts that illustrate the Dynamic data capability.

Web parts in this solution illustrate the following concepts on top of the SharePoint Framework:

  • making web part a dynamic data source
  • exposing multiple data properties from a single data source
  • subscribing to dynamic data source notifications from a web part
  • deploying list instances from a SharePoint Framework solution package
  • using PnPjs to retrieve data from a SharePoint list
  • using SharePoint Framework React Controls in web parts