{"id":13480040,"url":"https://github.com/antonybudianto/cra-universal","last_synced_at":"2025-04-12T18:48:34.477Z","repository":{"id":23999441,"uuid":"100356302","full_name":"antonybudianto/cra-universal","owner":"antonybudianto","description":"🌏 Create React App companion for universal app. No eject, zero config, Streaming SSR with Suspense. React 18 ready","archived":false,"fork":false,"pushed_at":"2022-09-26T10:15:52.000Z","size":3465,"stargazers_count":429,"open_issues_count":12,"forks_count":54,"subscribers_count":9,"default_branch":"master","last_synced_at":"2025-04-01T21:03:28.667Z","etag":null,"topics":["cli","create-react-app","react","server-side-rendering","ssr","universal","zero-config"],"latest_commit_sha":null,"homepage":"https://codesandbox.io/s/cra-universal-demo-9wnwb7","language":"JavaScript","has_issues":false,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/antonybudianto.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null},"funding":{"github":null,"patreon":"antonybudianto","open_collective":"antony-budianto","ko_fi":null,"tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"otechie":null,"custom":null}},"created_at":"2017-08-15T08:27:38.000Z","updated_at":"2025-03-25T03:42:04.000Z","dependencies_parsed_at":"2022-08-07T11:00:52.581Z","dependency_job_id":null,"html_url":"https://github.com/antonybudianto/cra-universal","commit_stats":null,"previous_names":[],"tags_count":33,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/antonybudianto%2Fcra-universal","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/antonybudianto%2Fcra-universal/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/antonybudianto%2Fcra-universal/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/antonybudianto%2Fcra-universal/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/antonybudianto","download_url":"https://codeload.github.com/antonybudianto/cra-universal/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248596559,"owners_count":21130718,"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":["cli","create-react-app","react","server-side-rendering","ssr","universal","zero-config"],"created_at":"2024-07-31T17:00:33.613Z","updated_at":"2025-04-12T18:48:34.453Z","avatar_url":"https://github.com/antonybudianto.png","language":"JavaScript","funding_links":["https://patreon.com/antonybudianto","https://opencollective.com/antony-budianto","https://opencollective.com/cra-universal","https://www.patreon.com/antonybudianto","https://opencollective.com/cra-universal/contribute","https://opencollective.com/cra-universal/organization/0/website","https://opencollective.com/cra-universal/organization/1/website","https://opencollective.com/cra-universal/organization/2/website","https://opencollective.com/cra-universal/organization/3/website","https://opencollective.com/cra-universal/organization/4/website","https://opencollective.com/cra-universal/organization/5/website","https://opencollective.com/cra-universal/organization/6/website","https://opencollective.com/cra-universal/organization/7/website","https://opencollective.com/cra-universal/organization/8/website","https://opencollective.com/cra-universal/organization/9/website"],"categories":["JavaScript","Tools","cli"],"sub_categories":[],"readme":"# cra-universal\n\n### Create React App Universal CLI\n\n[![Financial Contributors on Open Collective](https://opencollective.com/cra-universal/all/badge.svg?label=financial+contributors)](https://opencollective.com/cra-universal) [![npm version](https://badge.fury.io/js/cra-universal.svg)](https://badge.fury.io/js/cra-universal)\n\n\u003cp align=\"center\"\u003e\n\u003cimg width=\"500\" height=\"350\" alt=\"zero\" src=\"https://user-images.githubusercontent.com/7658554/42420108-261a1c5a-82eb-11e8-8ac0-ce2e0245e0ff.png\"\u003e\n\u003c/p\u003e\n\nCreate React App companion for universal app. No eject, zero config with customization, supports string and node stream API\n\n\u003e [Live Demo](https://codesandbox.io/s/cra-universal-demo-9wnwb7) | [Official Doc](https://antonybudianto.github.io/cra-universal)\n\n## Features\n\n- **No [eject](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#npm-run-eject)** needed!\n- **Zero config** by default and **customizable**\n- **Server-side rendering** for your SEO\n- **Code-splitting** that works universally\n- The core middleware is fully **unit-tested**\n- Works alongside `react-scripts`, not as replacement\n\n## Prerequisites\n\n- Node \u003e= 14.17.5 LTS recommended\n- npx is required\n\n## Installation\n\n```sh\n# Create new cra\ncreate-react-app myapp\ncd myapp\n\n# Install new cra-universal\nyarn add -D cra-universal\n\n# Install peer dependency\nyarn add @cra-express/core express@4.18.1\n```\n\n## Existing Projects\n\n```sh\n\n# Install new cra-universal\nyarn add -D cra-universal\n\n# Install peer dependency\nyarn add @cra-express/core express@4.18.1\n\n# init custom server (optional)\nyarn run cra-universal init\n\n#This will copy ./templates/server into the current directory (it should be run on CRA client root)\n\n```\n\n## Client code change\n\nPlease update your render method on `src/index.js`\n\n```js\n// before\nconst root = ReactDOM.createRoot(document.getElementById('root'));\nroot.render(\u003cApp /\u003e);\n\n// after\nReactDOM.hydrateRoot(document.getElementById('root'), \u003cApp /\u003e);\n```\n\n## Development\n\n```sh\n# Start CRA client\nnpm start\n\n## Start CRA server, then open http://localhost:3001 in your browser\nnpx cra-universal start\n```\n\n## Production\n\n```sh\n# Change directory to your project root first, and run:\nnpx cra-universal build\n\n# This command will build both client and server and put them into `./dist`\n# Run locally:\n# $ cd dist \u0026\u0026 npm i\n# $ npm run serve\n```\n\n## Deployment\n\n1.  First, follow the Production guide mentioned above.\n2.  Since the bundle used [Webpack Node Externals](https://www.npmjs.com/package/webpack-node-externals), you need to run `npm install --production` on the copied `/dist`, but this time you don't need to install its `devDependencies`\n3.  Use process manager like [PM2](https://github.com/Unitech/pm2) to run your server, your run target is ./dist/server/bundle.js\n\n## Credit\n\n- Create React App https://github.com/facebook/create-react-app\n- Thanks for https://github.com/ayroblu/ssr-create-react-app-v2 for the base!\n\n## Support\n\nIf you like this project, please kindly support it by becoming a patron at my [Patreon](https://www.patreon.com/antonybudianto) page. Thanks!\n\n## Sponsors\n\n- Stan Day (stan@auraside.com)\n\n## Contributors\n\n### Code Contributors\n\nThis project exists thanks to all the people who contribute. [[Contribute](CONTRIBUTING.md)].\n\u003ca href=\"https://github.com/antonybudianto/cra-universal/graphs/contributors\"\u003e\u003cimg src=\"https://opencollective.com/cra-universal/contributors.svg?width=890\u0026button=false\" /\u003e\u003c/a\u003e\n\n### Financial Contributors\n\nBecome a financial contributor and help us sustain our community. [[Contribute](https://opencollective.com/cra-universal/contribute)]\n\n#### Individuals\n\n\u003ca href=\"https://opencollective.com/cra-universal\"\u003e\u003cimg src=\"https://opencollective.com/cra-universal/individuals.svg?width=890\"\u003e\u003c/a\u003e\n\n#### Organizations\n\nSupport this project with your organization. Your logo will show up here with a link to your website. [[Contribute](https://opencollective.com/cra-universal/contribute)]\n\n\u003ca href=\"https://opencollective.com/cra-universal/organization/0/website\"\u003e\u003cimg src=\"https://opencollective.com/cra-universal/organization/0/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/cra-universal/organization/1/website\"\u003e\u003cimg src=\"https://opencollective.com/cra-universal/organization/1/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/cra-universal/organization/2/website\"\u003e\u003cimg src=\"https://opencollective.com/cra-universal/organization/2/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/cra-universal/organization/3/website\"\u003e\u003cimg src=\"https://opencollective.com/cra-universal/organization/3/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/cra-universal/organization/4/website\"\u003e\u003cimg src=\"https://opencollective.com/cra-universal/organization/4/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/cra-universal/organization/5/website\"\u003e\u003cimg src=\"https://opencollective.com/cra-universal/organization/5/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/cra-universal/organization/6/website\"\u003e\u003cimg src=\"https://opencollective.com/cra-universal/organization/6/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/cra-universal/organization/7/website\"\u003e\u003cimg src=\"https://opencollective.com/cra-universal/organization/7/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/cra-universal/organization/8/website\"\u003e\u003cimg src=\"https://opencollective.com/cra-universal/organization/8/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/cra-universal/organization/9/website\"\u003e\u003cimg src=\"https://opencollective.com/cra-universal/organization/9/avatar.svg\"\u003e\u003c/a\u003e\n\n## License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fantonybudianto%2Fcra-universal","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fantonybudianto%2Fcra-universal","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fantonybudianto%2Fcra-universal/lists"}