Call : (+91) 968636 4243
Mail : info@EncartaLabs.com
EncartaLabs

SharePoint 2019 & Office 365 - Developing SharePoint Framework Solutions (SPFx)

( Duration: 4 Days )

SharePoint Framework solutions are typically developed with Node.js, Visual Studio Code, TypeScript and JavaScript frameworks such as React or Angular. With the release of the SharePoint 2016 Feature Pack 2, its use is also partially possible on premises. In Sharepoint 2019, Modern Team Sites and Modern UI are there from the start together with SPFx. In SharePoint 2019 & Office 365 - Developing SharePoint Framework Solutions (SPFx) training course, you will learn to have a detailed knowledge about the SharePoint Framework and its use as a tool for modern SharePoint / Office 365 solutions.

By attending SharePoint 2019 & Office 365 - Developing SharePoint Framework Solutions (SPFx) workshop, delegates will learn to:

  • Know what SPFx is and how to use it
  • Know the basics of the SharePoint Framework
  • Understanding & Using Node.js & Tooling
  • Access to SharePoint data and API
  • Creating SPFx Web Parts with React
  • Using Java Script Frameworks with SPFx
  • Customizing the User Interface using Bootstrap & Office UI Fabric
  • SharePoint Framework Extensions (Command Sets, Script Injection, FieldCustomizer)
  • Testing and distribution of SPFx solutions

  • Experience with web & SharePoint development
  • Basic JavaScript (ES 6, object orientation) & TypeScript knowledge
  • SharePoint and Office 365 client side development skills: REST API, PnP JS Core, CSOM
  • Basic knowledge of Office 365, Azure AD, Graph

The SharePoint 2019 & Office 365 - Developing SharePoint Framework Solutions (SPFx) class is ideal for:

  • SharePoint developers who want to have detailed knowledge about the SharePoint Framework and its use as a tool for modern SharePoint / Office 365 solutions.

COURSE AGENDA

1

SPFx Overview

  • SharePoint Framework Introduction
  • When to use SPFx
  • Configure Tenant & Dev Environment for SPFx
  • Office 365 CLI
  • Introduction to Visual Studio Code
  • Useful VS Extensions & Chrome AddOns
2

Typescript Primer

  • TypeScript Overview & Language
  • Types, Enums & Arrays
  • Classes, Interfaces, Functions
  • Using ES6 Modules
  • Using CSOM & 3rd Party Libraries in TypeScript
  • Ensuring Browser Compatibility using Shims and Polyfills
3

Node.js & Tooling

  • Node Introduction
  • Node Version Management
  • Node Package Manager (npm)
  • Scaffolding using Yeoman SPFx Gernerator & PnP Generator
  • Implementing & Debugging Gulp Tasks
  • Bundling with WebPack
  • Linting
4

SPFx Basics

  • Project Structur & Configuration
  • Implementing Methods & Handling Events
  • Debugging SPFx im Browser & VS Code
  • SPFx Utility Classes & Methods (Page Context, Env, Logging, …)
  • Working with Properties
  • Add multiple items to a SPFx Solution
  • Working with Lookups & Taxonomy
5

Publishing SPFx WebParts

  • Building & Packaging
  • Deploying Assets with SPFx Solutions as CAML (Fields, Content Types, Lists)
  • Site & Asset Deployment using Office 365 CLI
  • Tenant Wide Deployment
  • Maintaining & Updating SPFx Solutions using Office 365 CLI
  • Deploying SPFx using Azure Dev Ops Pipes
6

React Basics

  • What is React?
  • Introduction to JSX / TSX (Syntax, Event Handling, Looping, …)
  • Components & Nesting
  • Props, State & Immutability
  • Introduction to Redux
  • State Management using Redux
7

Implementing SPFx Web Parts using React

  • Steps to implement SPFX Web Parts in React
  • First React Web Part
  • Using Reactive Components
  • Setup & Debug Unit Testing
  • Custom Property Pane Fields
  • Planning Localization
8

SPFx Unit Testing

  • Testing Overview
  • Enzyme, Mocha, Chai
  • Writing Unit Tests for SPFx
9

Consuming SharePoint Data

  • Data Access Strategies & SPHttpClient
  • CSOM vs. REST Api vs. PnP JS
  • Mocking Data for Local Workbench
  • SPFx Create, Read, Update & Delete using CSOM, REST, PnP JS
  • CAML Queries Executing CAML Queries from SPFx
  • Consuming Search API from SPFx
  • Consuming Microsoft Graph
  • Consuming External APIs
10

Customizing the User Interface

  • An introduction to The Modern UI
  • Customize Modern Team Sites
  • Implementing Custom Themes
  • Understanding and using Syntactically Awesome Style Sheets
  • Using Bootstrap in SPFx
  • Office UI Fabric Overview
  • Using Office UI Fabric Reactive Components
  • Using React Reusable Controls
11

Using JavaScript Frameworks & Plugins with SPFx

  • Importing Libraries and using Types
  • Using jQuery & Other JavaScript Plugins
  • Migrating existing JavaScript Solutions
  • Scaffolding Projects that use Vue.js & Handlebars.js
  • Using Angular JS in SPFx
  • Using Angular Elements in SPFx
12

SharePoint Framework Extensions

  • What are SharePoint Framework Extensions
  • Use ApplicationCustomizers for Global Script Injection
  • Adding Page Headers / Footers using ApplicationCustomizers
  • Customize the Display of Lists using FieldCustomizers
  • Use Command Sets to trigger Actions
  • Surfacing SPFx Solutions as Teams Tab

Encarta Labs Advantage

  • One Stop Corporate Training Solution Providers for over 6,000 various courses on a variety of subjects
  • All courses are delivered by Industry Veterans
  • Get jumpstarted from newbie to production ready in a matter of few days
  • Trained more than 50,000 Corporate executives across the Globe
  • All our trainings are conducted in workshop mode with more focus on hands-on sessions

View our other course offerings by visiting https://www.encartalabs.com/course-catalogue-all.php

Contact us for delivering this course as a public/open-house workshop/online training for a group of 10+ candidates.

Top
Notice
X