Latest SharePoint Framework (SPFx) topics
All the latest SharePoint Framework (SPFx) pages on this site.
The SharePoint Framework is the latest development model for customizing and extending SharePoint. The SharePoint Framework (SPFx) is a page and web part model that provides full support for client-side SharePoint development, easy integration with SharePoint data, and extending Microsoft Teams. With the SharePoint Framework, you can use modern web technologies and tools in your preferred development environment to build productive experiences and apps that are responsive and mobile-ready.
- Published on
Blog: Use Different Versions of TypeScript in SPFx projects
SharePoint Framework (SPFx) projects are written in TypeScript. For a while, developers were stuck using the version of TypeScript specified by Microsoft with each SPFx release. In the SPFx v1.8 release, the version of TypeScript was decoupled from the project so that now you can use any version you like, provided there’s a supported option. In this post, I’ll explain how this works, what versions of TypeScript you can use and how to implement it in your project.- Published on
Blog: State of SharePoint Client Side Development | December 2020
As we near the end of 2020, I wanted to take a look at where we are with respect to the State of SharePoint Client-Side Development. In this post, I’ll give you an update on where we are with popular frameworks and tools developers use in the client-side SharePoint development world.- Published on
Blog: Announcing our upcoming course: Microsoft 365 Certified Developer MS-600 Exam Prep
In early September 2017, I announced Voitanos’ first course to be published. A little over three years later, I’m excited to share with you today the news on my next course that’s currently in the works!- Published on
Blog: Join me at the Microsoft 365 Collaboration Conference - learn the SharePoint Framework in my half-day workshop
Join me for a half-day virtual workshop at the Microsoft 365 Collaboration Conference to get up to speed on the SharePoint Framework.- Published on
Blog: How does the SharePoint Framework (SPFx) work?
Have you ever wanted to know how the SharePoint Framework works? How do your components get added to the page? What’s with that extra manifest file? In this post, I’ll answer all those questions!- Published on
Blog: Who and Where can the SharePoint Framework (SPFx) be used?
When evaluating the SharePoint Framework, you need to determine not just what you can do, but if your SharePoint environment supports specific customizations and where you can apply those customizations.- Published on
Blog: When did Microsoft introduce (and release) the SharePoint Framework (SPFx)?
How long has the SharePoint Framework been around? When was it first released? What were some of the major milestones in the history of the SPFx? It’s all here!- Published on
Blog: Why did Microsoft create the SharePoint Framework (SPFx)?
As SharePoint evolved over time into the product we have today, Microsoft iterated over development models until they found one that worked for both developers & Microsoft alike.- Published on
Blog: What is the SharePoint Framework (SPFx)?
Ever wondered what the SharePoint Framework is? Ever asked yourself “what can I build with the SharePoint Framework?” You’re in luck because that’s what this comprehensive article answers! This article assumes you don’t have to have any prior knowledge or experience with the SharePoint Framework.- Published on
Blog: SharePoint Framework Five "W"s & 1 "H" Answered - Overview
This post introduces our post series “SharePoint Framework Five Ws Answered”. In this series, Andrew Connell answers the classic “five-W” questions developers have for the SharePoint Framework: what, why, when, who, where and how.- Published on
Blog: SPFest Virtual SharePoint Framework Workshop September 2020
I’ve been working with the great folks at SharePoint Fest to put together a virtual workshop solution! Are you a SharePoint Framework developer? If you’re looking to level-up your SharePoint Framework skills for the enterprise, this workshop is for you!- Published on
Blog: SharePoint Framework Summer 2020 Wish List
It’s that time again! Time for another installment of our SharePoint Framework summer 2020 wish list! What’s on your list?- Published on
Blog: Mastering SharePoint Framework Content Complete (preview pricing expires July 1)
Today marks a big milestone. Sprint 19 is complete and published - it contains the final two chapters published in my Mastering the SharePoint Framework Ultimate bundle!
The first of these chapters, Sharing Code between SharePoint Framework Solutions, explains and demonstrates how to use either SPFx library components or npm packages to share code across SPFx projects. The other chapter, Property Panes for Client-Side Web Parts: Create Property Controls, demonstrates how to create custom property pane controls for web part projects.
- Published on
Blog: NOW AVAILABLE: Mastering SharePoint Framework Continuous Monitoring Azure Application Insights Chapter Published
Today I published a new chapter to the Ultimate bundle of my Mastering the SharePoint Framework course. This new chapter, DevOps: Monitoring & Telemetry with Azure Application Insights, is immediately available to all existing Ultimate bundle subscribers!
Info: DevOps: Monitoring & Telemetry with Azure Application InsightsDevelopment teams and organizations are always looking for ways to automate, streamline, and improve processes related to building software. SharePoint Framework development teams are no different. This process usually brings together development and operations, commonly called DevOps, to continually provide value to customers. DevOps is comprised of multiple practices and components. One aspect of DevOps is continuous monitoring.
- Published on
Blog: NOW AVAILABLE: Mastering the SharePoint Framework - CI/CD with GitHub Actions & Azure Pipelines for SPFx projects chapter
Yesterday I published a new chapter to the Ultimate bundle of my Mastering the SharePoint Framework course. This new chapter, DevOps: CI/CD with GitHub Actions & Azure Pipelines, is immediately available to all existing Ultimate bundle subscribers!
Info|: DevOps: CI/CD with GitHub Actions & Azure PipelinesDevelopment teams and organizations are always looking for ways to automate, streamline, and improve processes related to building software. SharePoint Framework development teams are no different. This process usually brings together development and operations, commonly called DevOps, to continually provide value to customers. DevOps is comprised of multiple practices and components. One aspect of DevOps is continuous integration (CI) and continuous delivery (CD).
- Published on
Blog: Get Microsoft 365 Developer Certified - FREE webinar series!
On Wednesday, April 22, I presented the webinar Get Certified! Overview of the MS-600 exam & Microsoft 365 Developer Associate Certification with Rencore & Waldek Mastykarz. Rencore has posted the recording of the webinar as well as a link to the slides if you weren’t able to join us live or you want to re-watch it. Click here to access the recording.
In that webinar I hinted there was more coming - I’m excited to share with you a new webinar series I hosted in May 2020, and all the recordings are available now!
- Published on
Webinar: BONUS Behind the Scenes: Making of the MS-600 exam & Microsoft 365 Developer Associate Certification
Microsoft released a new certification in November 2019 for Microsoft 365 developers. The Microsoft 365 Certified: Teams Application Developer Associate certification measures developers across five (5) primary workloads in Microsoft 365. Developers must pass a single exam, the MS-600: Building Applications & Solutions with Microsoft 365 Core Services, to achieve this certification.
Andrew Connell, a Microsoft 365 Development MVP, was deeply involved in working with Microsoft as they created the certification, exam, and associated materials. In this webinar, Andrew walks you through behind the Scenes: Making of the MS-600 exam & Microsoft 365 Developer Associate Certification (webinar recording), one of the five workloads the MS-600 exam will test you on. You’ll learn what topics are covered, what you need to focus on, what resources are available to you, and have an opportunity to ask questions. This isn’t an exam prep or some shortcut to pass the exam.
- Published on
Webinar: Get Microsoft 365 Dev Certified! Explore SharePoint
Microsoft released a new certification in November 2019 for Microsoft 365 developers. The Microsoft 365 Certified: Teams Application Developer Associate certification measures developers across five (5) primary workloads in Microsoft 365. Developers must pass a single exam, the MS-600: Building Applications & Solutions with Microsoft 365 Core Services, to achieve this certification.
Andrew Connell, a Microsoft 365 Development MVP, was deeply involved in working with Microsoft as they created the certification, exam, and associated materials. In this webinar, Andrew walks you through Microsoft SharePoint, one of the five workloads the MS-600 exam will test you on. You’ll learn what topics are covered, what you need to focus on, what resources are available to you, and have an opportunity to ask questions. This isn’t an exam prep or some shortcut to pass the exam.
- Published on
Webinar: Learn about the Microsoft 365 Dev Associate cert & MS-600 exam with me
Late last year, Microsoft introduced a new certification for developers working in the Microsoft 365 space. The Microsoft 365 Certified: Teams Application Developer Associate is intended to measure & certify someone can “design, build, test, and maintain applications and solutions that are optimized for the productivity and collaboration needs of organizations using the Microsoft 365 platform”.
In order to achieve this certification, you must pass a single exam: Exam MS-600: Building Applications and Solutions with Microsoft 365 Core Services.
- Published on
Blog: Join me for SharePoint Framework Mini Summit, a FREE online event and May the 4th be with you!
After years of galactic chaos, SharePoint developers have finally realized the importance of building their SharePoint solutions with SPFx. With the Force awakened, the SharePoint community seeks solace with their PnP masters! Join me on May 4th with Elio Struyf, Waldek Mastykarz, and Vesa Juvonen, for a 3.5 hour SharePoint Framework mini-summit and May the 4th be with you!- Published on
Blog: Fixing the default SharePoint Framework v1.10 web part code formatting
Have you noticed since installing the Yeoman generator for SharePoint, when you add a web part to a new or existing project and specify the “No JavaScript framework” option, you get a web part who’s
render()
method’s indentation is all messed up like this?// omitted for brevity... export default class HelloWorldWebPart extends BaseClientSideWebPart <IHelloWorldWebPartProps> { public render(): void { this.domElement.innerHTML = ` <div class="${ styles.helloWorld }"> <div class="${ styles.container }"> <div class="${ styles.row }"> <div class="${ styles.column }"> <span class="${ styles.title }">Welcome to SharePoint!</span> <p class="${ styles.subTitle }">Customize SharePoint experiences using Web Parts.</p> <p class="${ styles.description }">${escape(this.properties.description)}</p> <a href="https://aka.ms/spfx" class="${ styles.button }"> <span class="${ styles.label }">Learn more</span> </a> </div> </div> </div> </div>`; } protected get dataVersion(): Version { return Version.parse('1.0'); } // omitted for brevity...
This is frustrating, but it’s very easy to fix.
- Published on
Blog: Update to my Azure Pipelines Templates for SPFx Projects (v1.3.0)
I’ve updated our Azure Pipelines Templates for SharePoint Framework projects earlier today. This release, v1.3.0, includes a few improvements and updates.
These updates are packed into two releases, v1.2 & v1.3. They are broken up so if you aren’t interested in v1.3, you can configure your pipeline to use just the 1.2 release which includes a specific fix / enhancement.
What’s new
The two releases include three updates & two minor changes to the project. If you want to use the latest version of the templates in your pipelines, just reference the repo as you’ve done in the past. This will default to the master branch.
- Published on
Blog: SharePoint Framework State of the Union (Fall 2019) from Microsoft Ignite 2019
In this article, I summarize the state of the union for the SharePoint Framework (SPFx) & include what we leared at the recent Microsoft Ignite conference.- Published on
Blog: SharePoint Framework State of the Union (Fall 2019) from Microsoft Ignite 2019
Like previous years, Microsoft delivered a session at the Microsoft Ignite 2019 conference that was essentially the “State of SharePoint Framework”. This session, BRK3071 - SharePoint Framework: What’s new and what’s next, started with a review of what the SharePoint Framework (SPFx) is and where it can be used. The second half of the session covered what’s coming next with SPFx, both in the short & long term. In this post, I’ll recap what was shared and share my thoughts.
- Published on
Blog: SharePoint 2016, 2019 & SharePoint Online: Which Version of the SharePoint Framework Should You Install?
Customers can leverage the SharePoint Framework (SPFx) in any of the modern or recent SharePoint versions. This includes SharePoint Online & SharePoint on-premises versions SharePoint Server 2016 & SharePoint Server 2019. To build a SPFx project, you use the Yeoman generator for the SharePoint Framework to create your project and get started. But there seems to be some confusion on which version you should install depending on your target SharePoint environment. Let’s clear this up, once and for all.
- Published on
Blog: Jest Preset Update October 2019
Late last year I published a few Jest presets to simplify adding automated testing to your SharePoint Framework (SPFx) projects. These are complete with example tests including testing the rendering of components, testing async functions using promises or callbacks and even simulating user events. You can learn more about the presets in the original post, Enable Jest testing of SharePoint Framework Projects in One Simple Step. In this post, I want to share some updates to the presets that have been published.
- Published on
Blog: Dealing with Undefined 'this' in React Event Handlers in a Performant Way
When I’m teaching React to developers, one thing that comes up often is dealing with a common error. But here’s the interesting thing: it’s not running into the error that comes up all the time, its how to deal with it that surprises them. I’ve always wanted to have something to point to that the scenario & why one option is better than others, even though there are plenty of ways to address the issue. That’s what this post is!
- Published on
Blog: Automate Building, Testing and Deploying SharePoint Framework Projects with Azure Pipelines in Four Steps
In just four simple steps, this post will show you how to automate the build, test & deployment to SharePoint Online of any SharePoint Framework project using Azure Pipelines. I guarantee you can have it done before your coffee is ready! Seriously… go get the pot going and come back to this post.
DevOps is all the rage these days. Developers throw it in resumes left and right & the recruiters are always searching for someone who can check that box. But what’s funny is like every other hot term these days, people use the term for everything.
- Published on
Blog: SharePoint Framework Summer 2019 Wish List
I originally intended to write this post mid-summer, but just never happened. Thankfully my wish list hasn’t changed for the SharePoint Framework (SPFx) since the spring of this year… wait, maybe that isn’t a good thing?- Published on
Blog: The Good, Bad & the Ugly: Using Angular Elements with the SharePoint Framework
In this series, I showed you how to build custom elements, a native web technology supported natively by most browsers (except you Edge & IE…) and presented two options for how you can go about it. One option involves using one big project with the SharePoint Framework & Angular in it while the other utilizes two projects to mitigate the downsides of the one-project approach. So, you can now use Angular in SharePoint Framework projects and this is made possible by Angular Elements which was introduced in Angular v6 back in May 2017. Sweet! We’ve got the “can you do it” question answered! But, should you do it? There are always tradeoffs when picking a web framework for your next project and using one with the SharePoint Framework is no different. Let’s take a step back and look at the whole picture. Only then can you decide if it makes sense for you.- Published on
Blog: Using Angular Elements in SharePoint Framework Projects
This has been a long time coming and many of you Angular developers who also work with the SharePoint Framework may have given up by now and switched to React, but for those of you who have been holding out, Angular is finally a viable option for SPFx development even with a few drawbacks.- Published on
Blog: Leveraging the Webpack Define Plugin in SPFx Projects
Here’s a post that teaches you a technique that you can start leveraging in your SharePoint Framework (SPFx) projects right away! You know those projects where you have certain values you use in development or testing while others that you use in production? This would include things like different account or IDs used for telemetry services, different endpoints to sample or production data that you’re interacting with in your project.
- Published on
Blog: SharePoint Framework v1.8.2 (and v1.8.1) - What's in the Latest Release
Earlier this week, on Tuesday, May 7, 2019, Microsoft released v1.8.2 of the SharePoint Framework (SPFx). A little over a month ago, I wrote about the v1.8.0 release. Since then we had another minor release (v1.8.1) released on April 16, 2019.
In this post, I’ll summarize what you can find, and share some additional details I found after spending some time picking apart the last two minor releases.
- Published on
Blog: Mastering the SharePoint Framework - Sprint 16 adds SPFx with Teams, SPA's and Tons of Updates
I’m excited to share this latest update to my course, Mastering the SharePoint Framework for developers. This update, packaged as sprint 16, includes one new chapter and a LOT of updates. When I originally planned out sprint 16, I intended to record a lot of new content. However when the SPFx v1.8.0 release came out there were enough changes to SPFx that I decided to go back and update the course, including adding some new lessons, completely re-recording existing lessons and updating quite a few lessons (both video & notes).- Published on
Blog: SharePoint Framework v1.8.0 - What's in the Latest Release
In this post, I’ll summarize what you can find, and share some additional details I found after spending some time picking apart this latest release of SPFx.- Published on
Blog: Mastering the SharePoint Framework - Sprint 14+15 Go Live Party Recording!
Earlier today I recorded an impromptu Facebook Live video for the recent release of sprints 14 & 15 of the SharePoint Framework. Usually, I let people know about these ahead of time but travel the last few weeks has been rough. Add up issues with production targets that were externally influenced by other people’s schedules, attending the Microsoft 2019 Global MVP Summit & a brief business conference in Las Vegas… I didn’t want to wait any longer.
- Published on
Blog: Leverage Custom Permissions in Entra ID Applications
In my last post, Securing an Azure Function App with Entra ID - Works with SharePoint Framework!, I showed how you can secure a REST API deployed as an Azure Function App using Microsoft Entra ID. This comes in quite handy when you want to secure some custom server-side business logic that’’s called from a SharePoint Framework (SPFx) client-side solution. The SPFx docs show how to use APIs with permissions to the Microsoft Graph. This post will explain how to add custom permissions to the AzureAD application that is used to secure your Azure Function.- Published on
Blog: Securing an Azure Function App with Entra ID - Works with SharePoint Framework!
I recently published a new chapter in my Mastering the SharePoint Framework on-demand course for developers that included a section that showed how to call a REST API deployed using an Azure Function App and secured with Entra ID from the SharePoint Framework. When I was working on this chapter, it felt like the process of configuring an Azure Function App to be secured with Entra ID was harder and more complex than it should have been. Specifically, some of the things you do aren’t explained as well… so I decided to blog about it here!- Published on
Blog: Beware of Declarative Permissions in SharePoint Framework Projects
Developers can declare permissions in SharePoint Framework projects, but it isn’t a good idea. In this article I explain why and suggest a better approach.- Published on
Blog: Mastering the SharePoint Framework Sprint 13 Published with over 3hrs of Microsoft Graph & Entra ID Lessons!
I’m excited to share this latest update to my course, Mastering the SharePoint Framework for developers. Today’s update, packaged as sprint 13, includes two new chapters and a few updates… and it’s a huge release… the biggest yet adding over 3 hours of new content!
Sprint 13 also marks a milestone: the Fundamentals Bundle of the course is now content complete! This means all planned chapters are now published. I will continue to make edits to existing chapters updating content when circumstances warrant, but at this time no new chapters or lessons are planned.
- Published on
Blog: Enable Jest testing of SharePoint Framework projects in one simple step
Setting up projects to use Jest, especially to test the rendering of your ReactJS SharePoint Framework projects & use the popular tool Enzyme for testing rendering, isn’t a trivial task, until now!- Published on
Blog: Testing SPFx Projects Efficiently with Minimal Distractions: Wallaby.js
Learn what I use and how I configure my SharePoint Framework projects to continuously run my unit tests efficiently and minimize distractions so I can focus.- Published on
Blog: Package Manager Inconsistencies with React & tslint + Workarounds after Updating to SPFx 1.7
The latest version of the SharePoint Framework (SPFx) released a few weeks ago, v1.7.0, uncovered a few issues between how the various Node.js package managers work. These issues appear to be rooted in the package tslint and came about with a change in how Microsoft was using tslint under the covers from SPFx v1.6 to v1.7.
A fix has been submitted to tslint, but they appear to be lagging on their release schedule so there’s no ETA on when it will get rolled out.
- Published on
Blog: SharePoint Framework v1.7.0 - What's in the Latest Release
In this post, I’ll summarize what you can find, and share some additional details I found after spending some time picking apart this latest release of SPFx.- Published on
Blog: Don't freak out by vulnerabilities after running npm install
I have seen questions since the folks at npm added an automatic scan for vulnerabilities after every npm install. In my opinion you shouldn’t be alarmed.- Published on
Blog: Mastering the SharePoint Framework - Course update November 2018 (sprint 12 complete)
This month’s update on my Mastering the SharePoint Framework course features the transition from one sprint to the next.
Sprint 12 Complete
I published the final pieces of Sprint 12 this week. This includes a new chapter in the Ultimate Bundle, new lessons in two Fundamentals Bundle chapters and a bunch of fixes! Want to get the details? Join me on Facebook Live for a sprint release party tomorrow, Thursday, November 1 at 1pm ET to see what’s in sprint 12 & get a sneak peek to what is planned for sprint 13, Black Friday/Cyber Monday deals & more!
- Published on
Blog: Mastering the SharePoint Framework - Course Update September 2018 (Sprint-11 complete)
This month’s update on my Mastering the SharePoint Framework course features the transition from one sprint to the next.
Sprint 11 Complete
Earlier this week, I published the final pieces of Sprint 11. Two new chapters, the first chapters in the Ultimate Bundle! I also hosted the first Facebook Live sprint release party this week… if you missed it, you can get access to the recording here: Voitanos @ Facebook Live
- Published on
Blog: HowTo: Angular Elements in SharePoint Framework Projects - Two Projects
In my last post, I talked about using Angular Elements in SharePoint Framework projects. That post showed how to do this using a single SharePoint Framework Project. In this post, I show you a much better option that uses two projects.- Published on
Blog: HowTo: Angular Elements in SharePoint Framework Projects - One Big Project
In my last post, I talked about using Angular Elements in SharePoint Framework projects. When doing this, you have two options on how you will implement this and in this post, I will talk about doing it in one big project that includes everything. In tomorrow’s post, I’ll show you a much better option that uses two projects.- Published on
Blog: Mastering the SharePoint Framework - Course Update July 2018 (Sprint-10 complete)
In this post, learn what’s new with our flagship course, Mastering the SharePoint Framework, in Sprint 10, and what’s coming in Sprint 11!