►
Description
In this guidance video, we concentration how to build Microsoft Teams personal apps using SharePoint Framework. We introduced a capability to build Microsoft Teams tabs with SharePoint Framework with the v1.8 and with the 1.10, you can also implement personal apps with SharePoint Framework.
Any SharePoint Framework web part can be updated to be a Microsoft Teams tab or personal app without requirements for code changes, just by updating solution metadata - it does not get easier than this.
Key advantages on using SharePoint Framework for the Microsoft Teams development are the following:
- Unified development experience with Microsoft Teams, SharePoint and Office add-ins (currently in preview)
- Automatic hosting of your solution - no need for Azure web sites or other host setup
- Streamlined deployment and operations - You can simply deploy your solution as Microsoft Teams app using UX elements available for administrators with one click publishing of your solution
- Easy management of Graph and API permissions with the SharePoint Framework model
- Direct access on underlying storage and other services in SharePoint and OneDrive
- Optimized load times with Office 365 CDN settings automatically applied, if feature is enabled in the tenant level (it's free, so you should do it)
Video covers following assets and resources:
- Step-by-Step tutorial for creating Microsoft Teams tab or personal app using SharePoint Framework - https://docs.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/get-started/using-web-part-as-ms-teams-tab
- Office 365 CLI - for easy solution upgrades (it's magic) - https://pnp.github.io/office365-cli/
- Leads solution - Works as a Teams tab, Teams personal app, SharePoint app page or SharePoint web part - https://github.com/SharePoint/sp-dev-solutions/tree/master/solutions/LeadsLOBSolution
More details around the different assets and community efforts from http://aka.ms/sppnp
A
Hello
in
this
video
we'll
have
a
look
on.
How
can
you
build
Microsoft,
Ames
personal
apps,
easily
with
SharePoint
framework,
and
this
is
as
easy
as
it
gets,
because
using
SharePoint
framework,
you
do
not
need
to
worry
about
hosting
deployments
operations
or
even
optimizations,
because
we
actually
host
everything
for
you
automatically.
You
can
crank
the
permissions
for
their
certain
permissions
available
for
the
for
the
API
usage
and
we
even
optimize
the
flow
using
office
365,
if
that
it's
enabled
in
a
tenant
level.
A
So
really,
if
you're,
looking
into
exposing
simple
enterprise
applications
in
the
Mike's
of
themes,
but
not
even
necessarily
it's
that
simple,
even
but
exposing
enterprise
applications
in
Microsoft
in
SharePoint
framework
is
definitely
the
easiest
way
to
get
started
and
we're
seeing
a
lot
of
adaption
on
this
model
and
also,
more
importantly,
any
existing
SharePoint
framework
solution
can
be
exposed
as
a
Microsoft
themes.
Personal
application
within
the
matter
of
minutes-
and
this
is
really
also
the
key.
So
you
can
actually
and
take
advantage
of
the
existing
investments.
A
So
nobody
has
to
worry
about
all
of
that
stuff.
So
how
do
we
actually
get
started
on
this
one?
So
let
me
actually
jump
to
a
processor
and
we
kind
of
concentrate
on
the
upgrade
scenario
in
this
case
and
if
you're
not
familiar
of
what
is
a
ship
on
the
framework.
I
strongly
recommend
you
to
go
through
or
SharePoint
framework
tutorial
videos
and
the
series
and
there's
quite
a
few
videos
and
examples
how
to
get
started
on
creating
a
SharePoint
framework
solution.
A
And
we
have
an
explicit,
add
tutorial,
which
is
explaining
how
to
get
started
on
building
myself
theme
stamps
using
SharePoint
framework.
So
quite
simple,
tutorial
and
I
think
the
video
is
like
15
minutes
and
you
can
easily
run
through
the
process
and
it
is
as
simple
as
possible
and
you're
using
all
of
the
greatest
web
stack
development,
tooling.
The
latest
versions
of
react
and
all
that
stuff,
so
really
really
cool.
Now
what
if
you
have
an
existing
solution,
or
you
have
gone
through
this
process
to
follow
up
and
create
your
first
Microsoft
team
stamp?
A
So
how
do
I
get
that
existing
solution
and
make
that
to
be
exposed
as
a
personal
application
or
personal
app
for
the
Microsoft
team's
users
and
let's
actually
concentrate
on
that
scenario
and
slightly
touch?
Oh,
so
if
you
have
an
existing
older
version
of
SharePoint
framework,
how
do
I
actually
upgrade
to
the
right
level,
because
the
personal
application
support
gained
with
the
SharePoint
framework
1.10?
So
let's
actually
work
this
through
one
step
at
a
time
doesn't
take
too
long,
but
trust
me.
It's
definitely
worthwhile
to
go
through.
A
So,
first
of
all,
we're
gonna
use
our
example
scenario
here,
which
is
the
lead
lopa
solution.
This
is
quite
nice,
a
scenario
which
we
originally
implemented
for
I
think
SharePoint,
Conference
2018
and
then
we've
been
evolving
that
since
then,
I'm
not
sure
if
it
was
even
myself
theme
stamps
at
the
time,
but
then
we
implanted
that
as
much
the
theme
stamps
and
all
that
stuff.
A
So
it's
quite
a
nice
solution
and
demonstrating
how
to
integrate
to
lob
systems
and
surfacing
data
in
in
SharePoint
Online
in
cloud,
potentially
even
using
your
own
premises,
data
which
is
a
slight
sidetrack
on
the
discussion.
So
that's
not
actually
we
go
there
now
this
application
and
the
solution
originally
was
based
on
a
SharePoint
framework
1.8.
So
how
did
we
upgrade
this?
To
use
SharePoint
framework
1.10
was
that
we
use
office
365,
see
align
if
you're
not
familiar
with
this
tooling.
Please
have
a
look
on
this.
A
This
is
absolutely
brilliant,
cross-platform
tool
which
gives
you
the
capability
of
managing
office,
365
tenant
settings,
and
in
this
case,
more
importantly,
it
gives
you
an
actual
insights
on
how
to
upgrade
your
solution.
So
if
you
go
to
the
SharePoint
3
work
project
and
upgrade
and
that's
actually
a
command
which
executes,
for
example,
using
the
switches
to
version
one
point
10
and
getting
out
good.
For
example,
in
MD
Foreman,
you
will
get
a
list
of
all
of
the
actions
to
be
applied
to
upgrade
your
solution
between
the
different
versions.
A
So
you
can
specify
a
target
version
if
you
don't
specify
a
target
version,
it's
going
to
upgrade
to
the
latest
version
as
well
and
typically
when
we
release
a
new
version
of
SharePoint
framework,
we
pretty
much
on
the
following
day
or
so
or
even
following
hours.
We
actually
release
a
new
version
of
austerities
to
our
CLI,
with
the
latest
guidance
on
how
to
upgrade
to
a
solution.
So
in
our
case
that
would
actually
mean
that
I'd
now
pull
down
my
that
solution
from
github.
They
lob
a
solution.
A
You
can
absolutely
download
that
it
is
a
full,
fully
open
source
and
you
can
use
it
any
way
you
want
and
basically
using
the
office.
365
CLI
is
nothing
more
than
actually
is
telling
the
CLI,
and
when
it's
actually
installed,
you
can
simply
use
the
command
line
tooling,
and
your
sunblock
SPF
X
project
upgrade
as
the
command
in
our
case,
and
we
already
upgraded
the
solution
to
one
point.
Ten
version
so
there's
nothing
to
be
upgraded,
so
everything
is
already
in
the
right
version.
A
So,
but
if
that
would
not
be
the
case,
you
would
get
an
actually
list
of
actions
to
be
applied
in
the
solution
to
make
the
solution
a
version
to
match
the
latest
one
so
pretty
pretty
awesome
to
to
take
advantage.
Now.
How
do
we
then
take
an
existing
web
parts
or
a
teams?
Tab
implementation,
ship
one
framework
and
expose
that
as
a
micro
as
a
personal
application
in
Microsoft
teams?
Well
without
any
code
changes,
of
course,
because
we
want
to
make
it
as
simple
as
possible.
A
So
this
is
the
existing
implementation,
and
this
is
the
metadata
for
the
web
part.
So
there's
our
leads
web
part,
basically
matching
and
individual
at
tap
or
a
web
part
rendering.
So
if
I
go
back
in
the
picture,
it
is
that
functionality
over
there
or
that
functionality
over
there
it's
same
functionality
as
being
exposed
in
multiple
different
applications.
So
how
do
we
actually
then
define
that
hey?
We
would
like
to
have
this
one
exposed
also
as
a
personal
app.
A
Well,
it's
nothing
more
than
updating
our
support
and
in
this
report
it
hosts
elections,
we're
gonna,
say
yep,
and
we
want
this
to
be
also
a
personal
app
saving
and
that's
it,
and
basically
we
are
good
to
go
so
only
thing.
What
we
now
need
to
do
is
call
it
bundle.
Let's
do
golf
bundle
ship,
so
we
can
actually
prepare
our
solution,
making
sure
that
we
have
a
bundle
on
bundles
available
for
packaging
once
retrieve
onto
a
tree.
A
This
will
actually
take
one
because
it
is
a
relatively
complex
solution
and
not
well
not
super
long,
but
it
will
take
a
while
to
actually
comply.
It's
basically,
the
section
is
the
one
which
will
take
a
while,
so
we'll
speed
up,
potentially
this
section
in
here
to
save
some
time.
Well,
actually
that
wasn't
too
fast.
A
No
and
the
ticket
command
is
then
go
up
package
solution,
so
we're
gonna
do
a
repackaging
of
the
solution
as
an
SB
pkt
file,
which
I
now
can
send
an
email
to
somebody
else,
and
they
will
get
the
same
result
and
then
again,
no
hosting
required.
No,
nothing.
Everything
is
automatically
hosted
for
us,
so
making
it
really
super
easy
to
expose
the
functionality
in
a
tenant
level
cute.
A
So
let's
actually
open
up
that
folder
in
File
Explorer
and
in
the
SharePoint.
We
can
actually
say
that,
based
on
the
github
updates-
and
that
is
now
the
latest
version-
certain
leads
lob
SP
big
data
file
waiting
to
get
deployed
in
the
tenant
cute.
So
in
my
case
we
wanted
to
actually
walk
this
through
as
well.
So,
in
my
case
in
my
tenant,
we
already
have
the
themes
application
running
in
the
team,
so
it
is
actually
being
exposed
to
older
version
of
the
themes
you
might
have
this
situation.
It
might
not
have
this
situation.
A
We
wanted
to
actually
walk
through
the
process
of
upgrading
as
well.
Now,
since
we
have
this
solution
already
available,
we
cannot
just
update
the
latest
version
of
SOE
pkt
file
to
the
SharePoint,
app
catalog
and
synchronize
the
solution
to
Microsoft
team,
so
how
we
need
to
approach.
This
is
to
actually
go
to
the
Apps
section
and
let's
go
to
our
organizational
view
where
you
can
save
different
applications
which
I've
installed.
A
Let's
get
rid
of
the
leads,
so
I'm
going
to
delete
and
get
rid
of
the
the
third
Reid's
application,
because
I
want
to
install
a
new
version
which
will
support,
also
personal
apps
exposure,
and
now
we
can
actually
go
to
the
App
Catalog
SharePoint
app
catalog,
let's
go
to
the
App
Catalog
listing
in
my
case.
I
have
quite
a
few
solutions
available
here,
one
of
them
being
the
leads
Alok.
The
application
so
either
way
I
could
override
this
or
I
can
actually
go
here
and
delete
the
existing
solution.
That's
fine
as
well
so
delayed
document.
A
Let's
get
rid
of
that
and
we
had
to
updated
solution.
Packets
available
there
we
go
nothing
more.
You
could
actually
get
this
one,
an
email
from
a
trusted
partner.
You
could
get
this
one
to
your
tenant
or
whatever,
or
you
can
download
it
from
Internet
as
well
as
SB.
Pkt
file
is
available
from
there,
but
always
be
careful
when
you're
installing
stuff
here
ten
on.
So
you
need
to
understand
that
we
aren't
actually
running
in
a
full
trust,
client-side
code
here,
so
you
need
to
understand.
A
What's
inside
of
this
with
a
case,
you
fall
and
I
want
to
actually
make
it
available
across
all
of
this
side.
So
that's
more
impactful
for
SharePoint
side
of
the
house,
not
really
on
the
team
side
for
time
being
cute.
So
now,
if
I
scroll
down-
and
you
can
do
here-
we
can
actually
see
that
that
solution
is
available
in
the
App
Catalog
of
SharePoint,
but
that
doesn't
mean
that
it's
yet
available
in
the
team
side.
A
So
for
now,
since
we
do
not
have
yet
a
unified
app
kabak
between
the
teams
and
sharepoint,
we
need
to
do
things
in
a
two
different
steps,
but
you
potentially
know
or
notice
this
one
already.
So
I
can.
Actually
we
have
this
functionality
called
sync
to
teams,
and
because
this
solution
contains
so
packages
and
parts
which
are
targeted
for
microsoft
themes,
we
could
just
easily
do
sync
two
teams
and
that
functionality
will
be
basically
then
visible
in
here.
A
We're
able
to
on
the
top
right
corner
we're
able
to
see
the
status
of
the
notification
successfully
synched
team
solutions,
that's
good,
that's
being
synced
on
the
team
side,
and
that
means
that,
after
a
while,
when
we
actually
click
and
the
build
for
SB
p4m
trees
is
defined
the
organizational
kellogg.
We
can
actually
see
the
solution
here
available.
A
Now
this
one
actually
will
take
a
while
to
refresh
so
there
is
a
caching
functionality
in
the
teams,
which
is
showing
only
subset
of
the
solutions
and
apps
after
a
while
and
really
depends
on
the
luck
when
the
solution
is
available.
But
in
our
case
actually
we
were
super
lucky
and
to
the
cashing
exploit
and
we're
able
to
actually
see
the
leads
in
here
we
are
able
to
see
that
it
can't
be
a
tap
or
it
can
be
a
personal
app.
Well,
that
was
easy.
A
So
only
thing
what
we
needed
to
do:
no
manifest
updates,
no
nothing
whenever
we
clicked
the
sync
two
teams,
but
only
here
based
on
the
web
part
settings
SharePoint
automatic
the
creation
of
the
team's
manifest
so
as
simple
as
it
gets.
Based
on
the
settings
of
the
web
part,
we
basically
created
to
the
manifest
file
automatically
for
you
now.
You
could
also
manually
create
the
manifest
file
and
manually
deploy
it
in
here.
So
that's
definitely
an
option
as
well.
But
again
we
can
add
this
as
a
personal
application.
A
So
let's
do
that,
let's
get
at
and
voila
we
have.
Our
personal
application
leads
exposed
in
the
left
navigation
and
that
obviously,
is
automatically
hosted
and
true
CDN
based
on
your
settings
and
optimized
and
deployment,
and
everything
is
completely
included
as
part
of
the
office
365
subscription,
it's
pretty
cool
and
although
now
I
can
do
stuff
like
pinning
this
application
to
the
left
menu.
So
whenever
I
come
back
on
teams,
this
solution
exists
here
or
potentially.
If
it's
a
let's
say
corporate
Moi's
solution,
you
can
pin
tat
to
a
specific
set
of
organizations
or
users.
A
You
can
target
application
specifically
to
a
certain
subset
of
people
based
on
their
attributes
as
well,
using
my
systems,
admin
Center,
but
that's
as
simple
as
it
gets
so
to
only
change
this
once
again
for
existing
web
parts
is
that
we
need
to
be
in
a
SharePoint
framework,
1.10
version.
If
you're
creating
a
new
version
of
SharePoint
framework
application,
then
that
is
so.
A
Does
that,
obviously
up
to
you
from
a
scenario
perspective
now
and
just
to
recap,
also,
if
you
are
interested
on
testing
out
and
this
solution,
it
is
available
at
github
that
comes
a
SharePoint,
/sb
dev
solutions
and
in
that
repository
solutions
and
leads
lob,
a
solution
is
the
one
which
actually
has
exactly
what
you're
saying
visible
right
now
in
here,
which
has
already
been
upgraded
to
work
as
a
personal
app.
So
it
has
been
already
updated
to
that
level.
A
But
that's
pretty
much
what
we
intended
to
go
here,
maybe
one
more
points
who
did
point
out
because
we
aren't
seem
to
be
getting
questions
related
on
this
one
as
well.
So
what
if
your
personal
apps
have
multiple
tabs,
which
the
personal
arms
absolutely
could
have,
so
you
can
definitely
do
that.
In
that
case,
you
would
not
actually
use
the
automatic
manifest
creation.
A
You
would
just
have
multiple
web
parts,
which
are
individual
web
parts
or
with
the
individual
web
parts
with
this
different
configuration
would
be
then
configured
as
individual
tabs
for
your
personal
application
and
but
again
you'll
have
the
benefits
of
automatic
hosting
automatic,
confident
operations,
CDN,
optimized
and
all
of
that
stuff,
and
from
here
you
can
certainly
still
call
web
api.
Could
access
on
ports
and
whatever
is
needed,
if
you
prefer
to
do
so,
but
as
the
simple
scenarios-
and
you
do
not
need
to
have
any
asher
instance
necessarily
even
available.