{"id":21878875,"url":"https://github.com/moduscreateorg/modus-react","last_synced_at":"2026-04-05T20:36:12.308Z","repository":{"id":143422342,"uuid":"161384786","full_name":"ModusCreateOrg/modus-react","owner":"ModusCreateOrg","description":"Modus React App Scaffolding","archived":false,"fork":false,"pushed_at":"2023-10-02T18:05:27.000Z","size":646,"stargazers_count":2,"open_issues_count":6,"forks_count":1,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-03-22T00:15:28.017Z","etag":null,"topics":["modus","react","scaffolding","webpack"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"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/ModusCreateOrg.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-12-11T19:40:39.000Z","updated_at":"2020-08-28T18:31:12.000Z","dependencies_parsed_at":null,"dependency_job_id":"f362cda1-4427-4f2f-b93b-0f25b8afb1a0","html_url":"https://github.com/ModusCreateOrg/modus-react","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"purl":"pkg:github/ModusCreateOrg/modus-react","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ModusCreateOrg%2Fmodus-react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ModusCreateOrg%2Fmodus-react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ModusCreateOrg%2Fmodus-react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ModusCreateOrg%2Fmodus-react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ModusCreateOrg","download_url":"https://codeload.github.com/ModusCreateOrg/modus-react/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ModusCreateOrg%2Fmodus-react/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31449828,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-05T15:22:31.103Z","status":"ssl_error","status_checked_at":"2026-04-05T15:22:00.205Z","response_time":75,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["modus","react","scaffolding","webpack"],"created_at":"2024-11-28T08:14:00.568Z","updated_at":"2026-04-05T20:36:12.264Z","avatar_url":"https://github.com/ModusCreateOrg.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Modus React (MORe) Application Scaffolding\n\nMonorepo containing setup for a best-practice React application scaffolding\n\n[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)\n[![MIT Licensed](https://img.shields.io/badge/license-MIT-blue.svg?style=flat-square)](https://github.com/your/your-project/blob/master/LICENSE)\n[![Powered by Modus_Create](https://img.shields.io/badge/powered_by-Modus_Create-blue.svg?longCache=true\u0026style=flat\u0026logo=data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIwIDMwMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8cGF0aCBkPSJNOTguODI0IDE0OS40OThjMCAxMi41Ny0yLjM1NiAyNC41ODItNi42MzcgMzUuNjM3LTQ5LjEtMjQuODEtODIuNzc1LTc1LjY5Mi04Mi43NzUtMTM0LjQ2IDAtMTcuNzgyIDMuMDkxLTM0LjgzOCA4Ljc0OS01MC42NzVhMTQ5LjUzNSAxNDkuNTM1IDAgMCAxIDQxLjEyNCAxMS4wNDYgMTA3Ljg3NyAxMDcuODc3IDAgMCAwLTcuNTIgMzkuNjI4YzAgMzYuODQyIDE4LjQyMyA2OS4zNiA0Ni41NDQgODguOTAzLjMyNiAzLjI2NS41MTUgNi41Ny41MTUgOS45MjF6TTY3LjgyIDE1LjAxOGM0OS4xIDI0LjgxMSA4Mi43NjggNzUuNzExIDgyLjc2OCAxMzQuNDggMCA4My4xNjgtNjcuNDIgMTUwLjU4OC0xNTAuNTg4IDE1MC41ODh2LTQyLjM1M2M1OS43NzggMCAxMDguMjM1LTQ4LjQ1OSAxMDguMjM1LTEwOC4yMzUgMC0zNi44NS0xOC40My02OS4zOC00Ni41NjItODguOTI3YTk5Ljk0OSA5OS45NDkgMCAwIDEtLjQ5Ny05Ljg5NyA5OC41MTIgOTguNTEyIDAgMCAxIDYuNjQ0LTM1LjY1NnptMTU1LjI5MiAxODIuNzE4YzE3LjczNyAzNS41NTggNTQuNDUgNTkuOTk3IDk2Ljg4OCA1OS45OTd2NDIuMzUzYy02MS45NTUgMC0xMTUuMTYyLTM3LjQyLTEzOC4yOC05MC44ODZhMTU4LjgxMSAxNTguODExIDAgMCAwIDQxLjM5Mi0xMS40NjR6bS0xMC4yNi02My41ODlhOTguMjMyIDk4LjIzMiAwIDAgMS00My40MjggMTQuODg5QzE2OS42NTQgNzIuMjI0IDIyNy4zOSA4Ljk1IDMwMS44NDUuMDAzYzQuNzAxIDEzLjE1MiA3LjU5MyAyNy4xNiA4LjQ1IDQxLjcxNC01MC4xMzMgNC40Ni05MC40MzMgNDMuMDgtOTcuNDQzIDkyLjQzem01NC4yNzgtNjguMTA1YzEyLjc5NC04LjEyNyAyNy41NjctMTMuNDA3IDQzLjQ1Mi0xNC45MTEtLjI0NyA4Mi45NTctNjcuNTY3IDE1MC4xMzItMTUwLjU4MiAxNTAuMTMyLTIuODQ2IDAtNS42NzMtLjA4OC04LjQ4LS4yNDNhMTU5LjM3OCAxNTkuMzc4IDAgMCAwIDguMTk4LTQyLjExOGMuMDk0IDAgLjE4Ny4wMDguMjgyLjAwOCA1NC41NTcgMCA5OS42NjUtNDAuMzczIDEwNy4xMy05Mi44Njh6IiBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz4KPC9zdmc+)](https://moduscreate.com)\n\n## Goal: 0-config Best-Practice React Scaffolding\n\nThe goal of Modus-React (MORe) is to enable teams to use best-practice React scaffolding without having to worry about the config.\n\nAlthough influenced by Create-React-App (CRA), this setup is different in a way that it gives more flexibility in some areas and takes away in others in an effort to promote healthy architectural patterns.\n\nCRA is notorious for making it hard add customizations to Webpack or Babel without ejecting. MORe exposes configuration files to make it easier to extend.\n\nMORe encourages specific design patterns that are enterprise-friendly. We discourage using hip new libraries in favor of proven industry-standard techniques.\n\n## Installing\n\n```bash\nnpm i @modus/babel-preset-react @modus/eslint-config-modus @modus/more --registry=https://npm.modus.app/\n```\n\nor shorter\n\n```bash\nnpm i @modus/{babel-preset-react,eslint-config-modus,more} --registry=https://npm.modus.app/\n```\n\nThen use [sample project](../sample) as a basis for setting up `package.json`, `.eslintrc.yml`, and `babel.config.js`.\n\n**TODO:** use `modus` CLI to do that automatically\n\n## Using\n\n### ENV variables\n\nYou can use environment variables to configure build scripts.\n\nHere's the list of supported variables with their defaults:\n\n```\nSOURCE_DIR=src\nBUILD_DIR=build\nSOURCEMAPS=false\n```\n\nYou can override any of these variables with `.env` files. We support these formats (in the order of inclusion):\n\n```\n.env.${NODE_ENV}.local\n.env.${NODE_ENV}\n.env.local\n.env\n```\n\nThe order of inclusion means that anything in `.env` will override content in e.g. `.env.development.local`.\n\n### Extending Webpack\n\nMORe processes a built in Webpack configuration. If your project has a `webpack.config.js` file in root, the build process will include it and pass the default config to it.\n\nMake sure your configuration exports a function. The default configuration will be passed as an JavaScript object to the argument.\n\n##### Example:\n\n```js\n// webpack.config.js\n\nmodule.exports = defaultConfig =\u003e {\n  return {\n    ...defaultConfig,\n    stats: false,\n  };\n};\n```\n\n### DLLs\n\nDLLs precompile libraries to save time for development builds and re-builds.\n\nReact and React Router are included in DLLs by default. You can add other libraries by including them in package.json as an array in the `dll` property.\n\n```json\n\"dll\": [\n  \"foo\"\n]\n```\n\n### HTML Template\n\nUse `TEMPLATE` environmental variable to specify custom HTML template relative to the project root.\n\nHTML templates can consume variables. Variables are defined in `meta` property of the project's package.json.\n\n```json\n\"meta\": {\n  \"title\": \"My App\"\n}\n```\n\n```html\n\u003c!DOCTYPE html\u003e\n\u003chtml lang=\"en\"\u003e\n  \u003chead\u003e\n    \u003cmeta charset=\"utf-8\" /\u003e\n    \u003ctitle\u003e\u003c%= title %\u003e\u003c/title\u003e\n  \u003c/head\u003e\n  \u003cbody\u003e\u003c/body\u003e\n\u003c/html\u003e\n```\n\n## Development\n\nMake sure you have Lerna installed.\n\n```sh\nnpm i -g lerna\nlerna bootstrap\n```\n\nThis is a monorepo with all packages needed for a successful React Application scaffolding.\n\n### Adding dependencies\n\n```sh\nlerna add some-package --scope @modus/more\n```\n\nYou can use the same command to add monorepo packages to one another (similar to `npm link`)\n\n```sh\nlerna add @modus/eslint-config-modus --scope @modus/more\n```\n\n### Type safety\n\nThis project uses JSDoc annotations to provide type information in JS files via TypeScript. This works extremely well with VS Code, adds Intellisense, and doesn't require a build step.\n\nSee the [official docs](https://github.com/Microsoft/TypeScript/wiki/JSDoc-support-in-JavaScript) for more information.\n\n### Publishing\n\nThe project is currently published to Modus internal npm repo [https://npm.modus.app](https://npm.modus.app). This will change once we have a stable project.\n\n```sh\nlerna publish\n```\n\n## Contributing\n\nTake a look at the [project board](https://github.com/ModusCreateOrg/modus-react/projects/1) and see if there's anything you can help with. Once you find an item you could work on, please take ownership of the backlog item.\n\n1. Create a fork\n2. Create a WIP PR asap and reference (e.g. #4) the backlog item you're working on.\n3. Complete work and tag reviewers\n4. Let us know in Slack when you start and finish or when you need any help\n\n# Modus Create\n\n[Modus Create](https://moduscreate.com) is a digital product consultancy. We use a distributed team of the best talent in the world to offer a full suite of digital product design-build services; ranging from consumer facing apps, to digital migration, to agile development training, and business transformation.\n\n[![Modus Create](https://res.cloudinary.com/modus-labs/image/upload/h_80/v1533109874/modus/logo-long-black.png)](https://moduscreate.com)\n\nThis project is part of [Modus Labs](https://labs.moduscreate.com).\n\n[![Modus Labs](https://res.cloudinary.com/modus-labs/image/upload/h_80/v1531492623/labs/logo-black.png)](https://labs.moduscreate.com)\n\n# Licensing\n\nThis project is [MIT licensed](./LICENSE).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmoduscreateorg%2Fmodus-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmoduscreateorg%2Fmodus-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmoduscreateorg%2Fmodus-react/lists"}