{"id":20758517,"url":"https://github.com/albertogasparin/react-starterkit","last_synced_at":"2025-04-30T03:47:23.878Z","repository":{"id":66831545,"uuid":"47418825","full_name":"albertogasparin/react-starterkit","owner":"albertogasparin","description":"Universal webapp boilerplate w/ Koa and React + Redux + router","archived":false,"fork":false,"pushed_at":"2017-12-21T15:18:11.000Z","size":390,"stargazers_count":10,"open_issues_count":1,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-04-30T03:47:15.149Z","etag":null,"topics":["boilerplate","koa","react","react-router","redux","sass","starter-kit","webpack","webpack2"],"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/albertogasparin.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,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2015-12-04T17:23:27.000Z","updated_at":"2020-08-11T02:43:24.000Z","dependencies_parsed_at":"2023-02-23T01:30:45.468Z","dependency_job_id":null,"html_url":"https://github.com/albertogasparin/react-starterkit","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/albertogasparin%2Freact-starterkit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/albertogasparin%2Freact-starterkit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/albertogasparin%2Freact-starterkit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/albertogasparin%2Freact-starterkit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/albertogasparin","download_url":"https://codeload.github.com/albertogasparin/react-starterkit/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":251638756,"owners_count":21619662,"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":["boilerplate","koa","react","react-router","redux","sass","starter-kit","webpack","webpack2"],"created_at":"2024-11-17T09:51:46.743Z","updated_at":"2025-04-30T03:47:23.873Z","avatar_url":"https://github.com/albertogasparin.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# React starterkit\n\n\n[![Dependency Status](https://david-dm.org/albertogasparin/react-starterkit.svg?style=flat-square)](https://david-dm.org/albertogasparin/react-starterkit)\n[![devDependency Status](https://david-dm.org/albertogasparin/react-starterkit/dev-status.svg?style=flat-square)](https://david-dm.org/albertogasparin/react-starterkit#info=devDependencies)\n[![License](http://img.shields.io/:license-mit-blue.svg)](http://albertogasparin.mit-license.org)\n\nServer: Koa, React + router + Redux isomorphic rendering, Marko template streaming  \nClient: React + router + Redux, Sass, SVG icons setup\n\n\n\n## Setup\n\n``` sh\nnpm install\n```\n\n\n\n## Development\n\nTo start the node server (watching) run:\n``` sh\nnpm run watch\n```\nThe default browser entry point while developing is `127.0.0.1:3000`. \nWebpack middleware handles all `/assets` requests, while Koa handles all others\n\n\n\n## Testing\n\nTests run with Mocha + Expect for both client and server:\n``` sh\nnpm run test -s\n# or\nnpm run test:unit:watch # for TDD\n```\nReact components testing is done with [Enzyme](https://github.com/airbnb/enzyme/), a library that allows you to use a jQuery-like API to query the virtual dom.\n\nCode coverage reports are also available thanks to [Nyc](https://github.com/bcoe/nyc):\n``` sh\nnpm run coverage\n```\n\n\n## Production\n\nFirst, build the JS files ()client + server and the CSS files (extracted):\n``` sh\nnpm run build\n```\n\nTo run node with production env:\n``` sh\nNODE_ENV=production npm run start\n```\nNow `127.0.0.1:3000` will serve your entire app.\n\n\n\n## ENV variables\n\nYou can dynamically change some behaviors of the app by either prepending these props to the shell command or by adding them to a `.env` file. See `.env-example` for supported keys.\n\n\n\n## Config variables\n\nWe suggest you to add constants and configuration options in `lib/config.js`. \n\n\n\n## Adding API endpoints\n\nTo create a set of endpoints (`/api/users` for instance), first add `users/index.js` inside the `./api` folder. Then define your methods (like `list()`, `create()`, ...) and export an object with:  \n  - keys: `GET/POST/PUT/DELETE` *space* `name`\n  - values: the generator function that will be called by the router\n\n``` js\nconst API = {\n  'GET /todos': list,\n  'POST /todos': create,\n  'PUT /todos/:id': update,\n};\nexport default API;\n```\n\nThen, import that `API` object in `./api/index.js` and combine those routes with the ones already in. \n\n\n\n## Server-side data fetching with Redux \n\nThere is no consolidated way of retrieving resources server-side from a Redux action. We suggest you to provides a third argument to the Redux thunk: an `api` object. You can provide two different modules clientside and serverside, see `./www/all/api.js` and `./app/api.js` for examples.\n\n\n## How to\n\n**Passing config variables client-side**  \nProperties defined under `client` in `./lib/config` are automatically exposed client-side under `CLIENT_CONFIG` global.\n\n**Getting rid of React-router**  \nYou can easily get rid of it on the client side by removing `react-router` related code. The minified bundle size will be reduced by ~50kB. The router can still be used server-side to provide 404s and redirects.\n\n**Manually (and quickly) restart the server**  \nJust type `rs` in the console and press enter. [node-supervisor](https://github.com/petruisfan/node-supervisor) will do the rest.\n\n\n\n## Troubleshooting\n\n**Missing CSS while serving the built bundle**  \nThe external CSS file is loaded by `www/all/templates/index.marko` only if the node env is not `development`.  \nTry: `NODE_ENV=test npm run start`\n\n\n\n## Useful addons \u0026 packages\n\n- [scroll-behavior](https://github.com/rackt/scroll-behavior)  \n  Adds scroll behaviors (scroll to top / restore) on route change\n- [react-helmet](https://github.com/nfl/react-helmet)  \n  Change doc `head` (title, meta, ...) from within components (w/ server-side support)\n- [immutable-js](https://github.com/facebook/immutable-js) / [seamless-immutable](https://github.com/rtfeldman/seamless-immutable)  \n  Immutable data / helpers\n- [redux-batched-subscribe](https://github.com/tappleby/redux-batched-subscribe)  \n  Batch redux updates to avoid multiple re-renders\n\n\n\n**Similar projects**  \n[react-redux-starter-kit](https://github.com/davezuko/react-redux-starter-kit), \n[isomorphic-redux](https://github.com/bananaoomarang/isomorphic-redux), \n[react-redux-isomorphic-example](https://github.com/coodoo/react-redux-isomorphic-example), \n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falbertogasparin%2Freact-starterkit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Falbertogasparin%2Freact-starterkit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falbertogasparin%2Freact-starterkit/lists"}