SharePoint Framework SPS Madrid 2016

SharePoint Add-ins, SharePoint Framework web parts, list-based and page-based applications, webhooks, Azure CDN

Internet

May 7th, 2016
SharePoint Saturday
Madrid
Working with a Supermodel for SharePoint
Sonja Madsen

Sonja Madsen
Owner
SONJASAPPS
sp2013.blogspot.com
@sonjamadsen
SharePoint MVP, Best International Developer

SharePoint Add-ins
Set up
Deployment
Working with SharePoint lists and libraries
Office UI Fabric
SharePoint Framework
Set up
Deployment
Working with SharePoint lists and libraries
Office UI Fabric

&
Visual Studio Developer Site
SharePoint add-in and Office 365

& &
SharePoint add-in and SharePoint on-premiseSharePoint add-in and SharePoint on-premise
Visual Studio Developer Site

Corporate App
Catalog
SharePoint App
Store
SharePoint Add-in
SharePoint add-in, Deployment

Scripts
Content
SharePoint Add-in .app package

CDN or
remote server
Scripts folder
or SharePoint
library
SharePoint add-in, .js, .css files, images

Style Library 535ms
SharePoint add-in Scripts folder 907ms
MS CDN 256ms
My CDN 254ms

&
Visual Studio Code
Or
Visual Studio
Workbench
SharePoint web part and Office 365
&
SharePoint

& &
SharePoint web part and SharePoint on-premise
Visual Studio Code SharePoint
Workbench

Corporate App Catalog
TBD - SharePoint App Store
SharePoint web part
SharePoint web part, Deployment

Bundle
SharePoint Web Part .spapp package

Development
 Visual Studio Code
 TypeScript
 React is a suggested framework
 Office UI Fabric

DEMO
SharePoint
Framework
Euroean Premiere

List-based Applications
 A list with custom list form pages

Webhooks
 List item receivers
 Add item, delete item, check-out, check-in

SharePoint Add-ins - Advantages
 You can hide the lists from end-user
 Both pages and an app part
 .aspx page – HTML
 Images, scripts, stylesheets hosted on SharePoint
 Isolated is not always a bad thing

SharePoint Framework - Advantages
 Responsive mobile friendly
 No iframe
 Dynamic properties
 Webhooks
 List-based and Page-based
 No need for cross-domain library to access SharePoint resources

Office UI Fabric
 http://dev.office.com/fabric/styles
 Fonts, colors, message colors
 Grid
 Icons
 Controls

<div class="ms-Grid">
<div class="ms-Grid-row">
<div class="ms-Grid-col ms-u-md12">
<h1>Super DEMO</h1>
</div>
</div>
</div>
<div class="ms-Grid-row">
<div class="ms-Grid-col ms-u-md2">
<a id="addLists" href="#"><i class="ms-Icon ms-Icon--circlePlus" style="font-size: xx-
large" aria-hidden="true"></i>Add lists</a>
</div>
Icons

Raffle
Please, fill your SPS Madrid passport if
you want to participate.
You must get signature from sponsors
and complete the poll.
Give us the passport at 6:00 PM in the
Auditorium room.
You can win one Sphero BB-8 or a mini
drone:

Gold sponsors
Silver sponsors
Bronze sponsors
Collaborate

Office 365 is powered by more productive apps than ever before when compared with SharePoint on-premises. In addition to the user interface and evolving collaboration landscape, this session will cover all the Office 365 collaboration tools and technologies such as Delve, Office 365 Groups, Power BI, Access and SharePoint with no-code and browser based configurations. You will gain invaluable insights and how-to determine what tools to use for what business requirements or scenarios. You Will Learn : Understand all of the tools and technologies in Office 365 Know how much organisations can save with Office 365 apps Get to know when to use what power user tool Tricks and tips of what to do and what to avoid Suitable For: End User, Power User, Project Management Track : Productivity and Power User An accompanying video can be accessed at http://techchir.ag/collab365summit2016

ECS19 - John White - Unlock SharePoint’s Reporting Secrets

Katpro Technologies Pvt Ltd

Sharepoint Overview

Vinh Nguyen

InfoPath alternatives and the potential of PowerApps

Maarten Visser

Office 365 Planner and Office 365 Groups Deep Dive

SPC Adriatics

O365Con18 - Customizing SharePoint and Microsoft Teams with SharePoint Framew...

NCCOMMS

We were joined by Paul Swider MVP, Eric Overfield MVP + RD, Erica Toelle MVP, Ryan Schouten MVP, Joel Oleson MVP & RD, and hosted by Pervasent. The intelligent intranet is here — and Office 365 is the place to build one for your organization! Summary blog post by Jeff Teper SharePoint home sites: a landing for your organization on the intelligent intranet New Yammer investments add engagement and compliance capabilities New Microsoft Stream mobile features, interactivity and more announced at SharePoint Conference 2019 OneDrive announcements—SharePoint Conference 2019 Turbocharging Microsoft 365 cloud user experiences Getting started with Microsoft Search Updates to SharePoint security, administration, and migration New Records Management solution and machine learning updates come to Microsoft 365 compliance What’s new for SharePoint Server Announcements for SharePoint developers Microsoft adoption resources center Optimizing business solutions with SharePoint and Office 365 at SPC19

SharePoint Overview

#OCSPUG SharePoint 2013 Best Practices

Ivan Sanders

How to build SharePoint 2013 Killer Apps

Maarten Visser

ECS 19 - John White, Jason Himmelstein - Everything You Always Wanted To Know...

ECS2018 - Accelerate success and time to-value for Office 365 with best pract...

Patrick Guimonet

Share point development services case study

Nandita Nityanandam

ECS19 - Mike Ammerlaan - The Microsoft 365 Platform: A Developer’s Tour

SUGES (SharePoint Users Group España)

Why Upgrade to SharePoint 2016: Including Future of SharePoint Feature Updates

Joel Oleson

How to execute SharePoint 2016 upgrade strategy and ensure business continuity

Overview of SharePoint Server 2019 Public Preview

Vignesh Ganesan I Microsoft MVP

Deep dive into the new features of share point online & onedrive for busi...

Jayanthi P

ECS19 - Dragan Panjkov - Connecting Enterprise Software With Flow

ECS19 - Benjamin Niaulin - MICROSOFT TEAMS FOR POWER USERS MASTERCLASS

ECS19 - Vesa Juvonen - SharePoint Development for Enterprises - What's New an...

Knut Relbe-Moe [MVP, MCT]

How to Create a Windows App with Project Siena, SharePoint & Office 365

This webinar will introduce you to Project Siena and show you how to use it with SharePoint Online and Office 365 data by building on-the-fly Windows apps. No coding skills required! You will also learn: •How to create an app with Project Siena •How to connect to SharePoint as a datasource from Project Siena •How to store your data back to SharePoint from your Project Siena app •How to publish your app and install it on your computer

[Webinar] New Features in SharePoint 2016

James Wright

Error messagesrtinkelman

Tears In The RainH (`*•.¸(`*•.¸¸.•*´)¸.•*´) (`*•.¸(`*•.¸ ¸.•*´)¸.•*´)

What's hot

Practical Business Intelligence in SharePoint 2013 - Honolulu

Ivan Sanders

SPSLondon 2015 Evolving with Office 365 and SharePoint Online Collaboration T...

Chirag Patel

Technical Overview of Microsoft SharePoint Online - Presented by AtidanDavid J Rosenthal

SharePoint Conference 2019 - SharePoint Experts & Announcements Panel

Joel Oleson

SharePoint Overview

Katpro Technologies Pvt Ltd

#OCSPUG SharePoint 2013 Best Practices

Ivan Sanders

How to build SharePoint 2013 Killer Apps

Maarten Visser

ECS 19 - John White, Jason Himmelstein - Everything You Always Wanted To Know...

ECS2018 - Accelerate success and time to-value for Office 365 with best pract...

Patrick Guimonet

Share point development services case study

Nandita Nityanandam

ECS19 - Mike Ammerlaan - The Microsoft 365 Platform: A Developer’s Tour

SUGES (SharePoint Users Group España)

Why Upgrade to SharePoint 2016: Including Future of SharePoint Feature Updates

Joel Oleson

How to execute SharePoint 2016 upgrade strategy and ensure business continuity

Overview of SharePoint Server 2019 Public Preview

Vignesh Ganesan I Microsoft MVP

Deep dive into the new features of share point online & onedrive for busi...

Jayanthi P

ECS19 - Dragan Panjkov - Connecting Enterprise Software With Flow

ECS19 - Benjamin Niaulin - MICROSOFT TEAMS FOR POWER USERS MASTERCLASS

ECS19 - Vesa Juvonen - SharePoint Development for Enterprises - What's New an...

Knut Relbe-Moe [MVP, MCT]

How to Create a Windows App with Project Siena, SharePoint & Office 365

[Webinar] New Features in SharePoint 2016

James Wright

What's hot (20)

Practical Business Intelligence in SharePoint 2013 - Honolulu

SPSLondon 2015 Evolving with Office 365 and SharePoint Online Collaboration T...

Technical Overview of Microsoft SharePoint Online - Presented by Atidan

SharePoint Conference 2019 - SharePoint Experts & Announcements Panel

SharePoint Overview

#OCSPUG SharePoint 2013 Best Practices

How to build SharePoint 2013 Killer Apps

ECS 19 - John White, Jason Himmelstein - Everything You Always Wanted To Know...

ECS2018 - Accelerate success and time to-value for Office 365 with best pract...

Share point development services case study

ECS19 - Mike Ammerlaan - The Microsoft 365 Platform: A Developer’s Tour

Why Upgrade to SharePoint 2016: Including Future of SharePoint Feature Updates

How to execute SharePoint 2016 upgrade strategy and ensure business continuity

Overview of SharePoint Server 2019 Public Preview

Deep dive into the new features of share point online & onedrive for busi...

ECS19 - Dragan Panjkov - Connecting Enterprise Software With Flow

ECS19 - Benjamin Niaulin - MICROSOFT TEAMS FOR POWER USERS MASTERCLASS

ECS19 - Vesa Juvonen - SharePoint Development for Enterprises - What's New an...

How to Create a Windows App with Project Siena, SharePoint & Office 365

[Webinar] New Features in SharePoint 2016

Viewers also liked

Error messagesrtinkelman

Tears In The RainH (`*•.¸(`*•.¸¸.•*´)¸.•*´) (`*•.¸(`*•.¸ ¸.•*´)¸.•*´)

Schrijven voor het web

Simone Levie

$C:\Fakepath\Christie$ $C:\Fakepath\Christie$

C:\Fakepath\Christie

Nerissaemerald

"Protección de la salud mental luego del terremoto y tsunami del 27 de febrer...Organización Panamericana de la Salud - Organización Mundial de la Salud, Representación en Chile.

JULIOPARI - Elaborando un Plan de NegociosJulio Pari

El emprendedor y el empresario profesional cert

Maestros Online

Como hacer un plan de negocios

XPINNERPablo

PMP Sonora Saludable 2010 2015

Instituto Sonorense de Administración Pública, A.C.

Evidence: Describing my kitchen. ENGLISH DOT WORKS 2. SENA.

Rodriguez alvarez

Roxana Saldaña

1ºBACH Economía Tema 5 Oferta y demandaGeohistoria23

Estrategias competitivas básicas

LarryJimenez

2. describing cities and places. ENGLISH DOT WORKS 2. SENA. semana 4 acitivda...

Cápsula 1. estudios de mercadoAudias Torres Coronel

3.Evidence: Getting to Bogota.ENGLISH DOT WORKS 2. SENA.semana 4 actividad 3.

Evidence: Going to the restaurant . ENGLISH DOT WORKS 2. SENA.

Evidence: I can’t believe it.ENGLISH DOT WORKS 2. semana 3 actividad 1.SENA.

Evidence: Memorable moments.ENGLISH DOT WORKS 2. SENA. semana 2 actividad 2.

Evidence: Planning my trip. ENGLISH DOT WORKS 2. SENA. semana 4 actividad 1.

Viewers also liked (20)

Error messages

Tears In The Rain

Schrijven voor het web

$C:\Fakepath\Christie$ $C:\Fakepath\Christie$

C:\Fakepath\Christie

"Protección de la salud mental luego del terremoto y tsunami del 27 de febrer...

JULIOPARI - Elaborando un Plan de Negocios

El emprendedor y el empresario profesional cert

Como hacer un plan de negocios

PMP Sonora Saludable 2010 2015

Evidence: Describing my kitchen. ENGLISH DOT WORKS 2. SENA.

Rodriguez alvarez

1ºBACH Economía Tema 5 Oferta y demanda

Estrategias competitivas básicas

2. describing cities and places. ENGLISH DOT WORKS 2. SENA. semana 4 acitivda...

Cápsula 1. estudios de mercado

3.Evidence: Getting to Bogota.ENGLISH DOT WORKS 2. SENA.semana 4 actividad 3.

Evidence: Going to the restaurant . ENGLISH DOT WORKS 2. SENA.

Evidence: I can’t believe it.ENGLISH DOT WORKS 2. semana 3 actividad 1.SENA.

Evidence: Memorable moments.ENGLISH DOT WORKS 2. SENA. semana 2 actividad 2.

Evidence: Planning my trip. ENGLISH DOT WORKS 2. SENA. semana 4 actividad 1.

Similar to SharePoint Framework SPS Madrid 2016

You got Microsoft Teams! Now let's build modern intranet on SharePoint - Team...

Chirag Patel

Getting Started with Office 365 Development

Dragan Panjkov

Slides for session presented at Office365 Saturday Europe 2014, 15.11.2014. This session introduces you to the Microsoft Office 365 Development platform. It introduces the main two approaches to developing using the App Model to make your customizations appear in the products and the Office 365 APIs to consume them from within your own applications. Understand the strategy and direction of the Office 365 development platform. Learn the key ways to develop on top of the Office 365 platform. See some key scenarios that highlight the benefit of building business solutions on top of the Office 365 platform. This session is delivered on TechEd Europe 2014, in a bit longer format.

Make SharePoint Look Not Like SharePoint - SPSNashville - Cathy Dew

Cathy Dew

SharePoint Developer Education Day Palo Alto

llangit

SPS Paris: Building great client-side web parts with spfx, pnp-js-core, React...

Bill Ayers

D1 - Building Great Client-side Web Parts with SPFx, PnP-JS-Core, ReactJS and...

SPS Paris

Combine four key technologies to build great solutions for your company or clients. Build client-side web parts using the SharePoint Framework (SPFx) along with the open-source toolchain. The PnP-JS-Core library allows you to do a lot of work against the SharePoint REST API with just a few lines of code - sometimes even a single line of code! ReactJS is a view library that allows you to build lightning-fast user interfaces using a powerful component model. Finally, the Office UI Fabric, available in several forms including React components, allows you to build great-looking solutions that follow the design guidelines for SharePoint and Office Add-ins. Four great technologies in their own right, but in combination they allow you to deliver amazing SharePoint solutions with minimal effort.

4 tools, sandboxed solutionds, web part development

icdesktop

SharePoint Framework, React and Office UI SPS Paris 2016 - d01

So You Want To Be A SharePoint Developer-SPS Silicon Valley 2015

Ryan Schouten

In this session we will dive into the information that you will need to be a successful developer for SharePoint. Whether you are a seasoned .Net developer or a Web developer of any sort we will cover the basics of SharePoint Development and all the options available to you. By the end of this session you will have a firm understanding of how to get started developing on SharePoint and you will be, a SharePoint Padawan.

Designing SharePoint 2010 for Business

Kanwal Khipple

A business owner nowadays needs to be able to attract and engage people to their website. In this session, learn to implement your company's brand on SharePoint 2010. During this session, we'll use the right tools to take a design from concept to a fully functioning SharePoint 2010 site. Based on real world experiences, this session is sure to give you some practical tips, tricks, and advice you can use immediately. Learn to leverage SharePoint 2010 tools to customize your experiences, and make them unique. You will be able to take this knowledge and deliver the best end to end experiences to your customers.

Real World SharePoint Framework and Azure Services

Brian Culver

Building Solution in Office 365 requires leveraging other cloud services, such as Azure Services. For those new to SharePoint and all SharePoint veterans, building cloud ready “Full Trust” solutions for Office 365 introduces a huge paradigm shift over the traditional on-premise full-trust development model. In this session, we will look at a couple common full trust solutions and move them to Office365 and Azure. We will leverage various Azure services such as Azure Functions, Event Grids and WebJobs. See demonstrations on how event receivers become Azure Function and Event Grids, and timer jobs become Azure WebJobs. Learn about other useful Azure services for replacing full trust functionality. Don’t pass up this opportunity to learn skills and knowledge you need to build Office 365 Solutions leveraging Cloud Services Attendee Takeaways: 1. Understand how to take Full Trust solutions from On-premise to the Office365. 2. Learn how to use Azure Functions, Event Grids, WebJobs and several other Azure Services. 3. See demonstrations of a couple common Full Trust Solutions converted to cloud solutions on Office365 and Azure.

So You Want to Be a SharePoint Developer - SPS Utah 2015

Ryan Schouten

Developing branding solutions for 2013Thomas Daly

SharePoint Framework, React, and Office UI sps Silicon Valley

Workshop supermodel munich

Sharepoint2LiquidHub

SPUnite17 Building Great Client Side Web Parts with SPFx

NCCOMMS

Intro to SharePoint for Developers

Rob Wilson

Office 365 development

younjw

Office 365 for Developers

Wes Yanaga

Similar to SharePoint Framework SPS Madrid 2016 (20)

You got Microsoft Teams! Now let's build modern intranet on SharePoint - Team...

Getting Started with Office 365 Development

Make SharePoint Look Not Like SharePoint - SPSNashville - Cathy Dew

SharePoint Developer Education Day Palo Alto

SPS Paris: Building great client-side web parts with spfx, pnp-js-core, React...

D1 - Building Great Client-side Web Parts with SPFx, PnP-JS-Core, ReactJS and...

4 tools, sandboxed solutionds, web part development

SharePoint Framework, React and Office UI SPS Paris 2016 - d01

So You Want To Be A SharePoint Developer-SPS Silicon Valley 2015

Designing SharePoint 2010 for Business

Real World SharePoint Framework and Azure Services

So You Want to Be a SharePoint Developer - SPS Utah 2015

Developing branding solutions for 2013

SharePoint Framework, React, and Office UI sps Silicon Valley

Workshop supermodel munich

Sharepoint2

SPUnite17 Building Great Client Side Web Parts with SPFx

Intro to SharePoint for Developers

Office 365 development

Office 365 for Developers

More from Sonja Madsen

Building SharePoint add-ins with JavaScript and c# sps Silicon Valley

SharePoint Framework, React, and Office UI Fabric spc adriatics 2016

Working with a super model for SharePoint Tuga IT 2016

Cloud-first SharePoint JavaScript Add-ins - Collab 365

Hosting JavaScript, CSS, and images on Azure is way to go for SharePoint developers. Having JavaScript files in the cloud allows you to build your own framework and re-use the functionality instead of copy-pasting the same code over and over again. This session is a quick introduction to Azure CDN, - how to set up a CDN on Azure, how to add and delete files, and examples of how to work on SharePoint add-ins and Azure in Visual Studio 2015.

Building Share Point add-ins with JavaScript and c# Microsoft Western Europe ...

Office 365 security concerns, EU General Data Protection Regulation (GDPR)

Office 365 provides access to information from different devices not only from secure office locations, but also from just about any location in the world. Data security, governance and compliance are the biggest concerns. This talk is about the robust security that is built into Office 365: data loss prevention, mobile device management, password and multi-factor authentication, message encryption, EU General Data Protection Regulation (GDPR) and Rights Management Service.

Share point hosted add ins munich

GitHub and Office 365 video Munich

Branding Office 365 SharePoint Days

Quick start guide to java script frameworks for sharepoint add ins sharepoint...

Patterns in add ins espc15

Branding Office 365 ESPC15

Quick start guide to java script frameworks for sharepoint add ins oslo

Wonderful csom sps barcelona

Branding office 365 copenhagen

JavaScript Frameworks for SharePoint add-ins Cambridge

Branding office 365 Netherlands

Corporate branding on all sites and apps on Office 365. How does Office 365 being in the Cloud affects branding. Strategy to keep your branding "safe" and unbroken from continuous updates. Delve, Video, Team Sites, OneDrive, Publishing Sites, Sway, Office 365 Groups and MySite on Office 365. What it takes to apply consistent corporate branding on Office 365, and how to keep up with Office 365 updates that roll out new features and changes in design and navigation.

Branding office 365

Corporate branding on all sites and apps on Office 365. How does Office 365 being in the Cloud affects branding. Strategy to keep your branding "safe" and unbroken from continuous updates. Branding Delve, Video, Team Sites, OneDrive, Publishing Sites and MySite on Office 365.What it takes to apply consistent corporate branding on Office 365, and how to keep up with Office 365 updates that roll out new features and changes in design and navigation.

Quick start guide to java script frameworks for sharepoint apps spsbe-2015

Learn about JavaScript frameworks and new developer practices in SharePoint and on Office 365. JavaScript frameworks are there for you to help you develop faster and easier. You don't need to do your apps from scratch. Apps and the cloud app model have brought not only new ways to interact, send, write, and receive data from SharePoint. Apps have also brought JavaScript frameworks into SharePoint development. JavaScript frameworks are right there as part of the app template when you start a SharePoint hosted or a Cloud app. In this session, I'll show what you can do with JavaScript frameworks that are part of the app template. I'll show jQuery, Bootstrap, and modernizr.

Introduktion til SharePoint apps