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.

Sppp presentation

212 views

Published on

Yeoman generator for SharePoint - lets you quickly set up a project with sensible defaults for pulling and pushing files between SharePoint asset library and local projects sources.
Generated project allows immediately start developing SharePoint client-side solutions in Visual Studio Code or any other editor with instant publishing changes to SharePoint web site*

* from github.com/koltyakov/generator-sppp

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Sppp presentation

  1. 1. SharePoint Push and Pull (SPPP) Denis Molodtsov Point Alliance
  2. 2. VSCode + SPPP
  3. 3. Tools Survey jQuery NPM Gulp Yeoman React or Angular or any modern framework
  4. 4. Why SharePoint Designer is a bad idea No source control • When you need to put something to source control, what is it going to be? 1 No devops process • How to move from Dev to Staging to Prod? What if we have 3 dev environments? 2 Terrible code editor tool • It’s slow, unreliable, has no modern dev tools. 3 Hard to collaborate • How do you share code with your team members? Do you just copy-paste files? 4
  5. 5. What is SPPP Yeoman generator for SharePoint - lets you quickly set up a project with sensible defaults for pulling and pushing files between SharePoint asset library and local projects sources. Generated project allows immediately start developing SharePoint client-side solutions in Visual Studio Code or any other editor with instant publishing changes to SharePoint web site* * from github.com/koltyakov/generator-sppp
  6. 6. SPPP
  7. 7. What you can do with SPPP Task Master pages + Page Layouts + Webparts + (using CEWP) Single Page Applications (SPA) + Custom forms of any kind + Timer Jobs - Event Receivers - Office store apps - SharePoint framework webparts -
  8. 8. SharePoint -hosted app Provider- hosted app Farm solution SPPP generator SharePoint Framework SP Designer PowerApps+ MSFlow Timer Jobs Event Receivers - + + - - - - Master Pages + - + ++ - - - Page Layouts + - + ++ - - + Custom Forms ++ ++ ++ ++ + - + Office Store + + - - - - - Automated deployment + + + + + - - - Web parts + + + ++ + - - - Modern pages customizations - ? - ? - - + - - * “-” means that it’s not a good idea to use the tool for the task. Or it’s simply impossible. “++” means this tool is good for the task ** Not mentioned: Webhooks, Remote event receivers, InfoPath, console apps, Scheduled PowerShell scripts, Azure functions, Nintex, K2, etc. What to use when
  9. 9. Demo: Advanced customizations with SPPP
  10. 10. Creating New Project • Install Node.js • Install VSCode (recommended) • npm install –g gulp yo generator-sppp • yo • gulp watch
  11. 11. Demo: new SPPP project
  12. 12. Demo: create SPA
  13. 13. Cleaning up existing customizations Source Control Add the project to source control Pull Pull existing files with `gulp pull` SPPP Create new project with SPPP yeoman generator
  14. 14. How to transition to SPPP • Stop using Script Editor Webparts • Store all customization files in the root site collection • Store customizations in a single library
  15. 15. Demo: sorting out existing project
  16. 16. Demo: CEWP
  17. 17. Demo: create custom master page
  18. 18. SPPP works great with Classic Farms Solutions
  19. 19. List of demos Decision tree (GIT) https://github.com/Zerg00s/customTree Custom Home page (GIT) https://github.com/Zerg00s/customHome Reception (GIT) https://github.com/Zerg00s/customSPA Material Angular lists (GIT) https://github.com/Zerg00s/splists-material Autogenerate your angular form (GIT) https://github.com/Zerg00s/AngularForms
  20. 20. Essential recommendations • Learn JavaScript basics • Learn jQuery basics • Learn concept of promises • Pick a modern framework: • React/Angular or similar • Learn npm basics – node package manager • Learn gulp basics • Git version control • Read about yeoman generators • sppp: https://github.com/koltyakov/generator-sppp • @microsoft/sharepoint: https://docs.microsoft.com/en- us/sharepoint/dev/spfx/toolchain/scaffolding-projects-using-yeoman-sharepoint-generator
  21. 21. Advanced recommendations • PowerShell PnP • PnP-Js-Core
  22. 22. Demo AngularJs Forms generator! • https://github.com/Zerg00s/AngularForms
  23. 23. Questions?

×