Build your own yammer app @ Collab365

Online Conference
June 17th and 18th 2015
WWW.COLLAB365.EVENTS
Build your own Yammer App

Agenda
• What about Yammer
• Integration with Yammer
• Yammer API
– REST API
– JavaScript SDK
– Yammer Embed
– Open Graph
• Yammer and .NET
• Takeaways & round up

What is Yammer?
• It allows organizations to extend their
systems socially by using one or more
social networks
• Create communities around
content
• What can you do?
– Send and receive messages
– Show activity around objects
– Follow and like messages, topics and
other information

Networks
• Internal network
– Also called a Home Network
– Private and secure collaboration space for company employees to connect
with their coworkers
– Only available for employees with verified corporate e-mail addresses
• External network
– Separate extension of your Home network
– Private and secure collaboration space for your company to engage with
users outside the organization
– Allows to invite users from outside your organization
– Access is invitation only

Yammer main structure

Example of Yammer network

Versions
Basic
(Freemium)
Enterprise
(paid)
Basic Yammer Features X X
Collaboration Features X X
Yammer Mobile X X
Apps X X
Admin Tools X
Network level Apps and integration X
Support and Services X

Roles and rights
• More information
– http://www.collabshow.com/2014/01/06/yammer-roles-permissions-drill-
down
Member All users are at least a member of the Yammer network. Ability to
use yammer.
Group admin The person who created a group becomes the group admin of that
group. It allows to add and remove members from that group.
Network admin / admin This role manages the network. This requires a “paid” network.
Verified admin The role has all the abilities and is sometimes called the one with
“God” rights. This requires a “paid” network.

Integration with Yammer

Integration possibilities
• SharePoint add-ins
– On-premises or online
• Office 365
• Office add-ins
• Azure Apps and Services
• Other platforms

SharePoint integration in Yammer
• Yammer Web Part
– Discontinued and stopped working on September 15th, 2015
(http://goo.gl/k2LuSs)
• Yammer Embed
– Microsoft’s single solution to integrate Yammer feeds into
SharePoint.
• Other options as document and list integration, federated
search, activity streams, single sign-on, admin
configurations
– http://support.microsoft.com/kb/2835453

SharePoint Add-ins explained
Add-in
Web
On-
premises
SharePoint
Add-in
Web
SharePoint
Online
Parent Web
(Host)
App Web
Add-in runs on local web server
or in the cloud.
High trust is needed!
Add-in runs on local web server
or in the cloud.
Provider-hosted
SharePoint Add-in
The add-in runs in a separate host
Or as a service. Use your own
Choice of server hosting
Architecture. Code is allowed!
SharePoint-Hosted Add-in
Creation of isolated sub web on a parent web
Contains only web elements
Examples are lists, out-of-the box Web Parts
No server code allowed, only client JavaScript for logic and UX

What are the possibilities?
• Embedding code directly on Page
– Publishing Page, Content Page, Any Page
• Your own custom
– Web Part
– User Control
• SharePoint Add-ins
– SharePoint hosted Add-in
– Provider-hosted SharePoint Add-in
• Azure Apps and Services
– Coding based on .NET, JavaScript or other
language at your choice

Best practices - APIs
Embed code
on page
User
Control
Web Part
SharePoint-
Hosted Add-
in
SharePoint
Provider-
Hosted Add-in
Azure Apps /
Service
Other
platforms
Yammer
Embed
Yes Yes Yes
Yes, with some
exceptions as
like, follow and
commenting
No Yes
Yes, if
JavaScript is
possible
Yammer JS
SDK
No Yes Yes Yes No Yes
Yes, if
JavaScript is
possible
REST API No
Yes, using
.NET code
Yes, using
.NET code
Yes, only
through
JavaScript calls
Yes, using .NET
code
Yes
Yes, mostly
through
Javascript calls

Yammer API

Yammer API overview
• Documentation
– Documentation got a lot better!
– http://developer.yammer.com/documentation
• Available APIs
– REST API
– JavaScript SDK
– Other SDKs for iOS, Windows Phone 8,
Ruby and Python
• Widgets with Yammer Embed
• Yammer uses the Open Graph protocol for activities
– <Actor> <Action> <Object> on <App Name> : <Message>
• Data returned as JSON

Register a Yammer App
• App registration
– Go to https://www.yammer.com/client_applications and register an App
– Register an App for testing
• What do you get back?
– Client ID = 8LIaFJoKeMB6SjDg3nI1LA
– Client Secret = dXHDf0hGYG0I268rtgn
JNUaq8jFJokEUqelVHKKwg
• Define a redirect URL
– Expected Redirect = http://www.yammer.com

DEMO
Register a Yammer App

Demo – Round up
• Registration of a Yammer App
– Use it for creating a test app to work on
• Publishing for use by others

REST API
• REST interface to Yammer resources
– Interface is mostly used by other APIs when accessing data
• Before accessing REST API
– Register an App at Yammer
– Your App needs to authenticate a Yammer user through OAuth 2
• Call REST API endpoints with an access token
• Documentation
– https://developer.yammer.com/docs/rest-api-rate-limits
– Each function has a “Try out!”

Authenticate – OAuth flows
• Server-Side flow
– Referred to as “Authorization Code Grant”
– Use whenever you call the Yammer API from your web
application server
• Client-Side flow
– Referred to as “Implicit Grant”
– Use whenever you need to make API calls from a client
such as JavaScript running in a web browser or from native
mobile or desktop applications

Authenticate – Server-Side flow
• Yammer uses OAuth 2
• User Authentication and App Authorization
– https://www.yammer.com/dialog/oauth?client_id=LIaFJoKeMB6SjDg1LA&redirect_uri=http://www.yammer.
com
– It requests to login and to authorize the App to use your data
• After successful login and authorizing the app your are redirected
– https://www.yammer.com/portiva.nl/?code=1U8BguaHAEJokENBsHO8wmcQ

Authenticate – Server-Side flow
• Get your Access Token
– https://www.yammer.com/oauth2/access_token.json?client_id=8daFanMJOkeB6SjDg31nI1LA
&client_secret=dXHD9f00I268rtgnJJokeNuUaq8j3tUqelVHKKwg&code=o3Su14YEuowqSJoke
Cfg
– Access Token can be found in the returned JSON

Authenticate – Client-Side flow
• Get your Access Token
– https://www.yammer.com/dialog/oauth?client_id=dIaFnMB6SJokEjg31nI1LA&redirect_uri=ht
tp://www.yammer.com&response_type=token
– Get access token from redirected URL
– https://www.yammer.com/portiva.nl/#access_token=bl7qByjG0CgVag2OJokEc8w
• Access token is valid for many years or longer

DEMO
Authentication

Demo – Round up
• Using REST API calls to authenticate an App
• Explained the different dialog popups you get
and when they are shown
• Getting the access token
• Explain the JSON payload returned

REST API - Resources
• Messages
– View messages like all, my feed, following,
private, received
– Posting messages
– Other like pending attachments, email
messages, view threads, likes
• Topics (#)
• Groups
– Join and leave groups
• Users
– Retrieve, view current user, view user, in
group, suspend or delete
• Relationships
– Show, add and remove organizational
chart relationship
• Notifications
– Get from current user
• Suggestions
– View and decline suggestions
• Subscriptions
– Check subscribed to thread or user
– Subscribe and unsubscribe
• Autocomplete
– Returns suggestions
• Invitations
• Search
• Networks
– List of networks
– Switch between network

REST API – Interesting endpoints
Endpoints Parameters
Messages
https://www.yammer.com/api/v1/messages.json
https://www.yammer.com/api/v1/messages/following.json
https://www.yammer.com/api/v1/messages/private.json
older_than
newer_than
threaded
limit
Users
https://www.yammer.com/api/v1/users/current.json
https://www.yammer.com/api/v1/users/[:id].json
Relationships https://www.yammer.com/api/v1/relationships.json user_id
Notifications https://www.yammer.com/api/v1/streams/notifications.json
Search https://www.yammer.com/api/v1/search.json
search
page
num_per_page

DEMO
REST API Call

Demo – Round up
• Use REST API to get information about the
current user and messages
• Explain about the JSON returned

REST API – Rate Limits
• API calls are subject to rate limiting
• Limits are per user per App
• Limits are independently from each other in the same time period
• More information
– https://developer.yammer.com/docs/rest-api-rate-limits#rate-limits
Requests in Seconds
Messages 10 30
Notifications 10 30
Autocomplete 10 10
All other resources 10 10

JavaScript SDK

JavaScript SDK
• Allows you to authenticate users and access Yammer through some
wrapper
• Newest version released on April 7th 2014
– New security features to enhance login techniques
• Using JavaScript is easy
• Use https://c64.assets-yammer.com/assets/platform_js_sdk.js
• Enter your Yammer App ID in the data-app-id parameter

JavaScript SDK - Authenticate
• Authentication is handled for you
• A cool Yammer login button

JavaScript SDK – Access data
• Make calls directly to the
Yammer REST API
– Use yam.platform.request

Yammer Embed

Yammer Embed
• A set of widgets to quickly create Yammer implementations
• Not many customizations possible
• Widgets like Specified feeds, Open Graph feeds, Action buttons and
Commenting
• Widget is block of script placed in:
– Content Editor Web Part
– Page
– SharePoint Hosted Add-in
• Needs a HTML Container 400 pixels or larger in your application
• Documentation
– https://developer.yammer.com/docs/embed

Yammer Embed – Script generator
• Embed script generation
– https://www.yammer.com/widget/configure
• Type of feeds
– Group, Open Graph, User, Topics, My feed

Yammer Embed – Single Sign-On
• Support for Single Sign On

Yammer Embed – Open Graph buttons
• Enables social interaction with systems like blog posts, content pages and
other content.
• It uses Open Graph objects
• Like button
– <user> likes <object>
– Bound to the URL of the object
• Follow button
– <user> follows <object>
– Bound to the URL of the object

Yammer Embed - Commenting
• Actually a Feed widget of the type “Open Graph”
• Can be used as commenting system for internal blogs or any line of
business application
• OG Object is created by the first user using it
• URL and OG metadata of page is used
• Other properties like header, footer, prompt text and more

Open Graph

Open Graph
• Is a light weight data integration protocol
• Activities are posted as OG Objects
• Format
– <Actor> <Action> <Object> on <App Name> : <Message>
– E.g. Alexander created Company meeting on YammerTestAppForPortiva : Lets meet!
• Description
Actor A Yammer user
Action A verb describing what happens. E.g. created, updated, deleted, liked, followed
Create your own verbs per App on yammer.com
Object Represents an instance in your App and are uniquely identified.
Supported are place, person, department, team, project, folder, file, document, image, audio,
video and company
App Name Name of your App doing the post
Message The message shown

Open Graph - Custom
• Create your own objects and verbs
• Define a namespace
• Object Type
– Singular form
– Plural form
• Action types
– Present tense
– Past tense

Open Graph - Custom
• An Open Graph Object is posted through the activity endpoint
– https://www.yammer.com/api/v1/activity.json
• Example JSON payload
{
"activity":{
"actor":{"name":“Alexander Meijers",
"email":“ameijers@portiva.nl"},
"action":"create", "object": {
"url":“http://www.yammer.com",
"title":“Corporate Meeting"
},
"message":“Lets meet!",
}

Yammer and .NET

Yammer.NET
• A way to use Yammer APIs in .NET applications
– Based on the .NET classes of Steve Peschka
http://blogs.technet.com/b/speschka/archive/2013/10/05/using-the-
yammer-api-in-a-net-client-application.aspx
• Connecting to Yammer
– Authentication through REST API calls by using WebRequest calls
– Setting the cookies (yamtrak_id and _workfeed_session_id)
• Serializing JSON data through .NET classes
• Access it from
– Console application
– Provider hosted App in SharePoint 2013

Takeaways & round up
• Documentation is nowadays better!
• The REST part is enough to create rich implementations
• Use access token to use yammer APIs on behalf of an user. Valid for
years.
• Use Yammer Embed to create Yammer implementations quickly and
with an ease
• Open Graph allows you to create your own objects within your
yammer implementation
• Using .NET building Yammer Apps is great. Especially with an
Yammer.NET Library

Stay tuned for more great sessions …

Build your own yammer app @ Collab365

More Related Content

What's hot

Similar to Build your own yammer app @ Collab365

More from Alexander Meijers

Recently uploaded

Build your own yammer app @ Collab365