SharePoint Development with the SharePoint Framework

SharePoint Development with the SharePoint Framework

by Jussi Roine, Olli Jääskeläinen
Released September 2017
Publisher(s): Packt Publishing
ISBN: 9781787121430

Read it now on the O’Reilly learning platform with a 10-day free trial.

O’Reilly members get unlimited access to books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial

Book description

Design and create beautiful solutions using modern development tools for SharePoint Online

About This Book

  • Get the best out of the latest Sharepoint Framework and leverage the Sharepoint RESTful and JSOM APIs.
  • Develop efficient client side applications with JavaScript injection and Sharepoint Addins.
  • Get the best tips and tricks on designing your website flawlessly.

Who This Book Is For

This book targets current SharePoint developers, as well as people starting their journey on SharePoint development. The reader must have basic web development programming knowledge, including JavaScript and CSS. The reader should have familiarity using and managing SharePoint-based collaboration sites.

What You Will Learn

  • Understand what the SharePoint Framework is
  • Create modern solutions using the new tools, approaches and frameworks
  • Learn how to use Visual Studio Code for effective SharePoint development
  • Package and deploy your code, using automation as needed
  • Work with content and data stored in SharePoint
  • Benefit from third party frameworks without having to build your own frameworks
  • Debug and troubleshoot your code with ease
  • Configure security in your application

In Detail

SharePoint is one of Microsoft's best known web platforms. A loyal audience of developers, IT Pros and power users use it to build line of business solutions.

The SharePoint Framework (SPFx) is a great new option for developing SharePoint solutions. Many developers are creating full-trust based solutions or add-in solutions, while also figuring out where and how SPFx fits in the big picture.

This book shows you how design, build, deploy and manage SPFx based solutions for SharePoint Online and SharePoint 2016.

The book starts by getting you familiar with the basic capabilities of SPFx. After that, we will walk through the tool-chain on how to best create production-ready solutions that can be easily deployed manually or fully automated throughout your target Office 365 tenants.

We describe how to configure and use Visual Studio Code, the de facto development environment for SPFx-based solutions. Next, we provide guidance and a solid approach to packaging and deploying your code.

We also present a straightforward approach to troubleshooting and debugging your code an environment where business applications run on the client side instead of the server side.

Style and approach

The approach will be that of a practical tutorial which will take you through every topic using code samples and working examples.

Table of contents

  1. Title Page
  2. Copyright
    1. SharePoint Development with the SharePoint Framework
  3. Credits
  4. About the Authors
  5. About the Reviewer
  6. www.PacktPub.com
    1. Why subscribe?
  7. Customer Feedback
  8. Preface
    1. What this book covers
    2. What you need for this book
    3. Who this book is for
    4. Conventions
    5. Reader feedback
    6. Customer support
    7. Downloading the example code
    8. Errata
    9. Piracy
    10. Questions
  9. Introducing SharePoint Online for Developers
    1. What is SharePoint Online?
    2. SharePoint sites and site collections
    3. SharePoint document libraries
    4. SharePoint lists
    5. SharePoint web parts
    6. Why SharePoint Online?
    7. Office 365 licensing
    8. Choosing an Office 365 license for development use
    9. Getting started with SharePoint Online
    10. Creating new site collections
    11. A word or two on SharePoint site templates
    12. Site definitions
    13. Site templates
    14. Web templates
    15. SharePoint Online and site templates
    16. Creating a new site collection
    17. Developer sites versus team sites
    18. SharePoint Online APIs
    19. A quick primer on Microsoft Graph
    20. Developing solutions for SharePoint Online
    21. Solutions for SharePoint and SharePoint Online
    22. SharePoint 2001-2003: direct modification of files
    23. SharePoint 2007--Full-trust code
    24. SharePoint 2010 and SharePoint Online: sandbox solutions
    25. SharePoint 2013, SharePoint 2016, and SharePoint Online: add-ins
    26. SharePoint Online--add-ins and client-side scripts
    27. Development tooling for SharePoint Online
    28. Summary
  10. Developing Solutions for SharePoint
    1. Introducing the SharePoint Framework
    2. SharePoint extensibility
    3. Philosophy of the SharePoint Framework
    4. Types of projects the SharePoint Framework supports
    5. Key features of the SharePoint Framework
    6. Toolchain
    7. npm
    8. Yeoman and Yeoman SharePoint generator
    9. Gulp
    10. Visual Studio Code
    11. Browser developer tools
    12. SharePoint Workbench
    13. Introducing Office Developer Patterns and Practices
    14. Office Developer Patterns and Practices in practice
    15. Contributing to Office Dev PnP
    16. Application life cycle management with SharePoint customizations
    17. Managing and versioning source code and assets
    18. GitHub
    19. Visual Studio Team Services
    20. Deploying, retracting, and managing solutions
    21. Summary
  11. Getting Started with the SharePoint Framework
    1. Setting up your development environment
    2. Step 1 - Installing Node.js
    3. Step 2 - Node package manager
    4. Step 3 - Installing Yeoman and Gulp
    5. Step 4 - Installing the Yeoman SharePoint generator
    6. Step 5 - Install Visual Studio Code
    7. Testing your SharePoint Framework development environment
    8. Step 1 - Creating a folder for the web part
    9. Step 2 - Running the Yeoman SharePoint generator
    10. Step 3 - Installing the developer certificate
    11. Step 4 - Running the web part on a local workbench
    12. Anatomy of the SharePoint Framework web part project
    13. Main folders and root level configuration files
    14. TypeScript basics in the SharePoint Framework
    15. Key files of the SharePoint Framework web part projects
    16. Summary
  12. Building Your First Web Part
    1. Creating a feedback list
    2. Creating the feedback web part project
    3. Setting web part basics
    4. Building feedback web part user experience
    5. Testing the user interface
    6. Saving the feedback
    7. Testing and troubleshooting the web part
    8. Ideas for fine tuning the web part for production use
    9. Using Office 365 to build better business process
    10. Building smarter controls
    11. Provisioning of the Feedback list and other resources
    12. Localization
    13. Localizing web part manifest
    14. Localizing texts
    15. Calendar and currency
    16. Summary
  13. Using Visual Studio Code and Other Editors
    1. Introducing Visual Studio Code
    2. Installing Visual Studio Code
    3. Getting to know Visual Studio Code
    4. Changing the color theme
    5. Working with files
    6. Extensions
    7. Working with the SharePoint Framework in Visual Studio Code
    8. Running commands with the Integrated Terminal
    9. Using Visual Studio instead of Visual Studio Code
    10. Summary
  14. Packaging and Deploying Solutions
    1. Overview of packaging and deploying
    2. Packaging SharePoint Framework solutions
    3. Using Gulp to package a project
    4. Deploying SharePoint Framework solutions
    5. App Catalog
    6. Installing the app
    7. Deploying assets
    8. SharePoint Online CDN and Microsoft Azure CDN
    9. Configuring a SharePoint Online CDN
    10. Updating the project to support a SharePoint Online CDN
    11. Deploying assets to a SharePoint Online CDN
    12. Configuring Microsoft Azure Storage CDN
    13. Updating the project to support Microsoft Azure CDN
    14. Deploying assets to Microsoft Azure CDN
    15. Summary
  15. Working with SharePoint Content
    1. Overview of working with SharePoint content
    2. Using mock data
    3. Using mock data with locally hosted SharePoint Workbench
    4. Step 1 - create data model
    5. Step 2 - create MockSharePointClient
    6. Step 3 - consume the mock data in the web part
    7. Accessing real data with SPHttpClient
    8. Working with SharePoint lists
    9. Requesting the list of lists with SPHttpClient
    10. Checking if the list exists and creating lists
    11. Working with SharePoint list items
    12. Creating an Office 365 Group and new SharePoint list
    13. Basic operation with SharePoint list items using SPHttpClient
    14. Step 1 - create a hello-listitems web part project
    15. Step 2 - add a data model for list items
    16. Step 3 - build the user interface for the web part
    17. Step 4 - define the function that will make SPHttpClient request to read list items and test the web part
    18. Step 5 - implementing the _runOperation function and building a skeleton for CRUD operation functions
    19. Step 6 - implementing the create operation
    20. Step 7 - implementing the read operation
    21. Step 8 - implementing the update operation
    22. Step 9 - implementing the delete operation
    23. Summary
  16. Working with the Web Part Property Pane
    1. Web part property pane
    2. Property panes in classic web parts
    3. Property panes in SharePoint Framework web parts
    4. Implementing a property pane
    5. Fields in property panes
    6. Implementing headers, groups, and fields
    7. Implementing multiple pages in property panes
    8. Handling property field events
    9. Implementing custom properties in a property pane
    10. Defining a custom field type
    11. Summary
  17. Using React and Office UI Fabric React Components
    1. Overview
    2. Understanding React
    3. React is declarative
    4. React is component-based
    5. Introduction to Fabric React components
    6. Fabric React support
    7. How to obtain Fabric React for your web part
    8. Using Fabric React components
    9. Button
    10. Dialog
    11. TextField
    12. Using React and Office UI Fabric React components in SharePoint Framework web parts
    13. Creating the SharePoint Framework React To-do web part
    14. Step 1 - Creating a React web part project
    15. Step 2 - Adding Office UI Fabric React to the project
    16. Step 3 - Examining the React project structure
    17. Step 4 - Creating the ITodoItem interface and mockup data
    18. Step 5 - Implementing a to-do list in React and Fabric React components
    19. Modifying the web part file
    20. Modifying the ReactTodo component
    21. Creating TodoItemComponent
    22. Summary
  18. Working with Other JavaScript Frameworks
    1. Overview
    2. Using jQuery in SharePoint framework web parts
    3. Loading jQuery from CDN
    4. Bundling jQuery to the web part package
    5. Knockout
    6. AngularJS and Angular
    7. Using SharePoint patterns and practices JavaScript Core Library
    8. Accessing user profiles
    9. Sending email
    10. Working with lists and list items
    11. Working with JavaScript libraries
    12. Additional considerations
    13. Summary
  19. Troubleshooting and Debugging SharePoint Framework Solutions
    1. Troubleshooting
    2. Ensuring an up-to-date npm
    3. Updating the Yeoman template version
    4. Troubleshooting the npm cache
    5. Optimization
    6. Optimizing the SharePoint Framework packages
    7. Loading external packages
    8. Debugging solutions
    9. Debugger statements using browser developer tools
    10. Debugging with source maps
    11. Debugging in Visual Studio Code
    12. Summary
  20. SharePoint APIs and Microsoft Graph
    1. SharePoint APIs
    2. SharePoint REST APIs
    3. Accessing SharePoint Online with CSOM using a console app
    4. Accessing SharePoint Online with REST using a console app
    5. Accessing REST APIs with SharePoint Framework
    6. Microsoft Graph
    7. What is Microsoft Graph?
    8. Accessing Microsoft Graph with Graph Explorer
    9. Accessing Microsoft Graph with SharePoint Framework
    10. Summary
  21. The Future of SharePoint Customizations
    1. The future of SharePoint developers
    2. Our recommendations for developers
    3. The SharePoint Framework support in SharePoint 2016
    4. Is SharePoint Framework the final framework for SharePoint developers?
    5. Summary

Product information

  • Title: SharePoint Development with the SharePoint Framework
  • Author(s): Jussi Roine, Olli Jääskeläinen
  • Release date: September 2017
  • Publisher(s): Packt Publishing
  • ISBN: 9781787121430