{"id":13989628,"url":"https://github.com/shystruk/create-react-redux-app-structure","last_synced_at":"2025-04-09T14:06:31.226Z","repository":{"id":39032848,"uuid":"110350293","full_name":"shystruk/create-react-redux-app-structure","owner":"shystruk","description":"Create React + Redux app structure with build configurations ✨","archived":false,"fork":false,"pushed_at":"2023-02-27T17:42:49.000Z","size":5631,"stargazers_count":162,"open_issues_count":16,"forks_count":19,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-03-26T05:06:28.627Z","etag":null,"topics":["cors","express","folder-structure","page-visibility","react","react-starter-kit","redux","redux-starter-kit","redux-thunk","starter-kit"],"latest_commit_sha":null,"homepage":"","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/shystruk.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","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}},"created_at":"2017-11-11T14:07:13.000Z","updated_at":"2025-03-08T10:58:54.000Z","dependencies_parsed_at":"2024-01-15T16:51:59.259Z","dependency_job_id":null,"html_url":"https://github.com/shystruk/create-react-redux-app-structure","commit_stats":{"total_commits":162,"total_committers":5,"mean_commits":32.4,"dds":0.6358024691358024,"last_synced_commit":"6112780ceca9b0e138551dfa47f5afea42fe9fb3"},"previous_names":[],"tags_count":12,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shystruk%2Fcreate-react-redux-app-structure","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shystruk%2Fcreate-react-redux-app-structure/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shystruk%2Fcreate-react-redux-app-structure/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shystruk%2Fcreate-react-redux-app-structure/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/shystruk","download_url":"https://codeload.github.com/shystruk/create-react-redux-app-structure/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246819785,"owners_count":20839095,"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":["cors","express","folder-structure","page-visibility","react","react-starter-kit","redux","redux-starter-kit","redux-thunk","starter-kit"],"created_at":"2024-08-09T13:01:52.272Z","updated_at":"2025-04-02T13:08:56.248Z","avatar_url":"https://github.com/shystruk.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# Create React Redux App Structure [![Twitter URL](https://img.shields.io/twitter/url/http/shields.io.svg?style=social)](https://twitter.com/intent/tweet?hashtags=reactjs%20%23redux%20%23javascript\u0026original_referer=https%3A%2F%2Fpublish.twitter.com%2F\u0026ref_src=twsrc%5Etfw\u0026text=Start%20your%20project%20fast%20with%20Create%20React%20Redux%20App%20Structure\u0026tw_p=tweetbutton\u0026url=https%3A%2F%2Fgithub.com%2Fshystruk%2Fcreate-react-redux-app-structure\u0026via=shystrukk) #\n\n\n[![MIT Licence](https://badges.frapsoft.com/os/mit/mit.svg?v=103)](https://opensource.org/licenses/mit-license.php) [![codecov](https://codecov.io/gh/shystruk/create-react-redux-app-structure/branch/master/graph/badge.svg)](https://codecov.io/gh/shystruk/create-react-redux-app-structure) [![Build Status](https://travis-ci.org/shystruk/create-react-redux-app-structure.svg?branch=master)](https://travis-ci.org/shystruk/create-react-redux-app-structure) [![npm version](https://badge.fury.io/js/create-react-redux-app-structure.svg)](https://badge.fury.io/js/create-react-redux-app-structure)\n\nCreate React + Redux app structure with build configurations.\n\n## What can I find here? ##\n- [Express](https://expressjs.com/), Cors\n- [React](https://reactjs.org/) + [Redux](https://redux.js.org/), ES6, async/await\n- [Web Components](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements) (Custom Elements) integration\n- React Router\n- Internationalization\n- SASS\n- PostCSS (autoprefixer), so you do not need -webkit, -moz or other prefixes\n- Build script configuration **Development, Staging, Production** with CDN, [cache-busting](https://www.keycdn.com/support/what-is-cache-busting/) support\n- Build script to bundle JS, CSS, with sourcemaps\n- Unit tests [Jest](https://jestjs.io/), [Enzyme](http://airbnb.io/enzyme/)\n- E2E [Cypress](https://www.cypress.io/) tests\n- [ESLint](https://eslint.org/)\n- Ghooks (pre-commit with unit tests and eslint validation)\n- Code Coverage (https://codecov.io)\n- Travis CI runs Unit and E2E tests and report to codecov\n\n## Quick Start ##\nCreate React + Redux app structure works on macOS, Windows, and Linux.\nIf something doesn’t work, please file an [issue](https://github.com/shystruk/create-react-redux-app-structure/issues/new).\n\n#### npm\n`npm i -g create-react-redux-app-structure`\n\n#### yarn\n`yarn add global create-react-redux-app-structure`\n\n```\ncreate-react-redux-app-structure my-app\ncd my-app/\nnpm run fast-start\n```\nhttp://localhost:8080/ will be opened automatically.\n\nWhen you are ready to deploy to staging/production please see [Build Scripts](#build-scripts) section.\n\n## Getting Started ##\n**You will need to have Node \u003e= 6 on your local development machine and [Yarn](https://yarnpkg.com/en/docs/install#mac-stable) installed.**\n\nInstall it once globally:\n\n#### npm\n`npm i -g create-react-redux-app-structure`\n\n#### yarn\n`yarn add global create-react-redux-app-structure`\n\n\u003e Patience, please. It takes time, most of it is spent installing npm packages.\n\n### Creating an App ###\nTo create a new app, run:\n```\ncreate-react-redux-app-structure my-app\ncd my-app/\n```\nIt will create a directory called my-app inside the current folder.\n\n### Prepare config.json for build configurations ###\nFor running builds you need to have **config.json** in app/ folder.\nSo you can create new one or rename **app/config.json.example**.  \n\nInside that file:\n - **PATHS** is used in Grunt and Gulp tasks\n - **assetHost** CDN path for each build\n - **serverHost** is used for running e2e Cypress tests\n\n### Installation ###\n**`npm install`** or **`yarn install`**\n\n\u003eYou can run **npm run fast-start** script, it will install all npm packages, run dev build, server and open http://localhost:8080/\n\n![](images/demo.gif)\n\n### Run build script ###\nHave a look at [Build Scripts](#build-scripts) section\n\n### Run server ###\n**`node index.js`** or **npm run server**\n\nThen open http://localhost:8080/ to see test weather app :)\n\n## Build scripts ##\nDevelopment - **`npm run dev`** or **`yarn run dev`**\n\nProduction - **`npm run prod`** or **`yarn run prod`**\n\nStaging - **`npm run staging`** or **`yarn run staging`**\n\n\n## Tests ##\nUnit - **`npm run test`** or **`yarn run test`**\n\nUnit with watch - **`npm run test:watch`** or **`yarn run test:watch`**\n\nE2E - **`npm run e2e`** or **`yarn run e2e`**\n\nCoverage is here - *app/tests/__tests__/coverage/Icon-report/index.html*\n\n\n## Automation tests ##\nLet's imagine that for automation tests we need to get access to the Redux store.\nWe can do that by adding to the `window` object property with reference to the store. For e.g. in `app.jsx` file.\nAutomation tests run only in **staging**, so for production build we remove them out by Grunt task `strip_code` \n\n```javascript\n/* staging-code */\nwindow.store = store;\n/* end-staging-code */\n```\n\n## Tips ##\nKill all node processes:\n- MacOS `sudo killall -9 node`\n- Windows (cmd) `taskkill /f /im node.exe`\n\n## Detailed description about features and approaches ##\n- [How create-react-redux-app-structure helps you to start a project faster](https://medium.com/@shystruk/how-create-react-redux-app-structure-helps-you-to-start-a-project-faster-cf564c64689c)\n- [clearIntervals() when user has a nap](https://codeburst.io/clearintervals-when-user-has-a-nap-3bf8010c986b)\n- [Do you still register window event listeners in each component?](https://medium.com/@shystruk/do-you-still-register-window-event-listeners-in-each-component-react-in-example-31a4b1f6f1c8)\n- [v4 Create React + Redux app structure with build configurations. What’s new?](https://medium.com/@shystruk/v4-create-react-redux-app-structure-with-build-configurations-whats-new-523bdec328c6)\n- [Integrate Custom Elements into React app](https://medium.com/@shystruk/integrate-custom-elements-into-react-app-ef38eba12905)\n\n## Contributing ##\n\nI would love to have your help. \n\nIf you have an idea how to improve or found an issue please read the [Contributions Guidelines](CONTRIBUTING.md) before submitting a PR.\nThanks!\n\n## License\n\nMIT © [Vasyl Stokolosa](https://about.me/shystruk)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fshystruk%2Fcreate-react-redux-app-structure","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fshystruk%2Fcreate-react-redux-app-structure","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fshystruk%2Fcreate-react-redux-app-structure/lists"}