RedwoodJS

中国镜像

by Tom Preston-Werner, Peter Pistorius, Rob Cameron, David Price, and more than 250 amazing contributors (see end of file for a full list).

Redwood is an opinionated, full-stack, JavaScript/TypeScript web application framework designed to keep you moving fast as your app grows from side project to startup.

At the highest level, a Redwood app is a React frontend that talks to a custom GraphQL API. The API uses Prisma to operate on a database. Out of the box you get tightly integrated testing with Jest, logging with Pino, and a UI component catalog with Storybook. Setting up authentication (like Auth0) or CSS frameworks (like Tailwind CSS) are a single command line invocation away. And to top it off, Redwood's architecture allows you to deploy to either serverless providers (e.g. Netlify, Vercel) or traditional server and container providers (e.g. AWS, Render) with nearly no code changes between the two!

By making a lot of decisions for you, Redwood lets you get to work on what makes your application special, instead of wasting cycles choosing and re-choosing various technologies and configurations. Plus, because Redwood is a proper framework, you benefit from continued performance and feature upgrades over time and with minimum effort.

Redwood is the latest open source project initiated by Tom Preston-Werner, cofounder of GitHub (most popular code host on the planet), creator of Jekyll (one of the first and most popular static site generators), creator of Gravatar (the most popular avatar service on the planet), author of the Semantic Versioning specification (powers the Node packaging ecosystem), and inventor of TOML (an obvious, minimal configuration language used by many projects).

TUTORIAL: The best way to get to know Redwood is by going through the extensive Redwood Tutorial. Have fun!

QUICK START: You can install and run a full-stack Redwood application on your machine with only a couple commands. Check out the Quick Start guide to get started.

EXAMPLES: If you'd like to see some simple examples of what a Redwood application looks like, take a look at the following projects:

# Technologies

We are obsessed with developer experience and eliminating as much boilerplate as possible. Where existing libraries elegantly solve our problems, we use them; where they don't, we write our own solutions. The end result is a JavaScript development experience you can fall in love with!

Here's a quick taste of the technologies a standard Redwood application will use:

# Features

  • Opinionated defaults for formatting, file organization, Webpack, Babel, and more
  • Simple but powerful routing (all routes defined in one file) with dynamic (typed) parameters, custom types, and named route functions (to generate correct URLs)
  • Automatic page-based code-splitting
  • Boilerplate-less GraphQL API construction
  • Cells: a declarative way to fetch data from the backend API
  • Generators for pages, layouts, cells, SDL, services, etc.
  • Scaffold generator for CRUD operations specific to a DB table
  • Forms with easy client- and/or server-side validation and error handling
  • Fast Refresh (hot reloading) for faster development
  • Database and Data migrations
  • Envelop Plugins that enhance the GraphQL lifecycle from context to execution
  • Simple but powerful GraphQL Directives to validate access or transform resolved data
  • Logging using Pino including transports
  • Webhooks: signature verification and payload signing for handling both incoming and outgoing
  • Jest testing utilities integrated across your codebase: mocks, test DB, generated boilerplate tests, scenarios, Web (components), and API (services, serverless functions, and webhooks)
  • Page prerendering at build time
  • Built-in Storybook integration: generated boilerplate component stories, tests, graphql/api mocks (Cells), and scenarios
  • API Server using Fastify for Serverful deploys
  • First-class Jamstack-style deployment to both serverless and traditional infrastructure: Netlify, Vercel, Serverless, Render, Docker container (for AWS, Google Cloud, Azure, etc.), and many more on the way!

# How it works

A Redwood application is split into two parts: a frontend and a backend. This is represented as two JS/TS projects within a single monorepo. We use Yarn to make it easy to operate across both projects while keeping them in a single Git repository.

The frontend project is called web and the backend project is called api. For clarity, we will refer to these in prose as "sides", i.e. the "web side" and the "api side". They are separate projects because code on the web side will end up running in the user's browser while code on the api side will run on a server somewhere. It is important that you keep this distinction clear in your mind as you develop your application. The two separate projects are intended to make this obvious. In addition, separate projects allow for different dependencies and build processes for each project.

The api side is an implementation of a GraphQL API. Your business logic is organized into "services" that represent their own internal API and can be called both from external GraphQL requests and other internal services. Redwood can automatically connect your internal services with Apollo, reducing the amount of boilerplate you have to write. Your services can interact with a database via Prisma's ORM, and Prisma's migration tooling provides first-class migrations that take the pain out of evolving your database schema.

The web side is built with React. Redwood's router makes it simple to map URL paths to React "Page" components (and automatically code-split your app on each route). Pages may contain a "Layout" component to wrap content. They also contain "Cells" and regular React components. Cells allow you to declaratively manage the lifecycle of a component that fetches and displays data. Other Redwood utility components make it trivial to implement smart forms and various common needs. An ideal development flow starts with Storybook entries and Jest tests, so Redwood closely integrates both, making it easy to do the right thing.

You'll notice that the web side is called "web" and not "frontend". This is because Redwood conceives of a world where you may have other sides like "mobile", "desktop", "cli", etc., all consuming the same GraphQL API and living in the same monorepo.

# Roadmap

A framework like Redwood has a lot of moving parts; the Roadmap is a great way to get a high-level overview of where the framework is relative to where we want it to be. And since we link to all of our GitHub project boards, it's also a great way to get involved! Roadmap

# Why is it called Redwood?

(A history, by Tom Preston-Werner)

Where I live in Northern California there is a type of tree called a redwood. Redwoods are HUGE, the tallest in the world, some topping out at 115 meters (380 feet) in height. The eldest of the still-living redwoods sprouted from the ground an astonishing 3,200 years ago. To stand among them is transcendent. Sometimes, when I need to think or be creative, I will journey to my favorite grove of redwoods and walk among these giants, soaking myself in their silent grandeur.

In addition, Redwoods have a few properties that I thought would be aspirational for my nascent web app framework. Namely:

  • Redwoods are beautiful as saplings, and grow to be majestic. What if you could feel that way about your web app?

  • Redwood pinecones are dense and surprisingly small. Can we allow you to get more done with less code?

  • Redwood trees are resistant to fire. Surprisingly robust to disaster scenarios, just like a great web framework should be!

  • Redwoods appear complex from afar, but simple up close. Their branching structure provides order and allows for emergent complexity within a simple framework. Can a web framework do the same?

And there you have it.

# Contributors

A gigantic "Thank YOU!" to everyone below who has contributed to one or more Redwood projects: Framework, Website, Docs, and Create-Redwood Template. 🚀

# Core Team


Tom Preston-Werner

founder, leadership

Peter Pistorius

founder, leadership

Rob Cameron

founder, leadership

David Price

founder, leadership

Dominic Saadi

maintainer, advocate

Robert

maintainer

David Thyresson

maintainer, community

Daniel Choudhury

maintainer, community

Tobbe Lundberg

maintainer

Aldo Bucchi

maintainer

Anthony Campolo

advocate

Claire Froelich

maintainer

Kim-Adeline Miguel

community

Forrest Hayes

community

Simon Gagnon

maintainer

Kris Coulson

community

Aditya Pandey

maintainer

Keith T Elliot

community

Amanda Giannelli

community

Alice Zhao

advocate

Chris van der Merwe

maintainer

Ryan Lockard

maintainer

Peter Colapietro
maintainer

noire.munich

# All Contributors


Anton Moiseev

Mohsen Azimi

Christopher Burns

Terris Kremer

James George

Brett Jackson

Guilherme Pacheco

Kasper Mikiewicz

chris-hailstorm

Jai

Lachlan Campbell

Satya Rohith

Steven Normore

Mads Rosenberg

Ted Stoychev

eurobob

Vikash

Adrian Mato

Anirudh Nimmagadda

Ben McCann

Chris Ball

Suvash Thapaliya

Thieffen Delabaere

swyx

Max Leon

Maxim Geerinck

Niket Patel

0xflotus

Anthony Powell

Aryan J

Brian Ketelsen

Dominic Chapman

Evan Moncuso

Georgy Petukhov

Gianni Moschini

Giel

Jani Monoses

Johan Eliasson

Leonardo Elias

Logan Houp

Loren ☺️

Mark Pollmann

Matthew Leffler

Michele Gerarduzzi

Nick Gill

Nicholas Joy Christ

Olivier Lance

Phuoc Do

Rocky Meza

Sharan Kumar S

Simeon Griggs

Taylor Milliman

Zach Hammer

Przemyslaw T

Hemil Desai

Alessio Montel

Anthony Morris

Beto

Turadg Aleahmad

Paul Karayan

Nikolas

guledali

Yong Joseph Bakos

Gerd Jungbluth

James Highsmith

Troy Rosenberg

Amr Fahim

dfundingsland

Eduardo Reveles

Jeffrey Horn

matthewhembree

Robert Bolender

Shivam Chahar

Aaron Sumner

Alvin Crespo

Chris Ellis

Colin Ross

Dennis Dang

Derrick Pelletier

Jeroen van Baarsen

Matan Kushner

Matthew Rathbone

Michal Weisman

Miguel Oller

Mudassar Ali

Nate Finch

Paweł Kowalski

Punit Makwana

Scott Chacon

scott

Scott Walkinshaw

Stephan van Diepen

bpenno

Tim Trautman

Zachary McKenna

Ryan Hayes

Evan Weaver

cr1at0rs

qooqu

Android Dev Notes

Jeremy Kratz

Monica Powell

Ganesh Rane

Ryan Doyle

Matt Reetz

Punit Makwana

shzmr

esteban-url

Kurt Hutten

António Meireles

Brent Guffens

Santhosh Laguduwa

Marco Bucchi

Johnny Choudhury-Lucas

Steven Almeroth

lumenCodes

_robobunny

Kevin Poston

Davy Hausser

Mohinder Saluja

Lamanda

ryancwalsh

Nick Geerts

miku86

Krisztiaan

Jonathan Derrough

Asdethprime

Brian Solon

Chris Chapman

Joël Galeran

Mariah

Tyler Scott Williams

Vania Kucher

Viren Bhagat

William

dcgoodwin2112

Bennett Rogers

Daniel O'Neill

David Yu

Adithya Sunil

Edward Jiang

Manuel Kallenbach

Nick Schmitt

Jon Meyers

Matthew Bush

Patrick Gallagher

Himank Pathak

Morgan Spencer

Pedro Piñera Buendía

Matt Sutkowski

Justin Etheredge

Zain Fathoni

Shrill Shrestha

Brent Anderson

Vinaya Sathyanarayana

Will Minshew

Tawfik Yasser

Sébastien Lorber

Charlie Ray

Kim, Jang-hwan

TagawaHirotaka

Andrew Lam

Brandon DuRette

Curtis Reimer

Kevin Brown

Nikolaj Ivancic

Nuno Pato

Renan Andrade

Sai Deepesh

bl-ue

Sven Hanssen

Mudassar Ali

SangHee Kim

Subhash Chandra

KimSeonghyeon

Zhihao Cui

Kyle Corbitt

Sean Doughty

Zak Mandhro

bozdoz

Isaac Tait

Jace

Noah Bernsohn

rene-demonsters

Sergey Sharov

Tim Pap

in-in

mlabate

Pablo Dejuan

bugsfunny

Luís Pinto

Leigh Halliday

BlackHawkSigma

Devin MacGillivray

Francisco Jaramillo

Orta Therox

Tharshan Muthulingam

Brian Liu

allen joslin

Ryan Wang

Vashiru

Ron Dyar

Todd Pressley

Zack Sheppard

AlbertGao

vchoy

Daniel Macovei

Peter Perlepes

Benedict Adams

Hampus Kraft

Harun Kilic

Mike Nikles

Mohammad Shahbaz Alam

Moulik Aggarwal

Omar El-Domeiri

Paul McKellar

Sarthak Mohanty

Justin Jurenka

Jens Lindström

Hampus Kraft

Ryan Chenkie

George Cameron

John

Shannon Smith

Bob

facinick

Teodoro Villaneuva

Sarvesh Limaye

Shantanu Zadbuke

Duke Manh

Michael Marino

Igor Savin

Jacob Arriola

Jingying Gu

Tim Kolberger

nzdjb

Hannah Vivian Shaw

usman kareemee

watway

Edward Mason

Mateo Carriquí

kataqatsi

Jeff Schroeder

mnm

BBurnworth

Jonathan

Rishabh Poddar

Vitalii Melnychuk

Buck DeFore

Kamarel Malanda

Manuel Vila

Arda TANRIKULU

Tristan Lee

Agustina Chaer

Charles Tison

Josema Sar

Ken Greeff

Wiktor Sienkiewicz

Alejandro Frias

Aleksandra

Ian McPhail

Kyle Stewart

Laurin Quast

Martin Juhasz

Odee

Stephen Handley

Syeda Zainab

joriswill

szainab

twodotsmax

Michael Shilman

nickpdemarco

davidlcorbitt

ROZBEH

Anh Le (Andy)

IsaacHook

Matt Sears

MthBarber

Safi Nettah

dietler

Guedis

rkmitra1

m3t

Brandon Bayer

Matt Murphy

jessicard

Pete McCarthy

Philzen

Vik

Carl Hallén Jansson

Chen Liu

Manish

Zach Peters

Benas Mandravickas

COCL2022

Ella

Eric Kitaif

Giuseppe Caruso

Ian Walter

Jedde Bowman

Johan Eliasson

Lee Staples

Leo Thorp

Matthieu Napoli

Nik F P

Olyno

Robert Tirta

The Ape Collector

ccnklc

cremno

dkmooers

hbellahc

hello there

llmaboi

Changsoon Bok

Kristoffer K.

Justin Kuntz

Paine Leffler

Paul Venable

Peter Chen

Yann

Andre Wruszczak

Anton Mihaylov

Miguel Parramón

Fabio Lazzaroni

Rushabh Javeri

Anders Søgaard

kunalarya

Aleph Retamal

Alon

Bouzid Badreddine

Charly POLY

Guillaume Mantopoulos

Jan Henning

Jonas Oberschweiber

Jordan Rolph

Jorge Venegas

Kolja Lampe

Leon

Masvoras

Min ho Kim

Pin Sern

RUI OKAZAKI

Syahrizal Ardana

craineum

hello there

Matt Driscoll

paikwiki

Mark Wiemer

Alex Hughes

Erica Pisani

Fatih Altinok

Kris

Krupali Makadiya

Malted

Michelle Greer

Nikola Hristov

Swarit Choudhari

Lina

pwellner

Jay O'Conor

Stan Duprey

Victor Savkin

Łukasz Sowa

Andrew Lam

Daniel Jalkut

Eli

NoahC5

Tommy Marshall

Zachary Vander Velden

pantheredeye

Kirby Douglas Ellingson

Sergio Guzman

Eric Howey

Erik Guzman

IRSHAD WANI

Niall

Nikola Hristov

Rui Okazaki

Sunjay Armstead

Justin

kam c.

makdeb

payapula

willks

Josh GM Walker

Ari Mendelow

Jake Zhao

psirus0588

Eric Rabinowitz

Maximilian Raschle

nikolaxhristov

Alon Bukai

Han Ke

Matt Chapman

Rowin Mol

Christopher Burns

Alex Lilly

dphuang2

Daniel Escoto

James Hester

Guillaume Mantopoulos

Redwood projects (mostly) follow the all-contributions specification. Contributions of any kind are welcome.