---
title: SharePoint Framework (SPFx)
description: SharePoint Framework (SPFx) — Application Development Basics (SPO_DEV_1) This five‑day hands‑on training gives participants a thorough introduction to modern SharePoint Framework (SPFx) development for Microsoft 365. You will learn how to build clie…
url: https://www.malachis.eu/en-US/courses/course-gopas-spodev1
modified: 2026-03-03
---

## SharePoint Framework (SPFx) — Application Development Basics (SPO\_DEV\_1)

This five‑day hands‑on training gives participants a thorough introduction to **modern SharePoint Framework (SPFx) development** for Microsoft 365. You will learn how to build client‑side web parts using **React**, **Fluent UI**, and modern TypeScript/JavaScript practices, how to access data via **REST**, **PnPjs**, and **Microsoft Graph**, and how to apply performance and security best practices in real projects.

_A 5‑day introductory development course delivered exclusively for_ [_GOPAS_](https://www.gopas.eu/sharepoint-framework-%28spfx%29--application-development-basics_spo_dev_1)

### Course Overview

The course covers:

-   SPFx development environment setup
-   Project structure and toolchain fundamentals
-   Deployment and packaging
-   Performance tuning & caching approaches
-   Integration with React UI libraries (including KendoReact)
-   Automation and recommended engineering workflows

### Who Should Attend

This course is designed for:

-   Front‑end developers working with Microsoft 365
-   Developers transitioning from classic SharePoint solutions to modern SPFx
-   Power users moving into structured application development

### Prerequisites

Participants should have:

-   HTML/XHTML & CSS fundamentals
-   JavaScript basics (equivalent to GOPAS JS\_PROG1)
-   TypeScript basics (equivalent to JS\_TS1)
-   Optional / advantageous:
    -   Basic React knowledge
    -   Understanding of SharePoint lists and libraries

### Training Format

-   5 days of instructor‑led training
-   Practical labs for every module
-   Real‑world SPFx development workflow
-   Tooling coverage: Node.js LTS, Yeoman, Gulp/Heft, package managers
-   Sample solutions and best‑practice patterns

* * *

### What You Will Learn

#### 1\. Modern SPFx Platform Overview

-   SharePoint evolution and modern development approaches
-   SPFx positioned against Add‑ins, Power Platform, and Teams development
-   Multi‑tenant boundaries in Microsoft 365

#### 2\. Development Environment & Toolchain

-   Node.js LTS, npm / pnpm / Yarn
-   Yeoman, Gulp, configuration files (tsconfig.json, serve.json)
-   Using fnm/nvm for Node version management
-   Recommended global tools & packages

#### 3\. First Web Part & Project Structure

-   SPFx project anatomy
-   Entry points, manifests, localization
-   Property pane basics & live reload
-   Dynamic property pane configuration and validation

#### 4\. React & Fluent UI Integration

-   Supported versions and compatibility guidance
-   Functional components, hooks, theming, accessibility
-   Optional helper packages for UI patterns
-   Fluent UI theming vs. custom styling

#### 5\. Bonus Module: KendoReact Integration

-   Overview of the KendoReact commercial UI library
-   Installation, theme configuration
-   Using KendoReact Grid with SharePoint list data
-   Notes on performance, package size, and design alignment

#### 6\. Data Access: REST, PnPjs & Microsoft Graph

-   SPHttpClient vs AadHttpClient vs MSGraphClientFactory
-   API batching, projection, error handling
-   When to choose REST vs Graph vs PnPjs

#### 7\. Performance & Caching

-   Package analysis, bundle splitting, lazy loading
-   Caching strategies: in‑memory, session, PnPjs caching, IndexedDB
-   Reducing load time and improving rendering performance

#### 8\. SPFx Extensions & Deployment Automation

-   Application customizers, list view command sets, field customizers
-   Packaging & bundling for production
-   Deployment pipelines & automation considerations
-   Using tenant‑level app catalogs

#### 9\. Security Best Practices

-   Permissions and access considerations
-   Multi‑tenant safety constraints
-   Secure API calls & identity handling
-   Validations, sanitization, and safe coding patterns

* * *

### Outcomes & Deliverables

Participants will learn to:

-   Build production‑ready SPFx web parts
-   Integrate React + Fluent UI in modern M365 solutions
-   Securely access Microsoft 365 data via REST / PnPjs / Graph
-   Apply performance optimization & caching patterns
-   Package, deploy, and maintain SPFx solutions efficiently