GV

GeezerVison

The World Wide Web, restored to 800 pixels of glory.

Home|About|Gaming cabinet|Archives|How it works|Starter sites

On this site

  • Sign in
  • ActionsCI/CD and automation
  • CodespacesCloud development environments
  • All Features
  • Documentation
  • Training
  • Certifications
  • Build with Copilot
  • Customize Copilot
  • Integrations
  • Trending repos
  • GitHub Sponsors
  • Developer articles
  • Enterprises

This view

  • Original page
  • New address

GeezerVison is showing github.com — GitHub - microsoftgraph/msgraph-sample-angularspa: This sample demonstrates how to use the Microsoft Graph JavaScript SDK to access data in Office 365 from Angular single-page applications.

BranchesTags
Open more actions menu

Latest commit

 

History

329 Commits
329 Commits

Folders and files

NameName
Last commit message
Last commit date
.github
.github
 
 
graph-app
graph-app
 
 
.gitattributes
.gitattributes
 
 
.gitignore
.gitignore
 
 
CODE_OF_CONDUCT.md
CODE_OF_CONDUCT.md
 
 
LICENSE
LICENSE
 
 
README.md
README.md
 
 

Repository files navigation

page_type sample
description This sample demonstrates how to use the Microsoft Graph JavaScript SDK to access data in Office 365 from Angular single-page applications.
products
ms-graph
office-exchange-online
languages
typescript

Microsoft Graph sample Angular app

Node.js CI License.

This sample demonstrates how to use the Microsoft Graph JavaScript SDK to access data in Office 365 from Angular single-page applications.

NOTE: This sample was originally built from a tutorial published on the Microsoft Graph tutorials page. That tutorial has been removed.

Prerequisites

To run the completed project in this folder, you need the following:

  • Node.js installed on your development machine. If you do not have Node.js, visit the previous link for download options. (Note: This tutorial was written with Node version 16.4.2. The steps in this guide may work with other versions, but that has not been tested.)
  • Angular CLI installed on your development machine.
  • Either a personal Microsoft account with a mailbox on Outlook.com, or a Microsoft work or school account.

If you don't have a Microsoft account, there are a couple of options to get a free account:

  • You can sign up for a new personal Microsoft account.
  • You can sign up for the Microsoft 365 Developer Program to get a free Office 365 subscription.

Register a web application with the Azure Active Directory admin center

  1. Open a browser and navigate to the Azure Active Directory admin center. Login using a personal account (aka: Microsoft Account) or Work or School Account.

  2. Select Azure Active Directory in the left-hand navigation, then select App registrations under Manage

  3. Select New registration. On the Register an application page, set the values as follows.

    • Set Name to Angular Graph Sample.
    • Set Supported account types to Accounts in any organizational directory and personal Microsoft accounts.
    • Under Redirect URI, set the first drop-down to Single-page application (SPA) and set the value to http://localhost:4200.
  4. Choose Register. On the Angular Graph Tutorial page, copy the value of the Application (client) ID and save it, you will need it in the next step.

Configure the sample

  1. Rename the oauth.example.ts file to oauth.ts.

  2. Edit the oauth.ts file and make the following changes.

    1. Replace YOUR_APP_ID_HERE with the Application Id you got from the App Registration Portal.
  3. In your command-line interface (CLI), navigate to this directory and run the following command to install requirements.

    npm install

Run the sample

  1. Run the following command in your CLI to start the application.

    ng serve
  2. Open a browser and browse to http://localhost:4200.

Code of conduct

This project has adopted the Microsoft Open Source Code of Conduct. For more information see the Code of Conduct FAQ or contact [email protected] with any additional questions or comments.

Disclaimer

THIS CODE IS PROVIDED AS IS WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.

About

This sample demonstrates how to use the Microsoft Graph JavaScript SDK to access data in Office 365 from Angular single-page applications.

Topics

angulardevxsamplemicrosoft-graph

Resources

Readme
MIT license

Code of conduct

Code of conduct
Activity
Custom properties

Stars

67 stars

Watchers

6 watching

Forks

59 forks
Report repository

Releases

Packages

Used by

Contributors

Languages

You are visitor 01402503 — GeezerVison does not store the pages you look up.
Best viewed with Netscape Navigator 4.7 or Internet Explorer 6 at 800×600. No cookies required.