{"id":19174409,"url":"https://github.com/d3dc/react-flying-saucer","last_synced_at":"2025-05-07T18:20:32.977Z","repository":{"id":33606989,"uuid":"157924265","full_name":"d3dc/react-flying-saucer","owner":"d3dc","description":"A simple framework built on top of create-react-app for scalable single-page apps with functional react.","archived":false,"fork":false,"pushed_at":"2023-01-04T18:39:07.000Z","size":7463,"stargazers_count":3,"open_issues_count":63,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-04-20T01:32:59.647Z","etag":null,"topics":["app","create-react-app","effects","esnext","feature-fleet","hooks","memoize","modules","mothership","react","react-hooks","redux","rematch","selectors","spa","star-app","star-child","wip"],"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/d3dc.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":"2018-11-16T21:39:42.000Z","updated_at":"2021-10-02T07:20:06.000Z","dependencies_parsed_at":"2023-01-15T01:45:27.233Z","dependency_job_id":null,"html_url":"https://github.com/d3dc/react-flying-saucer","commit_stats":null,"previous_names":[],"tags_count":42,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/d3dc%2Freact-flying-saucer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/d3dc%2Freact-flying-saucer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/d3dc%2Freact-flying-saucer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/d3dc%2Freact-flying-saucer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/d3dc","download_url":"https://codeload.github.com/d3dc/react-flying-saucer/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252931790,"owners_count":21827164,"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":["app","create-react-app","effects","esnext","feature-fleet","hooks","memoize","modules","mothership","react","react-hooks","redux","rematch","selectors","spa","star-app","star-child","wip"],"created_at":"2024-11-09T10:17:43.727Z","updated_at":"2025-05-07T18:20:32.935Z","avatar_url":"https://github.com/d3dc.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# react-flying-saucer 🛸\n\n\u003e The 👾 aren't in the bikeshed.\n\n\u0026nbsp;\n\n\u0026nbsp;\n\nA simple framework built on top of `create-react-app` for scalable single-page apps with functional react.\n\nTries to get out of the way by using only next generation JavaScript features and React spacedust.\n\n**features:**\n\n- 🔗 Compose feature modules as declarative React components\n- 🔩 Build functional pipelines with opinionated syntax from [babel-preset-techno-babel](https://github.com/d3dc/babel-preset-techno-babel).\n- 📬 [Models](https://rematch.gitbooks.io/rematch/docs/api.html#models) provide a bite-size abstraction for redux and keep rendering fast with first-class [selectors](https://rematch.gitbooks.io/rematch/plugins/select/)\n- 🧱 Write business logic and data sources as plain modules and let dependency injection handle the rest\n\n- 🔋 Batteries included!\n\n  |                      |                                                                              |                          |\n  | -------------------- | ---------------------------------------------------------------------------- | ------------------------ |\n  | suspense             | scoped route trees                                                           | dynamic models           |\n  | error boundaries     | enhanced [routing components](https://github.com/ReactTraining/react-router) | shorthand redux bindings |\n  | contextual constants | composable view side-effects                                                 | automatic react import\n\n\u0026nbsp;\n\n\u0026nbsp;\n\n---\n\n## Quick Start\n\n- `$npx create-react-flying-saucer app`\n- `$cd app`\n- `$yarn start`\n\n---\n\n\u0026nbsp;\n\n\u0026nbsp;\n\n## Whats in the Box?\n\n`react-flying-saucer` proposes two declarative react primitives to build your app with. It abstracts outside effects (navigation) and redux state to an \"app\" container provided by a `Mothership`. Using React semantics, the mothership declaratively lists the `Features` that modify and listen to this context - preserving redux state scoping and feature component lazy loading.\n\n```jsx\n\u003cMothership\u003e\n    \u003cFormsProvider\u003e\n        \u003cDashboard path=\"/dash\"\u003e\n            \u003cGlobalStats /\u003e\n            \u003cTimerBar /\u003e\n        \u003c/Dashboard\u003e\n        \u003cAccount\n            path=\"/\"\n            loggedInView=\"Dashboard\"\n        /\u003e\n    \u003c/FormsProvider\u003e\n\u003c/Mothership\u003e\n\n```\n\n### [Simple API](docs/api.md)\n\n- [Mothership](/docs/api.md#the-app)\n- [Features](/docs/api.md#features)\n  - [`RematchModel`](/docs/api.md#rematchmodel)\n  - [`FlyingSaucerView`](/docs/api.md#flyingsaucerview)\n\n\u0026nbsp;\n\n- [`history` bindings](/docs/api.md#enhanced-routing)\n- [`context` bindings](/docs/api.md#context-bindings)\n- [`redux` bindings](/docs/api.md#redux-bindings)\n\n### One-touch bootstrap or migrate\n\n- run the latest `create-react-app` and add `react-flying-saucer`\n\n```sh\n$ npx create-react-flying-saucer \u003cproject\u003e\n```\n\n- add `react-flying-saucer` to an existing app bootstrapped with `create-react-app`\n\n```sh\n$ cd \u003cproject\u003e\n$ npx migrate-react-flying-saucer\n```\n\n### import aliases\n\n\u003e One flying saucer, Two flying saucers\n\n`@`\n\nA link to the source root of your project.\n\n`@@`\n\n[re-exports](#simple-api) everything you need for creating and mounting a feature fleet.\n\n```js\nimport { $$ } from '@@'\nimport Sidebar from '@/features/sidebar'\n```\n\n### dot files\n\n`react-flying-saucer` respects any `.babelrc` and `.eslintrc` configuration files. Any additional configuration your project needs can be added directly to these files.\n\n\u0026nbsp;\n\n\u0026nbsp;\n\n---\n\n## Examples\n\n- [TodoMVC](examples/todos)\n- [Nesting Features](examples/nesting-features-with-grommet)\n\n## More Reading\n\n- [API](docs/api.md)\n- [WIP][getting started](docs/gettting-started.md)\n- [WIP][standalone mothership](docs/standalone-mothership.md)\n\n## Packages\n- [bundle-react-flying-saucer](packages/bundle-react-flying-saucer)\n  - package a flying saucer app as NPM ready CJS and ESM!\n- [create-react-flying-saucer](packages/create-react-flying-saucer)\n  - create a create-react-app app and then codemod it to outerspace!\n- [react-flying-saucer](packages/react-flying-saucer)\n  - npm scripts for a react experience that's out of this world!\n- [react-mothership](packages/react-mothership)\n  - react primitives for building stellar apps!\n\n## Typescript when?!\n\nAs soon as @rematch/rematch fixes its core typings.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fd3dc%2Freact-flying-saucer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fd3dc%2Freact-flying-saucer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fd3dc%2Freact-flying-saucer/lists"}