►
Description
The SharePoint Starter Kit provides a compressive provisioning and customization framework for your SharePoint projects and deployments. Join us and get a jump start on how best to take this project and make it your own. See how the provisioning process works and make it work for you. Learn how the SharePoint Framewwork components fit together and how best to extend them for your organization.
Speaker: Eric Overfield (PixelMill) | @EricOverfield
Supporting materials:
• SharePoint Starter Kit - http://aka.ms/sp-starter-kit
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
A
What
we
found
is
all
of
these
different
tools
often
can
be
kind
of
overwhelming,
and
it
would
be
nice
to
see
what
a
solution
would
look
like
when
you
put
some
of
these
tools
together,
the
sp
starter
kit
seeked
to
answer
that,
for
you
and
say
hey,
so,
we've
got
things
such
as
pnp
powershell.
We
have
pnp
provisioning.
We
have
all
of
these
sharepoint
framework
web
parts
that
have
been
built
within
the
community
or
hey.
A
You
know,
if
you
put
all
these
things
together,
here's
this
more
comprehensive
idea
of
what
what
this
could
look
like
and
the
sp
starter
kit
really
looked,
pull
all
that
together
as
a
demonstration,
as
a
overview
of
if
you
took
some
of
these
other
things,
you
put
them
into
your
own
custom
solution.
You
could
drive
even
this
much
more
value
out
of
microsoft,
365.
A
originally,
of
course
starting
with
sharepoint,
but
now
extending
beyond
that
now
version
two
was
released
in
the
middle
of
2020,
but
one
of
the
things
that
really
is
important
to
about
the
sb
starters
kit
is
it's
a
starter,
but
it
was
never
really
designed
to
be
used
straight
up
out
of
the
box
in
production.
It
was
designed
to
be
a
great
technology
demonstrator
for
end
users
for
power
users
for
community
champions
who
wanted
to
show
hey.
A
This
is
what
could
be
possible,
but
definitely
it's
also
a
great
starting
point
for
developers
or
citizen
developers
to
say
hey
here.
Is
this
comprehensive
solution
and
here's
all
the
source
code
put
together
with
a
pretty
comprehensive
documentation
to
say
cool?
What
can
you
do?
That's
the
value
I
want
to
get
out
of
this
session
is.
A
I
want
to
show
you
how
to
take
the
starter
kit
as
is
and
expand
upon
it,
and
and
do
more
with
it
we're
going
to
dive
into
a
couple
of
key
areas
that
we
we
found
is
where
we
can
get
some
of
the
most
value
out
of
this.
So
we'll
start
with
who
I
am
my
name-
is
eric
overfield.
I
am
president
co-founder
of
piximo,
I'm
also
a
microsoft
regional
director,
a
microsoft
mvp
in
the
office
apps
and
services
space.
A
One
of
the
things
that
I
love
about.
My
job,
though,
is
I
get
to
work
with
the
community
a
lot
I
get
to
work
with
technology
a
lot
and
I
get
to
help
share
that
that
knowledge
and
share
the
the
learnings
that
I've
seen
within
different
enterprises
and
help
pull
that
together
and
and
offer
it
off
to
the
community
and
part
of
that.
So
I'm
one
of
the
project
co-leads
of
the
sp
starter
kit.
You
can
get
a
hold
of
me
at
ericoverfield.com
or
at
eric
overfield.
A
If
you
ever
are
looking
to
reach
out
to
me
and
say,
hey
here's
some
things
we
want
to
do.
Let's
work
as
a
community
to
make
that
all
happen,
so
what
I
think
would
be
really
important
right
now,
though,
a
very,
very,
very
quick
overview.
What
the
starter
kit
is
just
we
can
level-set
everybody
there's
a
lot
of
other
documentation
and
videos
on
how
to
really
dive
into
it.
A
So
I
just
want
to
get
an
overview
of
it,
though,
in
an
overview,
then,
of
the
structure
of
it
and
then
would
like
to
do
is
look
at
two
key
things:
two
key
areas
that
we
have
found
where
you
can
really
take
the
starter
kit,
where
I
think
it
does
a
really
good
job.
How
you
can
then
take
that
and
make
it
your
own
use
this
as
a
starting
template
to
extend
to
work
within
your
specific
tenant
organization.
A
A
In
particular,
look
at
some
of
the
newer
features
of
the
sharepoint
framework
around
libraries
and
so
that
let's
go
ahead
and
dive
right
in
let's
go
ahead
and
look
at
what
the
starter
kit
is
and
how
you
could
use
this
project
today
within
your
organization
and
how
you
could
show
off
some
features
to
maybe
project
sponsors
or
to
those
within
your
organization
who
are
confused
as
to
what's
currently
possible,
so
the
starter
kit
kind
of
to
level
set
in
case
it
is
new.
In
case
you
are
new
to
the
starter
kit.
A
You
can
always
find
it
at
github.com,
pnp,
sp,
starter
kit,
it's
pretty
easy.
It's
over
on
github
and
totally
open
source
completely
available
use
it.
However,
you
want
everything
in
there
is
licensed
for
the
community.
The
concept
behind
the
starter
kit,
though,
originally,
has
been
this
comprehensive
solution.
Where
we
looked
from,
we
we
looked
to
build
not
just
provisioning
but
also
pulled
together.
Custom
framework,
custom,
sharepoint
framework
web
parts
within
the
provisioning
how
to
to
provision
those
web
parts.
All
is
one
thing
that
that
actually
does
then
work.
A
So
it's
a
demonstrator
a
demo
of
all
these
features.
Put
together
in
a
nice
cohesive
way,
this
was
built
around
sharepoint.
We
are
looking
to
extend
that
well
into
teams
and
to
other
platforms
within
the
microsoft
365
ecosystem,
though,
but
it
currently,
the
the
primary
focus
is
on
provisioning
and
custom
components
within
sharepoint
put
into
something
that
you
could
demo
as
soon
as
you've
installed
it.
The
starter
kit
again
can
go
back
to
this
idea.
A
That
is
this
example
of
what
can
be
done
and
really
what
we're
looking
to
do
with
this
project
is:
give
you
this
inspiration
of
of
what's
possible.
So
when
you
see
the
really
cool
tools,
such
as
pp,
powershell
and
pcp,
provisioning
and
and
customizations
that
are
possible,
I
I
using
sharepoint
framework
like
what
could
you
do?
What's
it?
What's
a
good
example
of
that
or
how
could
you
use
provisioning
to
provision
not
just
one
site
but
multiple
sites,
because
you're
looking
to
build
a
provisioning
solution
which
provisions
a
new
project?
A
Let's
say
you
need
multiple
communication
sites
and
team
sites
with
navigation
and
hubs
and
all
that
kind
of
stuff.
How
could
you
put
all
that
together
and
that's
what
this
project
seeks
to
do?
It's
not
designed,
as
I
said,
to
be
production.
This
is
what
it
is
and
you
don't
ever
customize
it.
It's
designed
to
be
that
starting
place
for
you
now,
if
you're
looking
to
extend
this
particular
extend
the
provisioning
and
the
installation
aspect
of
it.
A
I
provided
another
link
here,
which
is
basically
you're,
going
to
be
going
to
the
provisioning
folder
of
the
project
and
you're
going
to
find
all
the
documentation
you
need.
So
let's
go
ahead
and
like
let's
go
look
at
the
code
because
I
think
that's
what
it
really
is:
pretty
super
cool
and
really
valuable
and
important,
but
we're
going
to
start
at
the
starter
kit
project
page.
This
is
sort
of
the
we
find
to
be
a
really
really
great
place
to
get
started.
A
If
you
go
ahead
and
you
from
this
project
page
one
of
the
first
things
you
really
wanna
gonna
do
is
scroll
down
and
you're
gonna
find
your
your
pre-requirements
and
you're
getting
started.
So
if
we
quickly
go
to
getting
started
the
installation
process,
once
you
pull
this
project,
you're
gonna
be
connecting
to
the
the
tenant
that
you
want
to
install
this
to
and
there's
a
whole
bunch
of
prerequisites
here
you
but
you're
going
to
be
connecting
to
your
tenant.
A
Once
you
connect
to
the
tenant
from
the
provisioning
folder
of
this
solution,
you're
going
to
apply,
use
the
pnp,
powershell
apply,
ppe
tenant,
template
you're,
going
to
apply
startkit.pnp,
that's
going
to
take
somewhere
in
the
order
of
8
to
10
minutes,
and
that's
going
to
go
ahead
and
provision.
Three
things:
it's
going
to
free
primary
sites,
it's
going
to
provision
a
communication
site,
and
then
it's
going
to
provision
to
team
sites
that
that
communication
side
is
going
to
be
a
hub
that
the
team
sites
are
automatically
provisioned
to
now.
A
If
we
want
to
quickly
go
see
what
that
looks
like
so,
you
can
now
see
what,
after
the
provisioning
is
done.
This
is
what
you're
going
to
get
you're
going
to
get
a
communication
site
that
has
all
of
this
content.
You
see.
All
of
it
is
going
to
be
pre-filled
out.
So
everything
you
see
here
is
exactly
what
you
should
see
as
well.
In
fact,
it's
the
same
imagery,
the
same
content,
because
this
also
provisions
news
it
provisions
pages.
It
provisions
the
hub
navigation,
it
provisions
the
team
sites
that
we
talked
about.
A
So
you
can
see
we
go
to
team
site,
it's
already
been
provisioned.
Let's
see
what
else
has
custom
web
parts
that
you'll
find
it's.
It's
customizing
the
navigation
automatically
using
a
creating
the
the
mega
menu
if
we
go
over
to
the
tenant,
catalog
you're
going
to
see
a
lot
of
web
parts,
so
this
is
something
that
was
done
in
v2,
where
we
split
out
all
of
the
spfx
web
parts
into
their
own
solutions.
So
it'd
be
much
more
easy
for
you
to
take
each
individual
one,
all
right!
A
So
there's
some
general
specific,
there's
some
general
objectives
that
we're
really
looking
to
seek
with
this,
which
we
talked
about.
That's
something.
I
definitely
recommend
that
you
read
it's
going
to
help.
You
understand
a
little
more.
What
v2
is
attempting
to
address,
then
there's
another
really
cool
thing:
you
can
do
that
we
talk
about
which
is
all
the
custom
web
parts.
So
again,
I'm
at
the
home
page
here
and
I'm
clicking
on
custom
web
parts,
and
you
get
a
list
of
all
of
the
web
parts
that
have
been
added.
A
These
are
included
directly
within
the
solution,
but
they're
fully
open
source.
You
can
do
whatever
you
want.
You
can
tweak
them
all
of
these
are
these
web
parts
to
me
are
much
more
ready
for
prime
time
I
I've
seen
these
in
production
and
I
feel
pretty
safe,
supporting
them
that
yeah
these
are.
These
would
be
ready
for
production.
But
that
being
said,
use
this
and
take
this
code
and
and
definitely
make
it
your
own.
A
So
once
you
go
ahead
and
get
this
code
and
download
this
code,
one
of
the
cool
things
that
was
recently
added
is
this
code
tour.
So
if
you
don't
have
the
code
tour
extension
in
visual
studio
code,
you
can
go
ahead
and
download
that
that's
just
an
extension.
It's
called
code
tour
and
once
you
do
that,
if
you
want
to,
you
can
go
ahead
and
start
the
tour
and
the
code
tour
will
walk
you
through
the
code.
Okay,
let's
go
ahead
and
let's
just
stop
this
code
tour.
A
Let
me
go
ahead,
though,
and
go
through
a
couple
of
the
key
primary
folders
that
I
really
want
you
to
to
pay
attention
to.
So,
first
of
all,
within
the
project
itself
there
is
the
provisioning
folder.
Now
the
provisioning
folder
really
holds.
One
main
thing
that
I
care
about
here,
which
is
the
starter
kit.pnp
file,
some
of
these
other
files-
you
might
not
see
there
so
there's
the
starterkit.pnp.
A
Now
this
is
a
pdp
provisioning
bundle
that
was
created
by
taking
a
pnp
provisioning,
xml
template
and
bundling
it
together
with
all
of
the
assets
and
resources
that
might
be
needed.
So
it's
one
big
file.
This
includes
all
the
spfx
files.
Everything
the
other
thing
I
do
think
of
this
interest
here
that
you
would
care
about,
is
my
opinion.
Is
the
reamy.md
file
there's
some
really
good
information
here
now.
The
other
really
big
thing
that
was
added
to
v2
was
the
source
folder.
A
Now
the
source
folder,
the
big
stuff
that
is
here,
is
all
of
the
solutions
for
the
spfx,
what
components
and
whatnot
another
thing
that
was
added,
though,
was
the
templates
folder,
and
so
the
templates
folder
includes
a
list
of
xml
files
that
are
all
of
your
pnp
provisioning,
xml
files,
very
important
places
where
I
suggest
you
start
to
look-
would
be
that
provisioning
folder
and
the
sources
folder.
Okay,
so
that's
sort
of
like
the
quick
overview.
A
So
let's
go
ahead
and
let's
dive
into
some
key
aspects
here
and
I've
been
talking
a
lot
about
the
the
provisioning
component.
So
let's
go
ahead
and
like
let's
dive
right
in
the
pnp
provisioning
bundle
that
dot
pnp
file
we
already
saw
was
in
the
provisioning
folder.
Now
you
can,
of
course
create
your
own,
and
that's
like
this
big
cooling.
You
can
customize
what
we've
provided,
but
you
can
create
your
own.
The
source
files
I
showed
you
were
in
that
slash
source,
slash,
template
templates,
folder.
So
here's
the
two
big
commands.
A
I
want
you
to
know,
though
the
first
one
is
the
read:
pnp
tenant
template
command
now,
you're,
looking
at
a
commandlet
here
that
would
have
been
run
from
the
provisioning
folder.
So
what
we're
doing
here
is
we're
basically
saying
go
ahead
and
read:
starterkit.xml
save
it
as
the
dollar
sign
kit
variable.
The
second
big
command
I
want
you
to
know
is
the
save
pnp
tenant
template.
You
take
in
a
an
input
template
in
this
case
we're
taking
in
that
variable
and
we're
placing
it
we're
going
to
output
it
to
something
else
such
as
starterkit.pnp.
A
That's
all
there
really
is
to
it.
So
what
I
want
to
do,
let's
take
an
example.
How
would
you
actually
do
this?
You
might
go
to
the
tenant
folder,
you
might
take
the
starter,
kit.xml
file
copy
and
paste
it.
So
now
you
have
the
starter
kit,
you
know
copy.xml
and
you
may
say:
okay.
Well,
I
really
want
to
name
this
starter
kit
now
from
here.
What
would
you
do?
A
Well,
one
of
the
first
things
you
might
do
is
start
to
look
through
it
and
say:
well,
I
don't
maybe
need
all
of
this
stuff,
or
maybe
we
want
to.
You-
can
see
one
of
the
first
things
that
we
do
is
we
apply
a
whole
bunch
of
assets
into
the
tenant,
app
catalog.
Well,
we
found
that
side
note
here
and
in
some
of
the
installations
we've
been
helping.
People
with
we
found
that
there's
there's
problems
applying
provisioning,
the
spfx
components
directly
into
that
catalog.
So
maybe
you
need
to
do
that
manually.
A
You
can
just
go
ahead
and
you
can
delete
that
whole
section
now
when
you
create
this
new
provisioning
template
here
from
this
starter
kit,
hyphen
mine.xml
file
to
it
would
be
a
starter
kit,
hyphen
mind.pnp
file
that
wouldn't
that
would
happen.
You
could
just
work
through
this
whole
thing
and
start
to
see,
what's
happening
here
and
start
to
break
this
down
and
see
how
things
are
built.
So,
let's
go
ahead
and
let's
look
at
the
sequence
of
events.
A
A
That's
going
to
be
the
type
as
a
communication
site,
and
it's
actually
going
to
be
using
three
provisioning
templates
to
help
define
and
and
structure
what
this
communication
site
should
do
now,
if
we
kind
of
keep
going
down,
we'll
see
that
oh
wow
look
at
that
there's
all
these
terms,
this
whole
term
store
component.
Maybe
we
don't
need
that?
Maybe
we
don't
want
to
add
the
terms
directly
in
at
this
point,
because
maybe
we've
already
done
it
we're
doing
manually.
Maybe
we
need
to
change
it.
A
If
we
start
looking
at
this
template,
we
can
find
setting
up
some
site
fields
and
I'm
going
to
jump
us
down
to
something
else.
I
think
is
super
cool,
which
is
the
client
side
pages
you'll
find
a
provisioning
template
down
below
in
this
whole
file,
which
talks
about
creating
pages,
actual
weight
pages
with
sections
and
there's
all
these
controls.
These
are
the
sharepoint
framework
web
parts
you're
like
wow,
I
mean
there's
some
really
cool
crazy
stuff
going
on
here.
A
So
if
you
ever
want
just
the
demo
of
like
what
provisioning
can
do,
what
a
provisioning
template
could
look
like
this
is
your
place
to
start
just
go
grab
starterkit.xml
from
the
provision
source
templates,
folder
and
you
have
a
great
template.
I've
already
created
the
starter
kit,
hyphen
demo.xml
file,
it's
pretty
lean.
What
we're
doing
here
is
I'm
doing
some
just
general
localization,
I'm
doing
no
tenant
settings,
I'm
creating
one
provisioning,
one
communication
site.
Excuse
me:
I'm
going
to
be
running
two
provisioning
templates.
A
On
top
of
that,
the
root
template
is
setting
a
theme
setting
a
header
and
footer.
It's
setting
some
basic
navigation
and
it's
going
to
be
creating
just
one
client-side
page
with
just
a
few
web
parts
to
it,
so
I've
really
stripped
this
down
and
by
the
way
I
just
said
you
know,
let's
just
go
ahead
and
have
it
add
in
a
bunch
of
files
as
well.
A
Okay,
so
a
couple
commands
that
I
told
you
that
were
super
important
all
right,
so
the
first
one
is
the
to
read
in
the
template.
Now
you
can
see
that
I'm
in
the
provisioning
folder,
so
here
I'm
running
the
read
pnp
tenant
template
command,
lit
I'm
going
to
be
reading
in
that
starter
kit,
hyphen
demo
file
that
I
just
showed
you
all
right.
Let's
read
that
in
and
the
next
thing
we
want
to
do
is
we
would
like
to
save
that
tenant
template.
A
The
reason
why
it's
pretty
large,
because
it
does
have
it
actually
bundled
in
those
files
that
I
wanted
to
add
with
it,
which
you
know
all
righty
so
now
what
we
would
need
to
do
is
we
would
need
to
go
ahead
and
connect
to
sharepoint
so
that
we
can
go
ahead
and
apply
this
provisioning
template.
Let's
go
ahead
and
connect
to
our
site
in
question.
A
So
the
idea
here
is
using
all
of
these
components
really
is
a
launch
pad
into
your
own
custom,
provisioning
and
delivery
process.
So
take
the
web
parts
that
you
think
are
important.
You
don't
have
to
use
the
provisioning
template
if
you
don't
want.
If
all
you
want
are
a
few
of
the
web
parts,
great
use
them.
Take
the
sp
pkgs,
throw
them
into
your
tenant.
catalog.
Take
the
source
code.
A
Put
them
in
your
own
project,
your
own
repo,
you
know
work
with
your
team
to
make
them
just
super
cool
and
and
do
whatever
it
is
that
you
want
with
them.
So
one
of
the
things
that
we
really
wanted
to
show,
though,
because
really
the
the
web
parts
is
no
different
than
any
any
sharepoint
framework
web
part
you
just
you
have
them
all.
A
What
we
thought
was
really
cool
and
what
we
wanted
to
be
able
to
show
was
how
you
can
take
some
of
the
other
components
that
microsoft
has
released
and
put
them
into
a
larger
project,
and
one
of
those
is
the
library's
functions
that
are
available
to
us
that,
where
we
can
build
reusable
code,
so
one
of
the
thoughts
that
we
had
was
well.
You
know
a
reusable
code
that
is
pretty
common,
would
be
something
like
multilingual,
where
you
might
have
a
whole
bunch
of
multilingual
strings
that
you
would
want
to
use
in
multiple
projects.
A
You
don't
want
to
have
all
of
the
multilingual
strings
in
every
single
solution.
You'd,
like
all
of
your
different
solutions
to
use
one
common
library,
you
could
update
upload
that
one
update
that
one
common
library
and
then
all
of
the
solutions
that
are
using
it
would
automatically
receive
that
new
code
base.
But
we
also
wanted
to
extend
that
and
said:
hey
you
know.
Something
else
that
you
can
do
is
is
take
the
gulp
process
and
extend
that
okay.
So
a
couple
things
we're
going
to
be
doing
here.
A
One
is
this:
should
look
like
your
your
standard
common,
your
common
multilingual
found
in
spfx,
but
let's
go
ahead
and
create
banner
new
and
we're
going
to
give
this
a
a
string
new
banner
title
all
right
now,
normally,
what
you'd
find
is
the
my
strings.d.t.s
would
include
a
whole
bunch
of
the
that
it
would
just
it
would.
It
would
describe
the
interface
that
was
the
multilingual
aspects
of
it
and
something
else
we
wanted
to
show,
though,
was
this
other
idea
of
where
you
might
want
to
create
your
own
interface?
A
That
was
really
based
off
the
enums
so
that
you
could
more
easily
utilize
your
custom
strings
within
other
projects,
where
you
didn't
always
remember
what
things
were
called
so
what
we
wanted
to
do
to
help
automate.
This
whole
process
was
build
a
gulp
task
which
would
help
generate
a
local
keys
enumeration
based
on
all
of
the
strings,
found
and
say
the
english
version.
Let's
just
say,
english
is
going
to
be
our
root,
and
so
what
we
did
here
is
you:
have
this
sculpt
file
just
generate
local
keys.js?
A
It
has
a
has
a
specific
task
generate
local
keys.
What
this
will
do
is
it's
going
to
add.
The
build.rig
comes
from
sharepoint
framework.
That's
adding
a
prebuilt
task
to
generate
this
local
keys.
If
this
file
is
utilized,
it
will
then
run
through
this
and
the
output
is
the
localkeys.ts
file.
Now
how
we
did
all
of
this
was
we
go
ahead
and
we
require
in
gulpfile.js,
so
anytime
the
gulp
file
is
used.
A
It
will
automatically
go
and
require
the
generator
key
localkeys.js,
which
has
that
the
build
rig
preload
and
it
will
auto,
always
regenerate
this
code
base.
So,
let's
look
at
as
an
example.
If
we
go
to
localkeys.ts
and
we
go
to
the
bottom,
we're
going
to
see
that
the
the
bottom
string
is
the
placeholder
button
label
all
right.
So
let's
go
ahead
and
let's
go
to
this.
Is
the
library
and
let's
do
a
gulp,
build
all
right
and
what
we'll
then
see
it
already
happened?
Is
the
local
keys.ts
file
automatically
got
a
new
update?
A
Isn't
that
kind
of
cool?
So
it's
all
automated
things
you
can
do.
This
is
what
the
starter
kit
is
looking
to
do
is
help
pull
together
more
than
what
you
might
see
out
of
the
box
and
how,
in
a
larger
production,
build
within
a
larger
tenant,
you
might
extend
what
the
framework
can
do
or
what
the
out-of-the-box
features
were
designed
to
do
using
just
general
methodologies
around
gulp
et
cetera,
okay.
So
let's
go
ahead
and
let's
see
that
how
a
specific
site
might
how
a
specific
component
might
use
this.
A
So,
let's
look
at
react,
followed
sites,
that's
one
of
the
components
we
have.
That
is
already
using
this.
If
we
go
to
package.json
you'll
see
that
package.json's
already
set
up
to
use
the
starter
kit
shared
library,
and
if
you
want
to
then
see
how
it's
being
used,
we
can
go
into
the
web
part
and
we
can
see
we
are
importing
the
shared
library
from.
A
We're
importing
the
locals,
etc
from
the
shared
library
and
if
we
just
go
ahead
and
go
and
look
for
that,
we
would
find
how
we're
using
all
of
these
aspects
to
be
able
to
pull
in
how
we're
able
to
pull
in
these
shared
strings
from
say.
The
react
followed
sites
spfx
web
part,
how
we're
pulling
in
from
the
library
those
those
common
strings.
A
Now,
let's
go
ahead
and
let's
look
at
the
the
component
itself,
so
followed
sites
is
actually
doing
the
same
thing,
so
it's
also
being
able
to
pull
in
some
of
these
components
now.
What
I
want
to
do
here
is
just
to
make
things
kind
of.
You
know
to
me
just
a
little
more
interesting
and
whatnot.
We
can
just
add
in
here
a
I'm
going
to
add
in
a
div
oops
there
we
go.
A
And
we're
going
to
pull
in
the
sites
or
the
banner
new
now
did
you
see
that
already
knew
banner
knew
where
it
came
from?
It's
not
cool,
so
the
code
visual
studio
code
was
able
to
look
at
my
dependencies
is
able
to
help
me
figure
that
out
give
me
the
type
of
head
to
say.
Oh
hey,
I
know
that
local
keys
is
an
enum
and
that
it
has
that
value
and
it
allowed
me
to
not
even
I
could
just
start
typing
in
and
I
could
start
to
see
some
of
these
things
come
together.
A
Okay,
so
let's
go
ahead
and
let's
see
what
we
would
have
typically
out
of
the
box
without
without
doing
anything
in
particular.
So
what
I'm
going
to
do
is
I'm
going
to
edit
this
page,
I'm
going
to
go
ahead
and
I'm
going
to
add
in
the
followed
sites
and
it
works,
and
my
title
doesn't
have
anything
new
in
it.
No
big,
surprise
there.
A
So,
let's
search
for
followed
we're
going
to
find
that
the
follow
sites
web
part
is
coming
from
the
proper
client
side
assets,
which
is
what
we're
looking
for
right
now,
and
I
also
want
to
show
you,
the
library,
the
sp
starter
kit,
shared
library
is
also
coming
from
that
now.
What
I
want
to
do
is
because
I
want
to
do
some
some
local
building,
I'm
going
to
go
ahead
and
go
to
source.
A
A
I
react,
followed,
gulp
bundle
up.
So
what
we're
going
to
do
like
this
might
be
a
common
development
practice
you
might
have
where
you're
going
to
replace
the
whoops,
not
solutions.
It's
just
solution,
you're
going
to
replace
the
sppkg,
that's
in
the
app
catalog
with
what
would
be
a
local
build,
so
instead
of
having
the
the
bundles
being
loaded
from
the
cdn
or
from
from
sharepoint
et
cetera
you
to
happen
from
localhost
as
part
of
your
dev
process,
so
gulp
package
solution.
A
This
is
the
they're
followed
sites.
Now,
let's
see,
if
I
save
the
file,
I
did
perfect
okay.
So
now
what
we
need
to
do
is
we're
going
to
copy
over
the
we're
going
to
copy
over
the
new
spkg
files
from
the
library.
So
I'm
copying
over
the
library
now
this
is
the
new
library
bundle,
that's
going
to
be
pulling
from
localhost
and
let's
go
ahead
and
pull
in
the
followed
sites
and
follow
the
sites,
and
what
we
should
see
here
on
a
bundle
is
here
so
for
a
web
part
extension.
A
Libraries-
don't
do
this
it'll
tell
us
where
it's
coming
from
perfect.
So
let's
go
ahead
and
we'll
do
a
gulp
serve
serve
no
browser
and
we'll
do
the
same
thing
over
on
gulp
serve
no
browser.
Now
this
actually
should
also
make
you
kind
of
like
go.
Hey
wait
a
second.
How
could
you
run
two
sharepoint
framework
components
at
one
time,
because
you
typically
couldn't
do
that?
A
The
way
we
did
that
was,
we
went
into
serv
in
the
library
in
config,
we
went
into
serve.json
and
we
actually
changed
the
port
for
the
spfx
for
the
xbfx
library
to
not
use
four
three
two
one,
but
to
use
four
through
two
one,
one
that
way
we
could
actually
run
both
projects
at
once
and
that
sharepoint
framework
kind
of
handles
all
that
extra
plumbing.
For
us,
there's
really
nothing
more.
A
We
need
to
do
all
right,
so
let's
go
ahead
and
we
will
refresh
this
page
and
it
already
kind
of
did
exactly
what
we
were
hoping
for.
Okay,
so
you
can
see
here.
The
new
banner
title
that
came
in
is
that
string.
We
actually
can
see
that
if
we're
looking
at
the
starter
kit,
shared
library,
dot,
js
file
is
pulling
from
localhost
43211
and
we
did
the
same
thing
over
on
followed.
We
would
see
the
same
thing.
We
would
see
that
follow
site's
web
parts
being
pulled
from
localhost
as
well.
A
So,
of
course,
you
can
just
take
sharepoint
framework
webparts
that
are
included
in
the
source
and
you
can
do
whatever
you
want
with
them.
You
can
rebuild
them
bundle
them.
You
can
do
all
kinds
of
cool
stuff
make
them
your
own,
but
one
of
the
cool
things
that
we
really
thought.
We
hope
you
would
enjoy
and
be
able
to
utilize
and
see
and
practice
like
hey.
A
Add
them
into
this
project,
update
the
provisioning
template
so
easy
to
do
all
this
and
really
extend
this
project
and
just
do
make
it
do
whatever
it
is.
You
want,
of
course,
we're
always
looking
for
anything
else
that
could
be
done.
If
there's
other
ideas,
you've
got
and
you
want
to
send
things
back
in
the
community,
say
hey,
I
did
this
really
cool
thing.
We
should
try
it
please,
please
do
try
it
we're
always
looking
for
feedback
on
this
session.
I
would
love
to
know
what
you
thought.
A
So
please
do
use
the
aka,
the
ms
feedback
link
you
see
here.
I
really
appreciate
your
time.
Good
luck
with
your
your
your
solutions,
you
can
be
building
and
I
look
forward
to
hearing
all
about
the
successful
stories
you
have
around
what
the
starter
kit
did
for
you.
Thank
you
and
have
a
great
rest
of
the.