React or Angular and SharePoint Framework Development

React or Angular and SharePoint Framework Development Darin Dickey SharePoint Saturday February 9, 2019

Exploring a SharePoint Framework Project 1. Client-side Web Parts Review 2. Supported Libraries and Frameworks 3. Pure JS vs Angular vs React 4. Angular 5. React

Thank You SPSUtah 2019 Sponsors! PLATINUM • Lucidworks • ZAACT GOLD • JourneyTEAM • Sovereign SP SILVER • SkySync ShareSki & SharePint

Winner 2018 Intranet Reloaded The ‘Special Jury award’ was set-up for projects that achieved outstanding results across all entries and therefore deserved special recognition. The special category was won by LDS Church and their project ‘The workforce intranet ecosystem’.

Demo A few interesting SPFx web parts custom developed by ICS

They are still web parts! Built for the modern, JavaScript-driven web Runs directly inside a SharePoint Page Client-side web parts

Web Parts vs Extensions Web Part Extensions

Demo A very brief demo of a SPFx extension

Any Framework or Library Welcome

Only 3 Options in Yeoman SharePoint Generator

Demo SharePoint Generator Options

Question: Why use 'No JavaScript Framework'?

Demo TypeScript Static Typing Examples

TypeScript – Object Oriented

Demo TypeScript Object Oriented

Question: Why you might NOT want to use Angular?

React One-Way Binding <input> searchString = “Holidays 2019”;

Angular Two-Way Binding searchString = “Holidays 2019”; <input>

Demo Using React One-way Binding

Angular – Clean separation of Markup and Code

Demo Using React to create asearch web part

Getting started with Angular and SPFx

But wait, how do I use Angular in SPFx if the Yeoman generator does not support (yet)? Add all the Angular related modules and its dependencies to the package.json file.

AngularCLI https://github.com/maliksahil/SPFxAngularCLI • npm install • gulp serve

Angular OR React? Use React Use Angular Simple App with Fewer Views More Complicated App with Complex Routing

Angular OR React? Use React Use Angular Mostly Read-only, Presentation Form with Multiple Input Fields, Drop Downs, Radio Buttons, Checkboxes, and Other Controls

Angular OR React? Use React Use Angular SharePoint App that consumes SP and/or External Data Non SharePoint App that Consumes SP and/or External Data

Angular OR React? Use React Use Angular SharePoint App, SharePoint Hosted Azure Hosted

Angular OR React? Use React Use Angular Office UI Fabric Other UX Design Framework

Angular OR React? Use React Use Angular Zippier More Robust

Angular OR React? Use React Use Angular You Choose Supporting Libraries (Redux, Flux, React Router, SPHttpClient) Angular Provides Entire Framework (Router, Http Requests, Event Bindings)

Angular OR React? Use React Use Angular Need to Ship Quickly Timeline to Delivery is More Flexible

Summary  Front-end developers can finally dive into SharePoint development  React or Angular? You decide!  SPFx offers rich support for any client side toolkit

React or Angular and SharePoint Framework Development

React or Angular and SharePoint Framework Development

More Related Content

What's hot

Similar to React or Angular and SharePoint Framework Development

Recently uploaded

React or Angular and SharePoint Framework Development

Editor's Notes