Here, you can get the information on how to master the SharePoint Framework development with the great samples. https://github.com/ktskumar/spfxsecrets-webparts

1. Secrets to master
SharePoint Framework
Shantha Kumar Thambidurai
@ktskumar | C# Corner MVP | www.ktskumar.com

2. Agenda
Development Modals Intro - SPFx
Secrets to Master SharePoint Framework
Additional Tools Q & A
www.ktskumar.com

3. SharePoint - Development Modals
www.ktskumar.com

4. Legacy Modal
Full Trust Code Sandbox Solution
Add-Ins JavaScript Injection
www.ktskumar.com

5. Future Modal
Full Trust Code Sandbox Solution
Add-Ins JavaScript Injection
- Online
Remote Code Execution SharePoint Framework
www.ktskumar.com

6. Intro – SharePoint Framework
www.ktskumar.com

7. Full Trust Client Side Solution
Webpart Extensions
www.ktskumar.com

8. Secrets to Master SharePoint
Framework
www.ktskumar.com

9. Understand the Toolchain
TypeScript Visual Studio Code Terminal
www.ktskumar.com
NODE JS NPM
GULP YEOMAN

10. Build for Environment
www.ktskumar.com
SharePoint On-PremiseSharePoint Online
Web parts
SP 2016 (Feature 2)
SP 2019
Site Collection Catalog
Web parts
Extensions
Tenant App Catalog
V1.6 SPFx

11. Choose the Framework
React Knockout
Pure JavaScript
www.ktskumar.com
More…

12. Know the Deployment Scopes
www.ktskumar.com
Tenant App Catalog SiteCollection Catalog
N Y

13. DEMO
www.ktskumar.com

14. Artifacts Deployment
Azure Blob Storage Azure CDN
Office 365 Public CDN SharePoint CDN
www.ktskumar.com

15. Manage external libraries
JavaScript Cascading Style Sheets
www.ktskumar.com
spcomponentloaderExternals in Config.json
Import the external file

16. DEMO
www.ktskumar.com

17. How to use Dynamic Loading…
Multiple Webparts 3rd Party Components
www.ktskumar.com
import * as moment from moment;
export default class MyClass {
public GetTime(dateString:string){
const moment = await import(
'moment'
);
return moment(dateString).format("LL");
}
}

18. Build Tasks
Serve build
www.ktskumar.com
clean trust-dev-cert
bundle Package-solution

19. Additional Tools
www.ktskumar.com

20. More Tools…
www.ktskumar.com
PnP JS PnP React Controls
Office 365 CLI PnP SPFx Yo Generator
ALM APIs Azure DevOps

21. DEMO
www.ktskumar.com

22. Q & A
www.ktskumar.com

23. Enjoy the Bootcamp
www.ktskumar.com

24. Call to action
Join Office 365 developer program
https://dev.office.com/devprogram
to leverage all resources for Office 365
development learning
Build applications on Office 365 platform
Attend MVP led local community events to
continue learning on Office 365 development
Share your feedback on Bootcamp at
https://aka.ms/o365devbootcampfeedback
www.ktskumar.com