sp-dev-fx-webparts/samples/react-word-game
Hugo Bernier eb8bd92a0b Updating telemetry link 2021-12-20 10:25:30 -05:00
..
assets Removing unnecessary office product from the sample metadata 2021-12-10 19:55:32 +02:00
config Adding PnP identifier for the MPN ID entries in samples - distinct sample usage in production 2021-01-07 14:51:39 +02:00
src upgrade to v1.11.0 2020-11-04 10:29:02 -06:00
teams upgrade to v1.11.0 2020-11-04 10:29:02 -06:00
.editorconfig New Sample - React Word Game 2020-05-27 21:25:22 -04:00
.gitignore New Sample - React Word Game 2020-05-27 21:25:22 -04:00
.yo-rc.json upgrade to v1.11.0 2020-11-04 10:29:02 -06:00
README.md Updating telemetry link 2021-12-20 10:25:30 -05:00
gulpfile.js New Sample - React Word Game 2020-05-27 21:25:22 -04:00
package-lock.json Fixed readme 2020-11-04 23:13:31 -05:00
package.json upgrade to v1.11.0 2020-11-04 10:29:02 -06:00
tsconfig.json upgrade to v1.11.0 2020-11-04 10:29:02 -06:00
tslint.json New Sample - React Word Game 2020-05-27 21:25:22 -04:00

README.md

Word Game

Summary

A fun game where you unscramble the words before the time runs out. It stores everyone's high scores in a SharePoint List on the Site.

Word Game Preview

Compatibility

SPFx 1.11 Node.js v10 Compatible with SharePoint Online Does not work with SharePoint 2019 Does not work with SharePoint 2016 (Feature Pack 2) Local Workbench Compatible Hosted Workbench Compatible

Applies to

Prerequisites

  • SharePoint Online Tenant or SharePoint 2019 On Prem

Solution

Solution Author(s)
react-word-game Neil Barkhina (www.neilb.net)
react-word-game Don Kirkham (@DonKirkham)

Version history

Version Date Comments
1.0 May 27, 2020 Initial release
2.0 Nov 4, 2020 Upgrade to SPFx v1.11.0 (Don Kirkham)

Minimal Path to Awesome

  • Clone this repository
  • In the command line run:
    • npm install
    • gulp serve
    • If you haven't trusted your dev cert yet run
      • gulp trust-dev-cert
  • To Deploy it in your SharePoint Environment
    • gulp --ship
    • gulp package-solution --ship
    • Upload the .sppkg file from the sharepoint\solution folder into your App Catalog

Features

This demonstrates how you can create a fun game to play with your SharePoint peers. It was built using React and also uses jQuery to help load the Word List. It demonstrates these features:

  • SharePoint REST API's
    • Creating List and List Items API
    • Creating columns in a SharePoint List
  • Web Part Property Pane Settings
  • CSS Styling and Animations
  • Fun and engaging UX
  • Responsive Design

If you want to disable the high scores feature you can edit the Web Part Settings. The Web Part stores the high scores in a SharePoint List that it creates called WordGameList. You can also change the Game Title in the settings:

Settings

It also uses responsive design which works great on the SharePoint Mobile App:

Mobile

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.