The document discusses how developers can reuse their SharePoint Framework skills to build Office Add-ins. It covers why Office Add-ins are useful, how they work, tools for building them like Visual Studio and React, using the SharePoint Framework, and distributing add-ins. The presentation includes demos of creating an add-in using React and the Office UI Fabric library in Visual Studio. It recommends developers sign up for the Office 365 Developer Program and think about how add-ins could help their business needs.
Custom Development in SharePoint – What are my options now?Talbott Crowell
Since Microsoft has released SharePoint 2013 with a whole new application development methodology, there has been some confusion and frustration in the community on what the best approach for customizing SharePoint for developers. In this session, we will look at the options, new and old, and discuss the pros and cons. We may even see some novel approaches you haven’t thought about yet.
Custom Development in SharePoint – What are my options now?Talbott Crowell
Since Microsoft has released SharePoint 2013 with a whole new application development methodology, there has been some confusion and frustration in the community on what the best approach for customizing SharePoint for developers. In this session, we will look at the options, new and old, and discuss the pros and cons. We may even see some novel approaches you haven’t thought about yet.
[Bert Jansen] Have you been using SharePoint Online and already have many classic team sites? Do you want to transform these sites to modern, group connected, team sites? In this session we'll walk through the typical transformation scenarios that will unblock you on adopting the modern experiences in SharePoint Online.
Chris O'Brien - Introduction to the SharePoint Framework for developersChris O'Brien
Describes the new SharePoint development framework, which uses Gulp, node.js, TypeScript, SASS and other modern web technologies. Covers client web parts, modern pages and the canvas, and how to surface your files on a CDN for optimum performance. This intro presentation helps you get started.
Building high performance and scalable share point applicationsTalbott Crowell
SharePoint custom application development can sometimes be challenging. This presentation at SPS New Hampshire on October 18th, 2014 covers some techniques and strategies on improving performance and scalability of your applications.
Collab 365 - Real world scenarios to migrate to SharePoint 2016 or Office 365Patrick Guimonet
This is the slides from our session at Collab 365 on SharePoint 2016 and Office 365 migration
Same session we did at SPS Barcelona 2015
With Gokan Ozcifci
[Bert Jansen] Have you been using SharePoint Online and already have many classic team sites? Do you want to transform these sites to modern, group connected, team sites? In this session we'll walk through the typical transformation scenarios that will unblock you on adopting the modern experiences in SharePoint Online.
Chris O'Brien - Introduction to the SharePoint Framework for developersChris O'Brien
Describes the new SharePoint development framework, which uses Gulp, node.js, TypeScript, SASS and other modern web technologies. Covers client web parts, modern pages and the canvas, and how to surface your files on a CDN for optimum performance. This intro presentation helps you get started.
Building high performance and scalable share point applicationsTalbott Crowell
SharePoint custom application development can sometimes be challenging. This presentation at SPS New Hampshire on October 18th, 2014 covers some techniques and strategies on improving performance and scalability of your applications.
Collab 365 - Real world scenarios to migrate to SharePoint 2016 or Office 365Patrick Guimonet
This is the slides from our session at Collab 365 on SharePoint 2016 and Office 365 migration
Same session we did at SPS Barcelona 2015
With Gokan Ozcifci
January’s call, hosted by Kim Brandl, featured the following presenters and topics:
-Alex Jerabek, Dev Writer, provided a general overview of Office Add-ins.
-Raymond Lu, Senior Program Manager, shared information about Excel preview (beta) APIs in requirement set 1.11.
-Vesa Juvonen, Principal Program Manager, presented about building Office Add-ins using the SharePoint Framework.
-Kim Brandl, Senior Dev Writer, shared that the Yeoman generator for Office Add-ins will soon support creating SSO-enabled Office Add-ins.
For more information, visit https://developer.microsoft.com/office
Convert your Full Trust Solutions to the SharePoint Framework (SPFx)Brian Culver
This is a live walkthrough where we convert a common full trust solution to a SharePoint Framework solution. May the demo Gods be kind to me. Really, we will do it. Does not cover all possible scenarios, but I will show you the general workflow for converting your full trust solutions to SPFx solutions. I show you the proper configuration for your development environment. We walk through building the SPFx solutions and deploying it to Office 365. Lots of DO’s and DON’Ts will be shared. I’ll show you some of my scars too. From this session forward, you will want to hone your skills in modern SharePoint and convert everything to SPFx solutions.
Attendee Takeaways:
1. Understand the why, the how, and what make up the SharePoint Framework (SPFx).
2. Discussion where we compare common Full Trust Solutions and options for converting to the SharePoint Framework (SPFx) in less than 1 hour.
SPTechCon Austin 2019 - From SharePoint to Office 365 developmentSébastien Levert
The world around the Office Developer is changing. And for someone with a heavy SharePoint background, it can be somewhat scary to make the move to the cloud. But don't be scared, SharePoint Developer! Become an added-value Office Developer and contribute to maximize the productivity of your enterprise.
The technology space around Productivity has evolved and it has never been that exciting. Your step into the Mobile-First, Cloud-First world will be mindblowing and you will want to stick around for a very long time!
In this session, we will cover every aspect of the new Office 365 Developer paradigm and we will ensure that you can make yourself at home in such a new world. The technologies covered will span from being close to your existing stack (SharePoint Framework, JavaScript) to a set of technologies that are new and that will expand your possibilities (Office 365 Apps, Microsoft Graph, Azure, TypeScript)
This very session will make sure that at the end you get those 3 key takeaways :
- Understand your new role as an Office 365 Developer
- Have a complete overview of the technology stack you need to master in the cloud
- Change the way you will think for your next SharePoint & Office 365 project
Real World SharePoint Framework and Azure ServicesBrian 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.
SharePoint Saturday Ottawa - From SharePoint to Office 365 DevelopmentSébastien Levert
The world around the Office Developer is changing. And for someone with a heavy SharePoint background, it can be somewhat scary to make the move to the cloud. But don't be scared, SharePoint Developer! Become an added-value Office Developer and contribute to maximize the productivity of your enterprise.
In this session, we will cover every aspect of the new Office Developer paradigm and we will ensure that you can make yourself at home in such a new world.
The topics covered will be :
- SharePoint Add-In
- Office 365 Apps
- Office Add-In
- Microsoft Graph
Microsoft is switching gears by focusing on developers and web technologies. Office Add-ins enable you to extend Office clients such as Word, Excel, PowerPoint, and Outlook using web technologies like HTML, CSS and JavaScript.This presentation will cover Add-in architecture as well as development tools and process.
SharePoint Fest Chicago - From SharePoint to Office 365 DevelopmentSébastien Levert
The world around the Office Developer is changing. And for someone with a heavy SharePoint background, it can be somewhat scary to make the move to the cloud. But don't be scared, SharePoint Developer! Become an added-value Office Developer and contribute to maximize the productivity of your enterprise.
In this session, we will cover every aspect of the new Office Developer paradigm and we will ensure that you can make yourself at home in such a new world.
The topics covered will be :
SharePoint Add-In
Office 365 Apps
Office Add-In
Microsoft Graph
CCI 2017 - Introduzione a SharePoint Framework (SPFx) - Fabio Franziniwalk2talk srl
In questa sessione verrà introdotto SharePoint Framework, il nuovo framework per creare personalizzazioni per SharePoint utilizzando esclusivamente codice lato client.
Vedremo i motivi per cui il framework è stato creato, come funziona ed una piccola introduzione sugli strumenti da sviluppatore, linguaggi di programmazione e framework lato client che possono essere utilizzati per creare personalizzazioni quali la nuova “Client Web Part".
Verranno inoltre presentati alcuni esempi su quello che il framework offre nella versione in first release.
Per richiedere accesso al canale contenente le registrazioni audio/video delle sessioni tecniche di Cloud Conference Italia 2017 compila il seguente form:
https://goo.gl/Fq6DQE
ESPC 2016 - From SharePoint to Office 365 Development - The path to your new ...Sébastien Levert
The world around the Office Developer is changing and for someone with a heavy SharePoint background, it can be somewhat scary to make the move to the cloud. But don’t be scared SharePoint Developer – From SharePoint to Office Development, become an added-value Office Developer and contribute to maximise the productivity of your enterprise. In this session, we will cover every aspect of the new Office Developer paradigm and we will ensure that you can make yourself at home in such a new world. The topics covered will be :
– SharePoint Add-In
– Office 365 Apps
– Office Add-In
– Microsoft Graph
Benefits of Attending this Session:
Learn what an Office Developer is
See code in action representing the Office Developer day-to-day
Leverage the most active community around productivity development
SharePoint Saturday Calgary 2017 - From SharePoint to Office 365 DevelopmentSébastien Levert
The world around the Office Developer is changing. And for someone with a heavy SharePoint background, it can be somewhat scary to make the move to the cloud. But don't be scared, SharePoint Developer! Become an added-value Office Developer and contribute to maximize the productivity of your enterprise.
The technology space around Productivity has evolved and it has never been that exciting. Your step into the Mobile-First, Cloud-First world will be mindblowing and you will want to stick around for a very long time!
In this session, we will cover every aspect of the new Office 365 Developer paradigm and we will ensure that you can make yourself at home in such a new world. The technologies covered will span from being close to your existing stack (SharePoint Framework, JavaScript) to a set of technologies that are new and that will expand your possibilities (Office 365 Apps, Microsoft Graph, Azure, TypeScript)
This very session will make sure that at the end you get those 3 key takeaways :
- Understand your new role as an Office 365 Developer
- Have a complete overview of the technology stack you need to master in the cloud
- Change the way you will think for your next SharePoint & Office 365 project
Now you know how to get up and running with a SharePoint Framework project, how to get up and running with Microsoft Graph and use it in your SharePoint Framework solutions we will look at integrating with Microsoft Teams.
Join this session to understand available assets of SharePoint Framework (SPFx) and what is important for you as SharePoint Developer and Architect in the development area with SharePoint modern portals. In this session, you will know more about extending existing experiences across SharePoint and Teams.
Experience our free, in-depth three-part Tendenci Platform Corporate Membership Management workshop series! In Session 1 on May 14th, 2024, we began with an Introduction and Setup, mastering the configuration of your Corporate Membership Module settings to establish membership types, applications, and more. Then, on May 16th, 2024, in Session 2, we focused on binding individual members to a Corporate Membership and Corporate Reps, teaching you how to add individual members and assign Corporate Representatives to manage dues, renewals, and associated members. Finally, on May 28th, 2024, in Session 3, we covered questions and concerns, addressing any queries or issues you may have.
For more Tendenci AMS events, check out www.tendenci.com/events
Prosigns: Transforming Business with Tailored Technology SolutionsProsigns
Unlocking Business Potential: Tailored Technology Solutions by Prosigns
Discover how Prosigns, a leading technology solutions provider, partners with businesses to drive innovation and success. Our presentation showcases our comprehensive range of services, including custom software development, web and mobile app development, AI & ML solutions, blockchain integration, DevOps services, and Microsoft Dynamics 365 support.
Custom Software Development: Prosigns specializes in creating bespoke software solutions that cater to your unique business needs. Our team of experts works closely with you to understand your requirements and deliver tailor-made software that enhances efficiency and drives growth.
Web and Mobile App Development: From responsive websites to intuitive mobile applications, Prosigns develops cutting-edge solutions that engage users and deliver seamless experiences across devices.
AI & ML Solutions: Harnessing the power of Artificial Intelligence and Machine Learning, Prosigns provides smart solutions that automate processes, provide valuable insights, and drive informed decision-making.
Blockchain Integration: Prosigns offers comprehensive blockchain solutions, including development, integration, and consulting services, enabling businesses to leverage blockchain technology for enhanced security, transparency, and efficiency.
DevOps Services: Prosigns' DevOps services streamline development and operations processes, ensuring faster and more reliable software delivery through automation and continuous integration.
Microsoft Dynamics 365 Support: Prosigns provides comprehensive support and maintenance services for Microsoft Dynamics 365, ensuring your system is always up-to-date, secure, and running smoothly.
Learn how our collaborative approach and dedication to excellence help businesses achieve their goals and stay ahead in today's digital landscape. From concept to deployment, Prosigns is your trusted partner for transforming ideas into reality and unlocking the full potential of your business.
Join us on a journey of innovation and growth. Let's partner for success with Prosigns.
May Marketo Masterclass, London MUG May 22 2024.pdfAdele Miller
Can't make Adobe Summit in Vegas? No sweat because the EMEA Marketo Engage Champions are coming to London to share their Summit sessions, insights and more!
This is a MUG with a twist you don't want to miss.
Globus Connect Server Deep Dive - GlobusWorld 2024Globus
We explore the Globus Connect Server (GCS) architecture and experiment with advanced configuration options and use cases. This content is targeted at system administrators who are familiar with GCS and currently operate—or are planning to operate—broader deployments at their institution.
Custom Healthcare Software for Managing Chronic Conditions and Remote Patient...Mind IT Systems
Healthcare providers often struggle with the complexities of chronic conditions and remote patient monitoring, as each patient requires personalized care and ongoing monitoring. Off-the-shelf solutions may not meet these diverse needs, leading to inefficiencies and gaps in care. It’s here, custom healthcare software offers a tailored solution, ensuring improved care and effectiveness.
AI Pilot Review: The World’s First Virtual Assistant Marketing SuiteGoogle
AI Pilot Review: The World’s First Virtual Assistant Marketing Suite
👉👉 Click Here To Get More Info 👇👇
https://sumonreview.com/ai-pilot-review/
AI Pilot Review: Key Features
✅Deploy AI expert bots in Any Niche With Just A Click
✅With one keyword, generate complete funnels, websites, landing pages, and more.
✅More than 85 AI features are included in the AI pilot.
✅No setup or configuration; use your voice (like Siri) to do whatever you want.
✅You Can Use AI Pilot To Create your version of AI Pilot And Charge People For It…
✅ZERO Manual Work With AI Pilot. Never write, Design, Or Code Again.
✅ZERO Limits On Features Or Usages
✅Use Our AI-powered Traffic To Get Hundreds Of Customers
✅No Complicated Setup: Get Up And Running In 2 Minutes
✅99.99% Up-Time Guaranteed
✅30 Days Money-Back Guarantee
✅ZERO Upfront Cost
See My Other Reviews Article:
(1) TubeTrivia AI Review: https://sumonreview.com/tubetrivia-ai-review
(2) SocioWave Review: https://sumonreview.com/sociowave-review
(3) AI Partner & Profit Review: https://sumonreview.com/ai-partner-profit-review
(4) AI Ebook Suite Review: https://sumonreview.com/ai-ebook-suite-review
Cyaniclab : Software Development Agency Portfolio.pdfCyanic lab
CyanicLab, an offshore custom software development company based in Sweden,India, Finland, is your go-to partner for startup development and innovative web design solutions. Our expert team specializes in crafting cutting-edge software tailored to meet the unique needs of startups and established enterprises alike. From conceptualization to execution, we offer comprehensive services including web and mobile app development, UI/UX design, and ongoing software maintenance. Ready to elevate your business? Contact CyanicLab today and let us propel your vision to success with our top-notch IT solutions.
Unleash Unlimited Potential with One-Time Purchase
BoxLang is more than just a language; it's a community. By choosing a Visionary License, you're not just investing in your success, you're actively contributing to the ongoing development and support of BoxLang.
Exploring Innovations in Data Repository Solutions - Insights from the U.S. G...Globus
The U.S. Geological Survey (USGS) has made substantial investments in meeting evolving scientific, technical, and policy driven demands on storing, managing, and delivering data. As these demands continue to grow in complexity and scale, the USGS must continue to explore innovative solutions to improve its management, curation, sharing, delivering, and preservation approaches for large-scale research data. Supporting these needs, the USGS has partnered with the University of Chicago-Globus to research and develop advanced repository components and workflows leveraging its current investment in Globus. The primary outcome of this partnership includes the development of a prototype enterprise repository, driven by USGS Data Release requirements, through exploration and implementation of the entire suite of the Globus platform offerings, including Globus Flow, Globus Auth, Globus Transfer, and Globus Search. This presentation will provide insights into this research partnership, introduce the unique requirements and challenges being addressed and provide relevant project progress.
Enterprise Resource Planning System includes various modules that reduce any business's workload. Additionally, it organizes the workflows, which drives towards enhancing productivity. Here are a detailed explanation of the ERP modules. Going through the points will help you understand how the software is changing the work dynamics.
To know more details here: https://blogs.nyggs.com/nyggs/enterprise-resource-planning-erp-system-modules/
Enhancing Research Orchestration Capabilities at ORNL.pdfGlobus
Cross-facility research orchestration comes with ever-changing constraints regarding the availability and suitability of various compute and data resources. In short, a flexible data and processing fabric is needed to enable the dynamic redirection of data and compute tasks throughout the lifecycle of an experiment. In this talk, we illustrate how we easily leveraged Globus services to instrument the ACE research testbed at the Oak Ridge Leadership Computing Facility with flexible data and task orchestration capabilities.
A Comprehensive Look at Generative AI in Retail App Testing.pdfkalichargn70th171
Traditional software testing methods are being challenged in retail, where customer expectations and technological advancements continually shape the landscape. Enter generative AI—a transformative subset of artificial intelligence technologies poised to revolutionize software testing.
Paketo Buildpacks : la meilleure façon de construire des images OCI? DevopsDa...Anthony Dahanne
Les Buildpacks existent depuis plus de 10 ans ! D’abord, ils étaient utilisés pour détecter et construire une application avant de la déployer sur certains PaaS. Ensuite, nous avons pu créer des images Docker (OCI) avec leur dernière génération, les Cloud Native Buildpacks (CNCF en incubation). Sont-ils une bonne alternative au Dockerfile ? Que sont les buildpacks Paketo ? Quelles communautés les soutiennent et comment ?
Venez le découvrir lors de cette session ignite
Code reviews are vital for ensuring good code quality. They serve as one of our last lines of defense against bugs and subpar code reaching production.
Yet, they often turn into annoying tasks riddled with frustration, hostility, unclear feedback and lack of standards. How can we improve this crucial process?
In this session we will cover:
- The Art of Effective Code Reviews
- Streamlining the Review Process
- Elevating Reviews with Automated Tools
By the end of this presentation, you'll have the knowledge on how to organize and improve your code review proces
OpenFOAM solver for Helmholtz equation, helmholtzFoam / helmholtzBubbleFoamtakuyayamamoto1800
In this slide, we show the simulation example and the way to compile this solver.
In this solver, the Helmholtz equation can be solved by helmholtzFoam. Also, the Helmholtz equation with uniformly dispersed bubbles can be simulated by helmholtzBubbleFoam.
Gamify Your Mind; The Secret Sauce to Delivering Success, Continuously Improv...Shahin Sheidaei
Games are powerful teaching tools, fostering hands-on engagement and fun. But they require careful consideration to succeed. Join me to explore factors in running and selecting games, ensuring they serve as effective teaching tools. Learn to maintain focus on learning objectives while playing, and how to measure the ROI of gaming in education. Discover strategies for pitching gaming to leadership. This session offers insights, tips, and examples for coaches, team leads, and enterprise leaders seeking to teach from simple to complex concepts.
4. Agenda
• Why Office Add-ins?
• How Office Add-ins Work
• Tools for Building Office Add-ins
• Using the Web Development Toolchain
• SPFx
• Distributing Add-ins
• Conclusions
• Q & A
5. AGENDA:
WHY OFFICE ADD-INS?
HOW OFFICE ADD-INS WORK
TOOLS FOR BUILDING OFFICE ADD-INS
USING THE WEB DEVELOPMENT TOOLCHAIN
SPFX
DISTRIBUTING ADD-INS
CONCLUSIONS
Q & A
6. • The de-facto standard for business
• > 1.2 b users + 400m outlook.com
• Now available on iOS, Android, OS X, Windows Phone and in browsers
Office is Everywhere!
7. Add-in vision
• Native and intuitive feel
• Use UI framework of host
client (Office UI Fabric)
• Write once, run everywhere
• Simple point solutions to
automate existing manual
processes
12. Office Add-in Shapes
Add-in that runs within a document content with
read/write access: Excel, PowerPoint, Access
Add-in launched contextually from a mail message or appointment:
Outlook and Outlook Web Access (OWA), and could include actionable
messages
Command in the Office UI to launch add-in or execute
JavaScript: Outlook, Excel, PowerPoint, Word, OneNote
Add-in that runs beside a document/mail with read/write access:
Word, Excel, PowerPoint, Project, Outlook
Module extension for the Outlook navigation bar: Outlook
Excel Custom FunctionsF
13. Win32 Online iPad iPhone Mac Android UWA
Read Read
Compose Compose
Add-in Roadmap
https://dev.office.com/add-in-availability
14. Office.js
• Access to body and attachments, content
• Launch native forms (e.g. reply, new message, appointment)
• Modify fields and add attachments
• Set/get custom properties on items
• Persist user settings
JavaScript API Reference: http://dev.office.com/docs/add-ins/overview/office-add-ins
16. Building an Office Add-in
• Script Lab add-in
• Microsoft Visual Studio
• Any Web Editor of you choice (e.g. VS Code)
plus Yeoman project generator
https://dev.office.com/blogs/creating-office-
add-ins-with-any-editor-introducing-yo-office
Getting Started at dev.office.com – can use MSDN subscription, sign up for Office
Developer Program for free 1 year licence, or get a free 30-day Office 365 trial
18. Using Visual Studio 2017
• Visual Studio 2017 (including community edition) – check the installer option
• Create new project: Add-in for Office App for Office Web Add-in
• Design user interface as a web site, edit manifest, etc…
19. More Development Choices…
• Use any technology that delivers for the web
• Yeoman generator for skeleton add-in project
(similar to SharePoint Framework toolchain)
Hosted on
GitHub
20. yo office!
• Go to https://nodejs.org/ and install LTS version
• npm install -g yo
• npm install -g generator-office
• yo office
22. React
• Open-source framework backed by Facebook
• Component model
• Virtual DOM
• “Weird” JSX/TSX syntax
• Go to https://reactjs.org/
23. App component with title property
Component has properties
Component’s render function returns one
root element with child elements (can wrap in
div or empty element <>)
Elements are converted into valid JavaScript
by the JSX compiler
Events are bound with function.bind syntax or
lambda expressions: e=>add(e)
Component props are immutable, but
component state can change using setState
method
ReactDOM.render method used to bind initial
App element to the element in the DOM with
the ID “app”.
React App class App extends React.Component {
constructor(props) {
super(props);
this.state = { items: [] }
}
render() {
const stocks = this.state.items.map((item, index) => (
<li>{item}</li>
));
return (
<div>
<h1>{this.props.title}</h1>
<div>
<input type="text" ref="newItem“ onKeyPress={this.add.bind(this)}/>
</div>
<ul>{stocks}</ul>
</div>
);
}
add(event) {
if (event.key == "Enter") {
var list = this.state.items;
list.unshift(this.refs.newItem.value);
this.setState({items: list});
this.refs.newItem.value = "";
}
}
}
ReactDOM.render(<App title="Hello World!" />, document.getElementById("app"));
25. Office UI Fabric React Components
React component library with more than 40
reusable components
Add the office-ui-fabric-react npm package
Typing available for TypeScript
Office UI Fabric Core
Includes styles, icons, typography, brand
icons, colors, grids, and more as CSS and
JavaScript if not using React.
PnP SPFx React Components:
http://github.com/SharePoint/sp-dev-fx-controls-react/
28. Design Guidelines
• Design explicitly for Office
• Focus on key tasks
• Favour content over chrome
• Go easy on the branding
• Keep users in control
• Design for all Office platforms and input methods
• First Run experience
• See: https://docs.microsoft.com/en-us/office/dev/add-ins/design/add-in-design
29. Simplified component structure – no this, no
classes, no constructor, no
componentDidMount, etc.
Pure functional components
Use functions instead of classes
Functional (Stateless) Components were
introduced with React 1.4
React Hooks new in React 16.8
Current generator-office uses React 16.8
Current SPFx generator (1.8) uses React 16.7
One more thing -
React Hooks
function App(props) {
const [items, setItems] = React.useState([]);
const stocks = items.map((item, index) => (
<li>{item}</li>
));
function add(event) {
if (event.key == "Enter") {
var list = items;
list.unshift(event.target.value);
setItems({items: list});
}
}
return (
<div>
<h1>{props.title}</h1>
<div>
<input type="text“ onKeyPress={event=>add(event)} />
</div>
<ul>{stocks}</ul>
</div>
);
}
}
ReactDOM.render(<App title="Hello World!" />, document.getElementById("app"));
30. Refactored function Stocks({items}) {
return (
<ul>
{items.map(item => <li>{item}</li>)}
</ul>
);
}
function App(props) {
const [items, setItems] = useState([]);
function add(event) {
if (event.key == "Enter") {
var list = items;
list.unshift(event.target.value);
setItems({items: list});
}
}
return (
<div>
<h1>{props.title}</h1>
<div>
<input type="text“ onKeyPress={event=>add(event)} />
</div>
<Stocks items={items} />
</div>
);
}
}
ReactDOM.render(<App title="Hello World!" />, document.getElementById("app"));
Stocks is extracted as a separate component.
Stocks only depends on its props so it is a pure
or “stateless” functional component; no state, no
side-effects.
This makes Stocks very easy to test.
Implicit object destructuring operator {} used
instead of props.items.
33. Dialog API
• Dialog API allows you to open
a dialog box from an Office
Add-in.
• Typically used for
authentication prompts with
external systems.
• Can also be used to show UI
elements that are too big for
the task pane.
35. What if we could just use SPFx?
Introduced at //build/ 2019
Still in early stages
SPFx component in task pane includes a call to Office.js
Get access to SharePoint data (if authenticated)
Get access to Microsoft Graph through MSGraphClient
No need to worry about where to host the Add-in
Currently planned for preview in 1.9 release of SPFx
38. Deployment Options
• Debugging – launch from Visual Studio or Visual Studio Code
• Side-loading – ad-hoc pull-driven deployment
• App Catalog – for internal distribution
• App Store – for broader distribution
• App Store – commercial distribution
• Centralized Deployment
39. Conclusions:
• Office Add-ins – potential for huge business benefit for
your users with minimal effort
• > 1.5bn potential users across multiple platforms
• Use same skillset, possibly even code, across Office
Add-ins, SharePoint, Web, Universal Apps and Mobile
Cross-platform Apps
• Your choice of developer tooling – use what you know
• Platform continuing to get more capabilities and better
reach
• Watch out for SPFx Office Add-in component in SPFx
version 1.9
40. Sign up for the Office 365
Developer Program
Start at http://dev.office.com
Build your first Office Add-
in
Use Yeoman, Visual Studio Code,
ReactJS and other familiar tools from
SPFx development right now
Think about how Office
Add-ins could help your
business
Solve real business problems,
delight users, watch out for SPFx 1.9
CALL TO ACTION
41. thank you
questions?
SPDOCTOR.COM@SPDOCTOR
Bill Ayers
Technical Director
Flow Simulation Ltd.
Office 365 Dev Center dev.office.com (redirect)
Office Add-ins
Documentation
https://docs.microsoft.com/e
n-us/office/dev/add-ins/
Training content on GitHub https://github.com/OfficeDev/
TrainingContent/
Office UI Fabric https://developer.microsoft.c
om/en-us/fabric
Script Lab https://github.com/OfficeDev/
script-lab
Discover what’s coming with
the Microsoft 365 Roadmap
aka.ms/M365Roadmap
Follow me and share this
session
@SPDoctor #Collabsummit