RedwoodJS is a fullstack JavaScript framework that combines the power of React, GraphQL, and Prisma into a single package. It is used to build serverless web applications with a relational SQL database for the storage layer. 

#programming #js #100SecondsOfCode 

🔗 Resources

Redwood Docs https://redwoodjs.com/
Redwood Github https://github.com/redwoodjs/redwood
Prisma in 100 Seconds https://youtu.be/rLRIB6AF2Dg
GraphQL in 100 Seconds https://youtu.be/eIQh02xuVw4


🔥 Get More Content - Upgrade to PRO

Upgrade to Fireship PRO at https://fireship.io/pro
Use code lORhwXd2 for 25% off your first payment. 

🎨 My Editor Settings

- Atom One Dark 
- vscode-icons
- Fira Code Font

🔖 Topics Covered

- What is RedwoodJS? 
- RedwoodJS quickstart tutorial
- Redwood vs Next.js
- JS framework like Ruby on Rails
- Full Stack JavaScript Framwork Comparisons
- Using GraphQL on Web
2024-02-04T05:25:54.442Z
nova-2
2-general-nova
2024-01-09.29447
30089e05-99d1-4376-b32e-c263170674af
2ca65823-a3c8-4515-81f0-e6c36cd1a041
1555f700b545083f40e9ea7e6912c3eef5ad86eb805ad2eebcca67d011902539
67875a7f-c9c4-48a0-aa55-5bdb8a91c34a
deprecated
Redwood JS, an opinionated full stack JavaScript framework for building big ambitious startups.
As we all know, the JavaScript ecosystem is incredibly complex with millions of different tools to choose from when architecting an app.
Redwood takes a collection of the most battle tested technologies like Gact, Prisma, GraphQL, Storybook, and Jest, then weaves them together so developers can get things done quickly and reliably.
It was developed by a team of software engineers theirs that includes the cofounder of GitHub and hit version 1.0 in 2022.
It has its own custom router for server side rendering, but unlike many in other frameworks.
It doesn't use the file system and instead puts all routes in a single file with automatic code splitting for each page.
Most importantly, though, it provides is actions to connect your front end UI to a back end relational database via a GraphQL API.
Its Rails inspired CLI can quickly gonna rate the code required to build complex features and not just build them, but also test them with Jest and Storybook.
It ships with Apollo Client by involved, making it easy for the front end to consume data from the GraphQL API.
And when it comes time for deployment, the code can easily run on a stand alone server or your favorite serverless infrastructure.
To get started, generate a new Redwood project with yarn.
The front end code is managed in the web directory.
It's a React app that's wrapped with the Redwood provider with routes as the main entry point for the UI.
The routes component is a collection of URL patterns that point to a specific component, which is defined in the pages directory.
Free.
All pages are automatically imported here, keeping your code nice and concise.
In addition, all pages are automatically lazy loaded with code splitting, making your load times as fast as possible.
It also contains a layout system to share UI across different routes.
Now the back end is organized in the API directory, which uses is Prisma to manage the database schema, but also provides the tools required to build a full fledged GraphQL API to access your data.
The back end can also define its own custom serverless functions or directives, which operate like middleware to handle concerns like user authentication.
What's really cool though is Redwood provides an abstraction actually called a cell to simplify complex data fetching.
A cell is just a component that manages a GraphQL query, allowing you to clearly define different states like loading, error and success.
Like Angular or Rails, Redwood provides strong conventions and a CLI to generate the boilerplate code for you.
Use it to quickly create a component page or cell along with the code for Jest and Storybook for testing.
And finally, use the CLI to deploy the app to your favorite serverless cloud platform.
This has been Redwood JS in 100 seconds.
Hit the like button and subscribe if you wanna see more short videos like this.
Thanks for watching, and I will see you in the next one.

Speaker 0: Redwood JS, an opinionated full stack JavaScript framework for building big ambitious startups. As we all know, the JavaScript ecosystem is incredibly complex with millions of different tools to choose from when architecting an app. Redwood takes a collection of the most battle tested technologies like Gact, Prisma, GraphQL, Storybook, and Jest, then weaves them together so developers can get things done quickly and reliably. It was developed by a team of software engineers theirs that includes the cofounder of GitHub and hit version 1.0 in 2022. It has its own custom router for server side rendering, but unlike many in other frameworks.

It doesn't use the file system and instead puts all routes in a single file with automatic code splitting for each page. Most importantly, though, it provides is actions to connect your front end UI to a back end relational database via a GraphQL API. Its Rails inspired CLI can quickly gonna rate the code required to build complex features and not just build them, but also test them with Jest and Storybook. It ships with Apollo Client by involved, making it easy for the front end to consume data from the GraphQL API. And when it comes time for deployment, the code can easily run on a stand alone server or your favorite serverless infrastructure.

To get started, generate a new Redwood project with yarn. The front end code is managed in the web directory. It's a React app that's wrapped with the Redwood provider with routes as the main entry point for the UI. The routes component is a collection of URL patterns that point to a specific component, which is defined in the pages directory. Free.

All pages are automatically imported here, keeping your code nice and concise. In addition, all pages are automatically lazy loaded with code splitting, making your load times as fast as possible. It also contains a layout system to share UI across different routes. Now the back end is organized in the API directory, which uses is Prisma to manage the database schema, but also provides the tools required to build a full fledged GraphQL API to access your data. The back end can also define its own custom serverless functions or directives, which operate like middleware to handle concerns like user authentication.

What's really cool though is Redwood provides an abstraction actually called a cell to simplify complex data fetching. A cell is just a component that manages a GraphQL query, allowing you to clearly define different states like loading, error and success. Like Angular or Rails, Redwood provides strong conventions and a CLI to generate the boilerplate code for you. Use it to quickly create a component page or cell along with the code for Jest and Storybook for testing. And finally, use the CLI to deploy the app to your favorite serverless cloud platform.

This has been Redwood JS in 100 seconds. Hit the like button and subscribe if you wanna see more short videos like this. Thanks for watching, and I will see you in the next one.
Redwood JS, an opinionated full stack JavaScript framework for building big ambitious startups. As we all know, the JavaScript ecosystem is incredibly complex with millions of different tools to choose from when architecting an app. Redwood takes a collection of the most battle tested technologies like Gact, Prisma, GraphQL, Storybook, and Jest, then weaves them together so developers can get things done quickly and reliably. It was developed by a team of software engineers theirs that includes the cofounder of GitHub and hit version 1.0 in 2022. It has its own custom router for server side rendering, but unlike many in other frameworks. It doesn't use the file system and instead puts all routes in a single file with automatic code splitting for each page. Most importantly, though, it provides is actions to connect your front end UI to a back end relational database via a GraphQL API. Its Rails inspired CLI can quickly gonna rate the code required to build complex features and not just build them, but also test them with Jest and Storybook. It ships with Apollo Client by involved, making it easy for the front end to consume data from the GraphQL API. And when it comes time for deployment, the code can easily run on a stand alone server or your favorite serverless infrastructure. To get started, generate a new Redwood project with yarn.
programming
forests
computer science
software development
software
The front end code is managed in the web directory. It's a React app that's wrapped with the Redwood provider with routes as the main entry point for the UI. The routes component is a collection of URL patterns that point to a specific component, which is defined in the pages directory. Free. All pages are automatically imported here, keeping your code nice and concise.
In addition, all pages are automatically lazy loaded with code splitting, making your load times as fast as possible. It also contains a layout system to share UI across different routes. Now the back end is organized in the API directory, which uses is Prisma to manage the database schema, but also provides the tools required to build a full fledged GraphQL API to access your data. The back end can also define its own custom serverless functions or directives, which operate like middleware to handle concerns like user authentication.
databases
data management
What's really cool though is Redwood provides an abstraction actually called a cell to simplify complex data fetching.
A cell is just a component that manages a GraphQL query, allowing you to clearly define different states like loading, error and success. Like Angular or Rails, Redwood provides strong conventions and a CLI to generate the boilerplate code for you. Use it to quickly create a component page or cell along with the code for Jest and Storybook for testing. And finally, use the CLI to deploy the app to your favorite serverless cloud platform. This has been Redwood JS in 100 seconds. Hit the like button and subscribe if you wanna see more short videos like this.
programming
software
software development
video gaming
Thanks for watching, and I will see you in the next one.
Redwood JS, an opinionated full stack JavaScript framework for building big ambitious startups. As we all know, the JavaScript ecosystem is incredibly complex with millions of different tools to choose from when architecting an app. Redwood takes a collection of the most battle tested technologies like Gact, Prisma, GraphQL, Storybook, and Jest, then weaves them together so developers can get things done quickly and reliably. It was developed by a team of software engineers theirs that includes the cofounder of GitHub and hit version 1.0 in 2022. It has its own custom router for server side rendering, but unlike many in other frameworks. It doesn't use the file system and instead puts all routes in a single file with automatic code splitting for each page. Most importantly, though, it provides is actions to connect your front end UI to a back end relational database via a GraphQL API. Its Rails inspired CLI can quickly gonna rate the code required to build complex features and not just build them, but also test them with Jest and Storybook. It ships with Apollo Client by involved, making it easy for the front end to consume data from the GraphQL API. And when it comes time for deployment, the code can easily run on a stand alone server or your favorite serverless infrastructure. To get started, generate a new Redwood project with yarn. The front end code is managed in the web directory. It's a React app that's wrapped with the Redwood provider with routes as the main entry point for the UI. The routes component is a collection of URL patterns that point to a specific component, which is defined in the pages directory. Free. All pages are automatically imported here, keeping your code nice and concise. In addition, all pages are automatically lazy loaded with code splitting, making your load times as fast as possible. It also contains a layout system to share UI across different routes. Now the back end is organized in the API directory, which uses is Prisma to manage the database schema, but also provides the tools required to build a full fledged GraphQL API to access your data. The back end can also define its own custom serverless functions or directives, which operate like middleware to handle concerns like user authentication. What's really cool though is Redwood provides an abstraction actually called a cell to simplify complex data fetching. A cell is just a component that manages a GraphQL query, allowing you to clearly define different states like loading, error and success. Like Angular or Rails, Redwood provides strong conventions and a CLI to generate the boilerplate code for you. Use it to quickly create a component page or cell along with the code for Jest and Storybook for testing. And finally, use the CLI to deploy the app to your favorite serverless cloud platform. This has been Redwood JS in 100 seconds. Hit the like button and subscribe if you wanna see more short videos like this. Thanks for watching, and I will see you in the next one.
Redwood
redwood
JS,
js
an
an
opinionated
opinionated
full
full
stack
stack
JavaScript
javascript
framework
framework
for
for
building
building
big
big
ambitious
ambitious
startups.
startups
As
as
we
we
all
all
know,
know
the
the
JavaScript
javascript
ecosystem
ecosystem
is
is
incredibly
incredibly
complex
complex
with
with
millions
millions
of
of
different
different
tools
tools
to
to
choose
choose
from
from
when
when
architecting
architecting
an
an
app.
app
Redwood
redwood
takes
takes
a
a
collection
collection
of
of
the
the
most
most
battle
battle
tested
tested
technologies
technologies
like
like
Gact,
gact
Prisma,
prisma
GraphQL,
graphql
Storybook,
storybook
and
and
Jest,
jest
then
then
weaves
weaves
them
them
together
together
so
so
developers
developers
can
can
get
get
things
things
done
done
quickly
quickly
and
and
reliably.
reliably
It
it
was
was
developed
developed
by
by
a
a
team
team
of
of
software
software
engineers
engineers
theirs
theirs
that
that
includes
includes
the
the
cofounder
cofounder
of
of
GitHub
github
and
and
hit
hit
version
version
1.0
1.0
in
in
2022.
2022
It
it
has
has
its
its
own
own
custom
custom
router
router
for
for
server
server
side
side
rendering,
rendering
but
but
unlike
unlike
many
many
in
in
other
other
frameworks.
frameworks
It
it
doesn't
doesn't
use
use
the
the
file
file
system
system
and
and
instead
instead
puts
puts
all
all
routes
routes
in
in
a
a
single
single
file
file
with
with
automatic
automatic
code
code
splitting
splitting
for
for
each
each
page.
page
Most
most
importantly,
importantly
though,
though
it
it
provides
provides
is
is
actions
actions
to
to
connect
connect
your
your
front
front
end
end
UI
ui
to
to
a
a
back
back
end
end
relational
relational
database
database
via
via
a
a
GraphQL
graphql
API.
api
Its
its
Rails
rails
inspired
inspired
CLI
cli
can
can
quickly
quickly
gonna
gonna
rate
rate
the
the
code
code
required
required
to
to
build
build
complex
complex
features
features
and
and
not
not
just
just
build
build
them,
them
but
but
also
also
test
test
them
them
with
with
Jest
jest
and
and
Storybook.
storybook
It
it
ships
ships
with
with
Apollo
apollo
Client
client
by
by
involved,
involved
making
making
it
it
easy
easy
for
for
the
the
front
front
end
end
to
to
consume
consume
data
data
from
from
the
the
GraphQL
graphql
API.
api
And
and
when
when
it
it
comes
comes
time
time
for
for
deployment,
deployment
the
the
code
code
can
can
easily
easily
run
run
on
on
a
a
stand
stand
alone
alone
server
server
or
or
your
your
favorite
favorite
serverless
serverless
infrastructure.
infrastructure
To
to
get
get
started,
started
generate
generate
a
a
new
new
Redwood
redwood
project
project
with
with
yarn.
yarn
The
the
front
front
end
end
code
code
is
is
managed
managed
in
in
the
the
web
web
directory.
directory
It's
it's
a
a
React
react
app
app
that's
that's
wrapped
wrapped
with
with
the
the
Redwood
redwood
provider
provider
with
with
routes
routes
as
as
the
the
main
main
entry
entry
point
point
for
for
the
the
UI.
ui
The
the
routes
routes
component
component
is
is
a
a
collection
collection
of
of
URL
url
patterns
patterns
that
that
point
point
to
to
a
a
specific
specific
component,
component
which
which
is
is
defined
defined
in
in
the
the
pages
pages
directory.
directory
Free.
free
All
all
pages
pages
are
are
automatically
automatically
imported
imported
here,
here
keeping
keeping
your
your
code
code
nice
nice
and
and
concise.
concise
In
in
addition,
addition
all
all
pages
pages
are
are
automatically
automatically
lazy
lazy
loaded
loaded
with
with
code
code
splitting,
splitting
making
making
your
your
load
load
times
times
as
as
fast
fast
as
as
possible.
possible
It
it
also
also
contains
contains
a
a
layout
layout
system
system
to
to
share
share
UI
ui
across
across
different
different
routes.
routes
Now
now
the
the
back
back
end
end
is
is
organized
organized
in
in
the
the
API
api
directory,
directory
which
which
uses
uses
is
is
Prisma
prisma
to
to
manage
manage
the
the
database
database
schema,
schema
but
but
also
also
provides
provides
the
the
tools
tools
required
required
to
to
build
build
a
a
full
full
fledged
fledged
GraphQL
graphql
API
api
to
to
access
access
your
your
data.
data
The
the
back
back
end
end
can
can
also
also
define
define
its
its
own
own
custom
custom
serverless
serverless
functions
functions
or
or
directives,
directives
which
which
operate
operate
like
like
middleware
middleware
to
to
handle
handle
concerns
concerns
like
like
user
user
authentication.
authentication
What's
what's
really
really
cool
cool
though
though
is
is
Redwood
redwood
provides
provides
an
an
abstraction
abstraction
actually
actually
called
called
a
a
cell
cell
to
to
simplify
simplify
complex
complex
data
data
fetching.
fetching
A
a
cell
cell
is
is
just
just
a
a
component
component
that
that
manages
manages
a
a
GraphQL
graphql
query,
query
allowing
allowing
you
you
to
to
clearly
clearly
define
define
different
different
states
states
like
like
loading,
loading
error
error
and
and
success.
success
Like
like
Angular
angular
or
or
Rails,
rails
Redwood
redwood
provides
provides
strong
strong
conventions
conventions
and
and
a
a
CLI
cli
to
to
generate
generate
the
the
boilerplate
boilerplate
code
code
for
for
you.
you
Use
use
it
it
to
to
quickly
quickly
create
create
a
a
component
component
page
page
or
or
cell
cell
along
along
with
with
the
the
code
code
for
for
Jest
jest
and
and
Storybook
storybook
for
for
testing.
testing
And
and
finally,
finally
use
use
the
the
CLI
cli
to
to
deploy
deploy
the
the
app
app
to
to
your
your
favorite
favorite
serverless
serverless
cloud
cloud
platform.
platform
This
this
has
has
been
been
Redwood
redwood
JS
js
in
in
100
100
seconds.
seconds
Hit
hit
the
the
like
like
button
button
and
and
subscribe
subscribe
if
if
you
you
wanna
wanna
see
see
more
more
short
short
videos
videos
like
like
this.
this
Thanks
thanks
for
for
watching,
watching
and
and
I
i
will
will
see
see
you
you
in
in
the
the
next
next
one.
one
success
In this video, Speaker 0 explains the complexity of the JavaScript ecosystem and the use of Redwood JS, an opinionated full stack JavaScript framework for building big ambitious startups. He describes how Redwood JS works, including its use of a collection of technologies and its ability to easily create a front-end component page and run it on a stand-alone server or a serverless infrastructure. He also explains how Redwood JS works, including its use to simplify complex data fetching and provide a CLI for Jest and Storybook, and how it can be deployed to favorite cloud platforms.
Redwood in 100 Seconds
Redwood JS, an opinionated full stack JavaScript framework for building big ambitious startups. As we all know, the JavaScript ecosystem is incredibly complex with millions of different tools to choose from when architecting an app. Redwood takes a collection of the most battle tested technologies like Gact, Prisma, GraphQL, Storybook, and Jest, then weaves them together so developers can get things done quickly and reliably. It was developed by a team of software engineers theirs that includes the cofounder of GitHub and hit version 1.0 in 2022. It has its own custom router for server side rendering, but unlike many in other frameworks. It doesn't use the file system and instead puts all routes in a single file with automatic code splitting for each page. Most importantly, though, it provides is actions to connect your front end UI to a back end relational database via a GraphQL API. Its Rails inspired CLI can quickly gonna rate the code required to build complex features and not just build them, but also test them with Jest and Storybook. It ships with Apollo Client by involved, making it easy for the front end to consume data from the GraphQL API. And when it comes time for deployment, the code can easily run on a stand alone server or your favorite serverless infrastructure. To get started, generate a new Redwood project with yarn. The front end code is managed in the web directory. It's a React app that's wrapped with the Redwood provider with routes as the main entry point for the UI. The routes component is a collection of URL patterns that point to a specific component, which is defined in the pages directory. Free. All pages are automatically imported here, keeping your code nice and concise. In addition, all pages are automatically lazy loaded with code splitting, making your load times as fast as possible. It also contains a layout system to share UI across different routes. Now the back end is organized in the API directory, which uses is Prisma to manage the database schema, but also provides the tools required to build a full fledged GraphQL API to access your data. The back end can also define its own custom serverless functions or directives, which operate like middleware to handle concerns like user authentication. What's really cool though is Redwood provides an abstraction actually called a cell to simplify complex data fetching. A cell is just a component that manages a GraphQL query, allowing you to clearly define different states like loading, error and success. Like Angular or Rails, Redwood provides strong conventions and a CLI to generate the boilerplate code for you. Use it to quickly create a component page or cell along with the code for Jest and Storybook for testing. And finally, use the CLI to deploy the app to your favorite serverless cloud platform. This has been Redwood JS in 100 seconds. Hit the like button and subscribe if you wanna see more short videos like this. Thanks for watching, and I will see you in the next one.
In this video, Speaker 0 explains the complexity of the JavaScript ecosystem and the use of Redwood JS, an opinionated full stack JavaScript framework for building big ambitious startups. He describes how Redwood JS works, including its use of a collection of technologies and its ability to easily create a front-end component page and run it on a stand-alone server or a serverless infrastructure. He also explains how Redwood JS works, including its use to simplify complex data fetching and provide a CLI for Jest and Storybook, and how it can be deployed to favorite cloud platforms.