►
From YouTube: Community demo - React image gallery client-side web part with dynamic taxonomy search
Description
This community call demo is taken from the SharePoint Framework community call recording on 11th of April 2019. In this video, Ejaz Hussain (Content and Code) demonstrates a React based client-side web part which can be used to find relevant images based on taxonomy tagging.
Presenter - Ejaz Hussain (Content and Code) - @EjazHussain_
The code sample is available from https://github.com/SharePoint/sp-dev-fx-webparts/tree/master/samples/react-image-gallery
Full details on the community call from https://developer.microsoft.com/en-us/sharepoint/blogs/sharepoint-framework-community-call-recording-11th-of-april-2019/
More details on the SharePoint dev community calls from http://aka.ms/sppnp.
A
Hi
guys,
my
name
is
each
other
saying
and
I
hope
you
all
can
see.
My
screen
here
is
my
Twitter
handle
and
blog
and
there's
also
link
for
that
sample
available
under
a
speed
of
effects.
Webparts
wrapper
on
github,
and
so
so
let
me
go
to
actually
show
you
how
the
web
part
look
like,
and
then
we
can
talk
from
day,
okay,
so
so
this
is
how
the
web
part
actually
look
like,
and
so
the
couple
of
things
basically
in
in
this
report.
A
This
is
not
really
complex,
but
it's
a
couple
of
different
components
add
together,
so
make
it
more
functional.
So
we
have
in
this
report,
we
have
a
FPF
extract,
reusable
control
for
taxonomy
picker,
and
we
have
another
search
box
which
use
for
a
type
search,
and
so
this
is
a
list
of
images
coming
from
the
image
library
and
another
component
we
have
in
here
is:
we
have
implemented
server-side,
pagination
and
also
so
so.
Just
preview
first
we'll
show
you
the
demo,
and
then
we
can
look
into
the
quickly
code
as
well.
A
Now,
if
I
go
into
the
property
pain,
so
you
can
simply
give
a
name
of
the
library
which
is
I
have
here
open?
Is
the
image
library
and
I
have
added
a
few
sample
images
and
then
for
protection.
A
picker
I
have
I
really
want
tons,
which
you
can
tag
with
dispose
of
Department
and
for
for
the
search
for
type
search,
I'm
pointing
to
the
title
of
the
images.
A
A
A
Yeah,
so
we
have
abused
our
office
fabric
UI
panel
component,
so
it
will
take.
It
will
basically
take
that
image
you
reflect
and
also
will
display
a
list
of
all
the
tagging
which
are
associated
with
that
image
so
that
they
potentially
this
can
be
used
not
just
for
images.
You
can
use
the
same
report
for
documents
as
well.
The
in
terms
of
the
filtering,
if
I,
let's
say
I,
have
a
department
for
sale.
So
if
again,
this.
A
Yes,
basically
pull
up
all
the
sales
related
images
and
the
same
thing
goes
and
when
I
cancel
this
one
and
it's
going
to
go
back
to
reset
automatically
and
if
I,
when
I
start
typing
anything
that's
P.
Probably
the
boat
is
going
to
it's.
Basically,
you
know,
use
the
type
search
and
match
the
title
of
the
images
and
bring
back
those
images.
So
you
can
search
let's
shop
looking
for
shop.
It
will
basically
think
that
I
bring
that
that
does
a
demo
or
for
the
web
part,
and
if
we
quickly
look
in.
A
So
there
are
a
couple
of
things
here
which
I
can
quickly
show
you
drive
so
because
I'm
I'm,
building
the
pagination
myself
and
so
I
need
to
need
to
kind
of
a
keep
record
off
humming
items
uploaded
before
and
then
construct
the
rest
API
URL
accordingly.
So
that's
why
I'm
using
URL
collection
and
filter,
curiouser
and
curiouser
luxury?
A
A
I'm
also
checking
for
this
ordinary
auditor
dot
next
link
and
and
based
on
that,
because
I'm
keeping
put
it
into
the
collection
and
when
I
click
on
the
next
and
the
previous
button,
I
basically
subtract
and
add
these
and
update
the
statuses
and
accordingly,
the
so
quick
one.
So
you
would
have
you
can
so
I
have
a
method,
we
own
click
Next
on
click,
previous
and
then
I
have
a
filtering
on
tax
text
me.
Picker
change
and
I
will
search
change
which
basically
get
the
theory
and
power.
A
B
Really
cool
stuff,
I
think,
and
that
would
be
really
nice
to
have
a
kind
of
a
generic
service
and
because
this
makes
a
lot
of
sense
actually
there's
this
lot
of
cool
stuff
related
on
loading,
the
URLs
and
loading
the
data
and
then
filtering
the
data
but
or
some
example.
You
had
a
post
on
that
one.
Thank
you,
David
for
sharing
the
links
and
the
blog
post,
and
also
did
the
sample
really
really
useful
sample
of
showing
how
to
make
this
basics,
but
not
just
basic
stuff
work.