{"id":13837152,"url":"https://github.com/ReactTraining/react-stdio","last_synced_at":"2025-07-10T16:32:19.492Z","repository":{"id":57345352,"uuid":"48835132","full_name":"ReactTraining/react-stdio","owner":"ReactTraining","description":"Render React.js components on any backend","archived":false,"fork":false,"pushed_at":"2018-12-12T19:27:20.000Z","size":280,"stargazers_count":620,"open_issues_count":1,"forks_count":36,"subscribers_count":15,"default_branch":"master","last_synced_at":"2024-08-11T00:46:37.108Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ReactTraining.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-12-31T05:30:51.000Z","updated_at":"2024-03-07T21:41:44.000Z","dependencies_parsed_at":"2022-09-13T11:41:22.012Z","dependency_job_id":null,"html_url":"https://github.com/ReactTraining/react-stdio","commit_stats":null,"previous_names":[],"tags_count":31,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ReactTraining%2Freact-stdio","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ReactTraining%2Freact-stdio/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ReactTraining%2Freact-stdio/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ReactTraining%2Freact-stdio/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ReactTraining","download_url":"https://codeload.github.com/ReactTraining/react-stdio/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":225648338,"owners_count":17502175,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-08-04T15:01:02.089Z","updated_at":"2024-11-20T23:32:26.496Z","avatar_url":"https://github.com/ReactTraining.png","language":"JavaScript","readme":"# react-stdio [![Travis][build-badge]][build] [![npm package][npm-badge]][npm]\n\n[build-badge]: https://img.shields.io/travis/ReactTraining/react-stdio/master.svg?style=flat-square\n[build]: https://travis-ci.org/ReactTraining/react-stdio\n[npm-badge]: https://img.shields.io/npm/v/react-stdio.svg?style=flat-square\n[npm]: https://www.npmjs.org/package/react-stdio\n\n[react-stdio](https://npmjs.org/package/react-stdio) lets you render [React](https://reactjs.org/) components on the server, regardless of the backend technology you're using.\n\nAs its name suggests, other processes communicate with react-stdio using standard streams. The protocol is JSON, so any environment that can spawn a child process and write JSON to its stdin can use the server. Requests are handled serially, so responses are issued in the same order requests are received.\n\n## Installation\n\nIf you have node installed, you can install using npm:\n\n    $ npm install -g react-stdio\n\nThis will put the `react-stdio` executable in your [`npm bin`](https://docs.npmjs.com/cli/bin).\n\nIf you don't have node installed, you can download the executable for your architecture from [the releases page](https://github.com/ReactTraining/react-stdio/releases).\n\n## Usage\n\nAfter installation, execute `react-stdio` to start the server.\n\nTo render a React component, write a JSON blob to stdin with any of the following properties:\n\n    component       The path to a file that exports a React component (required)\n    props           Any props you want to pass to the component (optional, default is {})\n    render          The type of rendering (optional, default is renderToString)\n\nIf the request is successful, the server will put a JSON blob with `{\"html\":\"...\",\"context\":...}` on stdout. If the request fails for some reason, the JSON will have an `error` property instead of `html`.\n\nExample:\n\n    $ echo '{\"component\":\"./MyComponent\",\"props\":{\"message\":\"hello\"}}' | react-stdio\n\nIf you'd like to use a render method other than [`renderToString`](https://facebook.github.io/react/docs/top-level-api.html#reactdomserver.rendertostring) or [`renderToStaticMarkup`](https://facebook.github.io/react/docs/top-level-api.html#reactdomserver.rendertostaticmarkup) you can pass a path to a file that exports your rendering function. The signature of your `render` function should be:\n\n```js\nfunction render(element, callback) {\n  // ...\n}\n```\n\nThis function is asynchronous so you have time to do data fetching before you render if you wish. Call `callback(error, html)` when you're finished.\n\n## Environment\n\nYour component file is loaded in a vanilla node.js environment. If you need additional code transforms to run (e.g. using webpack or Browserify) you should create your bundle first and tell react-stdio to load your bundle instead of the plain component file. If you're using webpack to build your bundle, you'll want to use `\"libraryTarget\": \"commonjs2\"` in your config so the bundle exports the component using `module.exports = MyComponent`.\n\nAlso, since react-stdio uses the `stdout` stream for all program output, all writes your code makes to `process.stdout` (including `console.log` statements) are redirected to `process.stderr`.\n\n## Integrations\n\n* [Elixir/Phoenix](http://blog.overstuffedgorilla.com/render-react-with-phoenix/)\n* [Ruby on Rails](https://github.com/aaronvb/rails_react_stdio)\n\nIf you'd like to add an integration here, please submit a PR.\n\n## About\n\nreact-stdio is developed and maintained by [React Training](https://reacttraining.com). If you're interested in learning more about what React can do for your company, please [get in touch](mailto:hello@reacttraining.com)!\n","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FReactTraining%2Freact-stdio","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FReactTraining%2Freact-stdio","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FReactTraining%2Freact-stdio/lists"}