►
From YouTube: React JS Meetup
Description
In this meetup we look at using react on the server, to wrap express and declaratively create an API server.
https://blog.hyper63.com/react-the-great-abstraction/
https://github.com/hyper63/react-server-demo
A
A
That's
why
I
kind
of
say
react.
The
planet.
You
can
build
command
line,
applications
with
react.
You
can
put
react
on.
I
think
I've
seen
some
stuff
with
hardware
or
animations
music,
just
about
anything
you
think
can
think
of,
but
just
a
few
weeks
ago
I
found
this
library
react-nil
and
this
library
kind
of
allows
you
to
think
about
react
on
the
server.
A
So
with
that,
that's
what
we're
going
to
do
today,
we're
going
to
see
if
we
can't
get
react
to
work
on
the
server-
and
I
don't
know
I
I
kind
of
call
it
mad
science.
It
might
not
be
mad
science,
but
but
we'll
we'll
see
so
we're
gonna.
Try
to
you
know
kind
of
create,
like
a
express
framework
where
you
can
write,
will
build
on
top
of
express,
but
where
you
can
write
react
to
declare
your
framework.
So
something
like
this:
where
you'll
have
your
render,
and
then
you
define
your
components.
A
I've
got
a
little
handler
function
here,
just
a
request
handler
function
that
takes
a
request,
object
and
a
response
object.
You
know
just
like
in
express
and
what
we're
going
to
do
is
just
import
react
just
like
we
would
do
it
on
the
front
end
and
then
we're
going
to
import.
This
render
function
from
this
library
called
react,
dash
mill
and
basically
all
that
library
does
is.
It
goes
into
react
and
it
voids
or
nulls
out
all
of
the
places
where
react
returns
dom.
A
A
A
A
A
Server
app
and
express
you
see
it
represented
like
this,
you
know.
Basically,
it's
going
to
write
out
a
function
like
app,
get
slash
and
then
the
the
handler
right
hello.
So
so
the
request
is
just
gonna
kind
of
write
that
code
out
and
we'll
show
you
how
that
looks
in
a
minute
and
then
the
listen
is
just
going
to
call
like
app.listen
3000..
A
So
that's
our
first
stab
at
this
we'll
run
this.
This
is
running
in
dino,
which
is
kind
of
cool,
but
I
can
just
start
it
up
like
that
and
let's
see,
got
a
bug
on
line
10..
Let's
see,
I
forgot
to
close
my
listen
component.
Okay,
now
we'll
start
that
up
and
hopefully
we'll
be
listening
on
port
3000
in
just
one
second,
the
nice
thing
about
dino.
Is
you
give
it
a
jsx
or
tsx
file
and
it'll
automatically
kind
of
compile
everything
for
you?
You
don't
have
to
set
up
anything
there.
A
A
So
if
you
look
at
this
library
called
opine,
it's
basically
a
clone
of
express
and
dino,
so
everything
works
like
express
and
then
we
have
react
and
what
we're
doing
is
we're
building
components
and
in
their
functional
components.
So
in
the
app
component
we
take
in
props
and
we
just
iterate
through
the
children
and
we
attach
the
app
prop
or
attach
an
app
prop,
which
is
the
express
application.
So
here
would
be
like
start
express
and
we
assign
it
to
app
and
we
just
iterate
through
the
children
and
merge.
A
If
you
will
the
app
property
into
the
child
and
then
return
the
child
and
then
the
second
component
request
gets
app
as
a
property
and
then
the
method
property
is
assigned
to
git.
So
we
could
say:
let's
do
a
post,
let's
do
whatever
a
put,
but
if
we
don't
specify
it
it'll
default
to
a
get,
and
then
we
have
our
path
and
handler
these
two
properties
we
passed
into
our
component
when
we
declared
that
in
react
and
then
like
I
said,
we
just
call
app
the
method
path
and
the
handler.
Now.
A
A
So,
let's
see
if
we
can
take
this
a
little
further
and
actually
write
a
you
know,
react
is
kind
of
famous
for
its
counter
apps.
So,
let's
see
if
we
can
write
a
simple
counter
where,
if
you
do
a
get
to
the
root,
it
will
return
the
count
and
then,
if
you
post
an
ad
path,
it
will
increment
it
and
we'll
just
stick
with
that
for
right
now,
just
to
make
sure
I'm
good
on
time.
A
So
if
we
go
into
mod
jsx
and
we've
got
our
app
and
one
of
the
things
I
wanted
to
do
is
is
just
kind
of
take
this
a
little
bit
further.
We've
got
this
handler
method,
but
what
if
we
just
did
this?
What
if
we
did
request
and
in
request
and
then
inside
there
added
a
child
for
a
component
right?
So
let's
just
call
it
counter
right,
then
that
way
we
we
take.
This
request,
and
then
we
just
add
this
child
counter,
which
is
another
component,
and
then
we
could
have
another
request.
A
A
And
then
we'll
end
that
with
a
request:
okay,
okay,
so
we
might
have
to
make
some
changes
on
our
request
component
to
look
at
a
child
and
treat
it
as
a
component.
And
I
I
really
went
ahead
and
already
did
that
here
on
hyper2
and
we
can
look
at
that.
But
now
we're
defining
components,
not
just
handler
functions.
So
we
want
to
create
a
counter
component.
A
A
I
think
what
we're
going
to
do
is
in
the
props,
there's
going
to
be
a
handler
and
we're
going
to
pass
it
a
function
for
the
hammer
so
there
in
the
props.
There
will
be
a
handler
function
that
hands
this
component
and
then
that's
what
we'll
we'll
call,
but
first
we'll
set
up
use,
state
and
we'll
do
count,
set
count
and
then
that'll
be
use.
A
A
A
A
A
B
A
A
B
A
Let's
do
get
count
two
and
okay,
so
I
know
what's
going
on
the
reason
that
it's
calling,
that
is
because
if
we
look
at
our
render
the
handler,
the
component's
getting
called
twice
right,
request
and
request
is
getting
called
twice.
So
that's
why
count
is
equal
to
two.
So
we
really
need
to
kind
of
put
this
count
inside
our
handler.
C
C
A
A
Post
okay,
so
it's
not
blowing
up,
but
something's
something's,
not
working
right
with
state,
and
it's
probably
an
error
on
my
side.
But
but
anyway,
hopefully
you
can
kind
of
get
the
idea.
This
is
kind
of
an
interesting
approach
and
just
to
show
you
how
that
kind
of
works.
If
we
look
at
hyper2
js,
basically,
the
request
object
is
mapping
over
the
children,
verifying
if
it's
a
valid
element
and
then
cloning
that
and.
A
So
anyway,
that
is
my
take
at
trying
to
use
react
to
build
a
server
framework
or
something
don't
know
what
it
is,
but
I
think
there's
a
lot
of
space
to
explore
here,
especially
like
creating
declarative
business
logic
or
working
with
you
know,
kind
of
giving
your
team
a
really
nice
composable
way
to
compose
kind
of
some
business
rules.
So
I
I
think,
there's
some
really
interesting
things
to
explore
here.
So
that's
that's
what
I
wanted
to
show
today,
any
any
other
questions.
A
A
B
Yeah,
actually,
this
seems
like
the
place
to
do
it.
Hi
I'm
robert
articulate,
is
the
company
I
work
for
articulate.com
and
rise.rise.com
and
they're
trying
to
hire
like
50
devs
over
the
next
over
this
year.
Everything
from
engineering
managers
to-
I
guess
I
guess
yeah
I
wouldn't
be
qa
folks,
but
like
up
and
down
the
skill
level
stack.
So
if
you're
interested
give
me
a
shout
on
the
charleston
tech
slack
or
ask
tom,
but
yeah
I
figure.
B
B
Man,
I
was
using
react
on
the
server
in
like
2014
and
this
and
at
work.
No,
we
there's
nothing
on
the
server
now
to
be
to
be
fair,
there's
some
really
cool
stuff.
That's
not
this
that
you
can
that
you've
been
able
to
do
for
like
seven
years
with
rendering,
because
you
can
use
react
on
the
server
to
build
up
static,
html
and
send
that
down
to
the
client
the
big
cool
thing
back
in
the
day.
B
C
B
C
A
Yeah,
I
I
think
you
could
actually
you
know
kind
of
compose
some.
You
know
like
terraform
templates
and
react
or
something
I
don't
know.
I
I
ran
across
that
project
and-
and
I
always
thought
that
you
know
react's,
declarative,
syntax
really
hits
a
lot
of
people
gives
them
some
really
good
dx
and
sometimes
when
you're
writing
apis
or
writing
business
logic,
you're
trying
to
find
where
that
parentheses
is
or
where
that
curly
braces
is
right
and
and
typescript
really
helps
a
lot.
A
C
B
A
A
But
please
let
me
know
what
you
want
to
hear
and
I'll
work
on
lining
up
speakers
and
if
you
would
like
to
share
a
15-minute
presentation
on
some
stuff
that
you're
finding
cool
with
react,
please
let
me
know
really
enjoy
this
stuff
and
look
forward
to
doing
it
next
time.
I'll
stick
on
the
line
if
anyone
else
wants
to
chat
but
other
than
that,
that's
that's
our
meetup
thanks
for
joining.
A
A
B
A
A
A
C
A
Yeah
you
get
a
mix,
I
think
postgres
and
would
probably
be
the
two
most
popular
of
both
sql
and
no
sequel
would
be
my
guess.
But
but
it's
always
it's
always
good
to
see
people
working
with
data.
I
think
that's
a
good
topic
yeah.
I
was
just
gonna.
I've
just
been
so
blown
away
by
the
studio,
3p
product,
I've.
A
B
A
B
A
But
other
versions
of
sql
server,
but
our
other
versions
of
sql
products,
but
yeah,
it's
it's.
You
know
out
of
the
box
out
of
the
cloud.
I
guess
you
see
now
but
doesn't
have
I
don't.
I
don't
think
it
has
it.
It
doesn't
didn't,
provide
you
with
a
very
good
user
interface,
but
studio
3t
is
just
I
mean
it's,
it's
even
better.
I
I
I
find
it
even
more
helpful
than
like
query.
I
mean
the
microsoft
sql
console,
I
guess
postgres
and
all
these
a
lot
of
them
have
these
products.
These
third-party
products.
A
Where
you
can
you
can
build
these,
build
your
queries
and
work
with
your
data.
You
know
right
in
the
you
know,
right
in
the
plot
right
in
the
tool
rather
and
doesn't
provide
you
anything
anywhere
near
the
studio,
3t
level
but
yeah.
I
was
just
curious
if,
if
there
were
several
of
you
that
were
interested
in
I
or
that
used,
I
was
going
to
say,
I'd
be
happy
to
do
a
lightning
or
something
on
studio
3t.
But
again
from
a
from
a
newbies
point
of
view,
I
mean
all
you
guys.
A
Are
you
know
way
over?
I'm
a
hobbyist
programmer
in
my
retirement,
as
you
guys
tom
knows,
but
I've
just
been
so
blown
away
by
by
what's
in
studio,
3t
that
I,
if
there
was
by
chance
anybody
that
was
using
without
it
unless
they're
using
another
tool
that
takes
that
takes
the
place
of
studio.
3-2
really
has,
as
the
saying
goes,
it's
changed
my
life
as
far
as
writing.
A
Tell
you
what
yeah,
if
you
can
put
together
a
three
to
five
minute,
talk
on
it.
I
think
it
would
be
worth
sharing
so
yeah.
Just
do
that
and
I'll
I'll
make
a
note
and
pencil
again
for
next
month
and
yeah.
I
I
again,
I
think
everyone
you
know
comes
to
these
to
learn
something
new.
So
just
because
people
are
not
using
something
doesn't
mean
it's
worth
not
worth
sharing,
so
I
mean.
C
B
A
In
these
inquiries,
in
in
these
advanced
queries
that
we
used
to
do
in
stored
procedures
at
mungo,
really
I
mean
manga
didn't
have
store
procedures.
My
knowledge
and
I've
been
looking
for
something
that
allows
me
to
write
these
really
serious
queries
to
get
to
get
my
workload
done
on
the
server
rather
than
how
I
had
been
doing
it
prior
to
three
months
ago,
I'll
bring
this
giant
file
down
and
do
it
all
in.