►
From YouTube: NEAR + Bundlr + Arweave dApp adding features
Description
Hey Nearians,
This workshop walks you through using NEAR to upload data on Arweave, in this workshop, we will build a public square app using React a NEAR Wallet, the bundler network, and Arweave. The tutorial is broken down into several bite-size videos, that are 20 - 30 minutes long on average.
Tutorial Repository: https://github.com/twilson63/public-square-app
Arweave Dev Discord: https://discord.gg/928jQzsA
About Presenter: Tom Wilson - twilson632 on Discord
A
In
this
session,
we're
going
to
add
some
additional
features
to
our
public
square.
App
one
feature
is
the
ability
to
add
topics
and
to
show
the
topic
link
and
to.
A
Do
some
dynamic
queries
with
topics
and
users,
so
the
first
part
is
displaying
the
topic
link
and
what
we
want
to
do
is
head
on
over
to
our
post
dot
jsx
file
in
our
components
directory,
and
we
want
to
create
a
function
inside
the
post
item
component
just
under
the
use
effect
code.
So
just
under
this
code
before
we
return
our
component,
we
want
to
create
this
render
topic
function
that
we're
going
to
call
with
a
topic
and
it's
going
to
add
a
link
to
our
component.
A
So
that's
our
render
topic
and
then
inside
the
return
of
the
component.
Just
under
the
post
row,
we
will
add
that
function,
call
so
render
topic,
props,
dot,
post
info
topic,
and
so,
if
we
have
a
postinfo.topic
property,
we
will
show
that
in
our
post
item
component
now.
In
order
to
add
that
we
need
to
modify
the
create
post
info
function
in
our
api,
so
we'll
go
over
to
our
api
function
and
we'll
add
a
couple
of
declarations
here
where
we'll
essentially
parse
out
the
topic
from
the
tags.
A
Property
if
the
tags
property
exists,
so
then
we'll
just
do
node.tags
dot.
Fine-
and
this
is
coming
from
our
transaction
tags-
are
a
header
on
the
transaction
and
we'll
say
if
a
tag,
name
and
tags
are
objects
with
a
name
property
and
a
value
property.
So
if
the
name
property
equals
topic
with
a
capital
t,
then
we'll
we'll
grab
that
topic
tag
object
and
then
we'll
basically
pull
out
the
value
of
that
topic
tag
if
it
exists.
A
So
if
the
object
exists,
we're
just
going
to
pull
out
that
value
or
we'll
just
set
our
topic
to
null
and
then
in
our
post
info,
we'll
place
topic
in
there
and
now
we
should
be
able
to
save
and
then
let's
go
ahead
and
take
a
look
at
our
public
square
app
and
hopefully
we
see
some
topics.
A
There's
one
there's
another,
there's
another,
pretty
cool.
Okay,
so
we've
we're
showing
topics.
Now,
let's
add
the
ability
to
add
a
topic
up
here
in
our
form.
So
let's
go
to
the
new
post
jsx
and
what
we
want
to
do
is
create
a
new
hook
and
we'll
call
it
topic.
Value
set
topic,
value
and
we'll
use,
react,
dot,
use
state
and
we'll
set
it
to
empty
and
then
we'll
add
a
handler
here
function
on
topic
changed,
and
this
will
be
a
an
input
handler
and
then
we'll
say:
let
input
equals
e
target
dot
value.
A
And
that
should
give
us
our.
A
Topic
input
for
our
form,
so
let's
handle
that
and
then
the
the
last
thing
we
need
to
do
is
in
our
post
button
click.
We
need
to
include
the
the
tag
for
the
topic
value,
so
we're
going
to
say.
A
A
A
A
Cool
and
there
you
see,
we
have
our
topic,
so
the
next
thing
we
want
to
do
is
set
up
our
query:
that's
listing
our
post
to
be
dynamic
and
that
way
we
can.
Click
on
twitter
and
it'll
show
all
the
twitter
tags
or
click
on
a
user
and
it'll
show
all
the
user
tags
right.
Now,
it's
just
showing
everything.
A
Let's
make
that
happen.
So
we
have
this
build
query
function
in
our
api
and
let's
go
ahead
and
adjust
that
function
to
be
a
little
bit
multi-purpose
right
now.
It's
just
grabbing
everything
let's
set
up
if
we
take
an
object
that
has
a
count,
address
and
topic
and
then
we'll
set
that
object
equal
to
an
empty
object
as
default,
so
the
default
functionality
would
be
to
return
all
the
you
know,
the
main
feed
from
the
public
square
and
now,
let's
set
count
if
it's
not
already
set
to
math.min
100,
count
r
100.
A
A
Variable:
okay,
now,
in
our
query,
object
we're
just
going
to
add
these
filters
in
the
transaction
filter
section
here,
so
I'm
just
gonna
copy
these
and
paste
them
just
so
I
don't
create
some
silly
type
of.
A
A
We
call
build
query
and
we
want
to
pass
in
owner
address.
A
A
With
this
public
square
app,
we
already
wired
up
the
topic,
results,
components
and
the
user
results
components.
So
if
everything
goes
well
then
this
should
all
just
just
work.
So
if
I
come
in
and
click
on,
twitter
now
should
filter
to
the
twitter
topic,
and
if
I
come
in
and
click
on
a
user,
it
should
filter
for
that
that
wallet.
A
Okay,
so
we
may
need
to
check
that
out,
but
that's
kind
of
the
the
gist
of
it
and
we'll
figure
out
what's
going
on
with
the
owner
address
thanks.