►
Description
This tutorial will guide you on how to deploy your application customizer to SharePoint site using the SharePoint Framework version 1.10 from February 2020.
You can find a written version of this tutorial from following location - https://dev.office.com/sharepoint/docs/spfx/extensions/get-started/hosting-extension-from-office365-cdn.
January 2020 version using SharePoint Framework 1.10.
More details around SharePoint Framework from http://aka.ms/spfx
Get involved on the SharePoint & Microsoft 365 Patterns and Practices - reusable controls, components, open-source projects, community calls and much more. See more details from http://aka.ms/sppnp
Sharing is caring!
A
Welcome
to
this
getting
started,
which
happened,
framework,
extensions
tutorial
series-
and
this
is
tutorial
for
hoster
extension
from
office,
365
CDN,
also
known
as
hello
world
part
4.
So
in
a
part,
1
2,
&
3
will
be
creating
our
solution
and
the
extension
our
first
application,
customizer
extension,
who
is
tested
it
out
and
modified
the
code
and
dusted
out,
intercept
SharePoint
sites.
A
So
tutorial,
4
is
quite
simple
if
you
have
gone
through
the
web
part
tutorials
before
this
might
be
super
familiar
for
you,
but
let's
walk
through
and
what's
actually
happening
here.
So
let's
go
back
on
our
Windows
10
machine.
We
will
be
left
off
in
the
tutorial
or
part
tree.
We
just
left
off
on
the
fact
that
everything
is
running
and
everything
is
serving
properly
on
the
page,
but
it's
actually
closing
up
the
console.
A
Let's
clean
up
the
console
slightly
and
what
we
want
to
do
this-
that
we
want
to
install
SharePoint,
Online,
Management
Shell,
and
you
want
to
make
sure
that
you
always
have
the
latest
and
greatest
available
which
you
can
actually
download
from
in
the
PowerShell
gallery.
So
I
can
actually
go
quick,
clinking,
a
quick
linking
from
there
and
from
the
powershell
gallery.
You
always
get
the
latest
and
greatest
shape
onto
online
management
show
by
running
the
install
module
named
Microsoft
online
sharepoint
powershell.
A
So
that's
a
really
easy
way
of
installing
the
latest
version
and
whenever
and
there's
a
new
version
typically
available
once
a
month
except
for
the
December
2019,
where
when
they
will
say
the
December
is
always
a
break
on
the
relay
cycle.
Now,
after
you
have
installed
to
SharePoint
Online
management,
sure
we
are
able
to
then
configure
our
office
365
at
10:00
on
settings
and
let's
actually
make
sure
that
everything
is
up
and
running
in
this
tenant
as
well.
A
So
we're
gonna
run
now:
connect
SPL
service,
I'm,
gonna
copy,
the
URLs
and
everything
from
the
documentation
and
pasting
that
one.
Obviously
the
tenant
name
is
slightly
different
in
my
case,
so
let's
actually
copy
that
one,
because
it's
dependent
on
the
tenant
name.
So
let
me
actually
go
and
change
the
tenant.
A
My
tenant
is
M
3,
6,
5,
X,
9,
4,
9,
3,
6,
7,
7
and
and
I'm
gonna
run
the
connect
espl
service,
and
then
we
can
assign
in
the
distant
by
using
it
at
administrator,
so
we're
able
to
then
manage
the
tenant
settings
or
sharepoint
online.
An
administrator
should
be
enough
actually
for
the
sharepoint
for
the
CDN
settings,
but
to
be
fair,
I
can't
confirm
that
as
we're
recording
this
video
now
now
we're
connected
on
the
tenant.
A
So
if
I
execute
that
powershell
commandlets
look
at
the
status
of
true
and
we
also
can
verify,
for
example,
the
other
settings
in
this
tenant
so
get
SPL,
tenant,
CD
and
origins,
and
in
the
city
and
type
of
complic,
we
can
actually
say
that
it
is
using
the
default
settings
in
this
tenant.
So
if,
for
whatever
reason?
Well,
if
you
skip
the
web
for
tutorials
and
in
your
tenant,
the
CDN
isn't
enabled
we
highly
recommend
actually
do
it
on
technically,
you
can
still
use
asset
packaging.
A
You
can
still
to
automatically
use
automatic,
hosting
and
deployment
mechanism
record.
This
is
to
say,
then
enabled
enough.
The
CDN
only
improves
performance
of
your
extensibility
and
actually
a
normal
communication
sites,
a
modern
theme
sites
and
publishing
sites
as
well.
So
it
has
a
lot
of
art
of
benefits
and
benefits
by
enabling
that
to
Orton
on
now,
let's
actually
go
back
on
our
solution
and
do
some
packaging
and
deployments
and
making
sure
that
everything
is
running
properly.
A
A
That
is
still
absolutely
supported.
Adoption
is
fine,
but
because
we
don't
want
to
do
that.
In
this
case,
we
want
to
take
advantage
of
automatic
hosting
automatics
need
an
automatic
deployment,
and
everything
good
is
what
we
have
in
a
SharePoint
framework.
Let's
not
actually
touch
to
Freud
manifest.json
file
at
all.
Now
we
want
to
package
our
file.
It's
going
to
be
really
easy
and
fast,
so
rates
actually
do
a
cop
bundle
and
let's
do
ship
so
we're
actually
getting
everything
ready
for
deployment
in
our
JavaScript
files
and
in
our
assets.
A
And
there
we
go,
culpa
bundle
has
completed,
and
then
we
do
call
up
god:
I
hate
solution
and
duster
sheep
to
actually
pack
it's
a
new
version
of
our
SP
pkg
fall,
which
is
now
fully
ready
to
be
deployed.
That's
such
and
this
is
as
clean
as
I
can
send
it
to
you
in
email
and
say:
hey
put
it
in
your
tenant
and
it
will
just
break
because
without
any
additional
external
dependencies,
because
everything
is
automatically
hosted
and
deployed
to
your
tenant
level
as
well.
So
let's
actually
do
that.
A
Let's
make
sure
that
everything
is
up
and
running
so
I'm
not
going
to
run
localhost
anymore
in
here
we're
gonna
go
to
the
solution
folder.
We
can
actually
see
that
that's
the
latest
version
which
is
just
compiled
in
my
timezone
and
then
I'm
gonna
go
to
app
catalog.
There's
my
app
catalog
and
let
me
go
to
the
apps
for
SharePoint
and
let's
actually
track
and
drop
the
new
version
to
our
app
catalog.
It's
gonna
ask
do
we
want
to
replace
the
file,
and
so
it's
actually
yes
really
important
thing
here
to
notice.
A
We
are
actually
now
updating
the
following
domains,
section
to
say:
SharePoint
Online,
so
it's
no
longer
saying
that
assets
will
be
hosted
from
localhost.
There
will
be
automatically
hosted
from
SharePoint
Online,
true
to
CDN
in
this
case,
because
the
CDN
is
enabled
again
one
of
my
dinner
and
a
video
file
has
been
updated.
So
everything
should
be
good
to
go.
A
A
We
would
given
the
updated
package
in
the
up
cattle
and
it's
going
to
be
then
served
directly
from
the
disk
from
the
CDN
and
we
can
actually
double
check
the
city
in
rendering.
Quite
simply,
if
you
go
to
the
developer
tools,
we
can
actually
see
that
we're
getting
the
assets
served
from
the
client-side
components.
There
is
our
hello
world
application
customizer
and
that's
getting
actually
served
from
the
App
Catalog.
What
using
the
CDN
URL
and
that's
where
actually
the
information
is
then
getting
rendered
on
that
page
in
the
in
the
ship.
A
But
that's
it
for
the
part
for
support
for
is
quite
fast.
Quite
simple.
If
you
have
already
enabled
office
register
five
CDN
in
your
tenant,
if
you
haven't,
then
you
need
to
use
the
SharePoint
Online
PowerShell
to
enable
done
in
your
channel,
and
it
is
definitely
recommend
that
way.
If,
for
whatever
reason
you
wouldn't
want
to
use
the
office,
365
CDN,
you
don't
actually
have
to-
and
everything
would
work
here
except
the
URL
ways
we're
seeing
on
here
in
the
network
would
be
pointing
directly
to
the
app
catalogs
URL.
A
So
it
wouldn't
have
the
prefix
of
public
City
and
SharePoint
Online
that
come
in
front
of
it,
so
it
would
download
that's
automatically
from
the
App
Catalog.
So
no
changes
again
on
your
code.
We
can't
les
East
office,
365,
sayin,
enabled
or
not
really
important
thing
to
understand,
but
that's
it
for
the
extensions.
Now
we
went
through
part
one
two
and
three
and
a
four
where
we
started
by
creating
an
application,
customized
I
were
tested
out.
We
extended
the
code
with
the
advantage
of
placeholders.
A
Then
we
tested
it
out
on
the
pages
while
still
serving
from
the
from
your
local
host
and
then
the
final
step
was
really
taking
advantage
of
the
autos
register,
five
seed
in
and
the
asset
packaging
by
serving
everything
automatically
for
you
in
the
site's,
pretty
cool
setup,
and
if
you
continue
on
the
tutorials
will
do
also
the
list
via
comments
on
and
the
field
customizers
in
the
following
tutorials.
So
that's
it
for
the
application
customizers.
Thank
you.