{"id":17963363,"url":"https://github.com/kristerkari/observable-redux-json-api-example","last_synced_at":"2026-05-01T12:31:09.911Z","repository":{"id":66125974,"uuid":"123723442","full_name":"kristerkari/observable-redux-json-api-example","owner":"kristerkari","description":"A minimal example to show how to use observable-redux-json-api library  using React and Express.js.","archived":false,"fork":false,"pushed_at":"2018-04-19T07:08:51.000Z","size":211,"stargazers_count":0,"open_issues_count":1,"forks_count":1,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-10-25T09:37:59.232Z","etag":null,"topics":["crud","demo-app","example-app","json-api","react","redux","redux-observable","rxjs"],"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/kristerkari.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-03-03T19:15:46.000Z","updated_at":"2025-05-27T06:56:38.000Z","dependencies_parsed_at":null,"dependency_job_id":"18997596-cf6b-4158-83e9-10cee9fa4c97","html_url":"https://github.com/kristerkari/observable-redux-json-api-example","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/kristerkari/observable-redux-json-api-example","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kristerkari%2Fobservable-redux-json-api-example","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kristerkari%2Fobservable-redux-json-api-example/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kristerkari%2Fobservable-redux-json-api-example/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kristerkari%2Fobservable-redux-json-api-example/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/kristerkari","download_url":"https://codeload.github.com/kristerkari/observable-redux-json-api-example/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kristerkari%2Fobservable-redux-json-api-example/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32497809,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-30T13:12:12.517Z","status":"online","status_checked_at":"2026-05-01T02:00:05.856Z","response_time":64,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"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":["crud","demo-app","example-app","json-api","react","redux","redux-observable","rxjs"],"created_at":"2024-10-29T11:35:18.004Z","updated_at":"2026-05-01T12:31:09.878Z","avatar_url":"https://github.com/kristerkari.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Observables + Redux + JSON API Example App\n\n[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](https://egghead.io/courses/how-to-contribute-to-an-open-source-project-on-github)\n\nA minimal example to show how to use [observable-redux-json-api](https://github.com/kristerkari/observable-redux-json-api) library using [React](https://reactjs.org/) and [Express.js](https://expressjs.com/).\n\nThis example app includes both backend ([Express](https://expressjs.com/)) and frontend ([React](https://reactjs.org/)) to show you how you can use [Redux](https://redux.js.org/), [RxJS](http://reactivex.io/rxjs/) and [JSON API](http://jsonapi.org/) together.\n\nIf you want to see an example of just using Redux and JSON API without RxJS, [have a look at this example app](https://github.com/tomharvey/redux-json-api-demo/) which uses the normal `redux-json-api`.\n\n## This example app uses the following libraries\n\n### Frontend\n\n* [React](https://reactjs.org/)\n* [Redux Observable](https://redux-observable.js.org/) (+ peer deps [Redux](https://redux.js.org/) and [RxJS](http://reactivex.io/rxjs/))\n* [observable-redux-json-api](https://github.com/kristerkari/observable-redux-json-api) (+ peer dep [Redux Thunk](https://github.com/gaearon/redux-thunk))\n\n### Backend\n\n* [Express.js](https://expressjs.com/)\n* [JSON API Serializer](https://github.com/SeyZ/jsonapi-serializer)\n\n## Setup\n\n### Step 1: Clone this repo\n\n```sh\ngit clone git@github.com:kristerkari/observable-redux-json-api-example.git\n```\n\n### Step 2: Move to project and install project dependencies\n\n```sh\ncd observable-redux-json-api-example\n```\n\n```sh\nnpm install\n```\n\nor if you use Yarn:\n\n```sh\nyarn install\n```\n\n### Step 3: Start Express server\n\n```sh\nnpm start\n```\n\nor\n\n```sh\nyarn start\n```\n\n### Step 4: Start Webpack server\n\n```sh\nnpm run browser\n```\n\nor\n\n```sh\nyarn browser\n```\n\n### Step 5: Open React app in your web browser.\n\nOpen `http://localhost:8080` in your web browser.\n\n## Visualize bundle size\n\nIt's important for any library to keep it's bundle size small. Currently the bundle size of the example app without minifying the code is around 60kb gzipped. There is some work still to be done to get that size to be smaller.\n\nTo visualize what the example app's bundle consists of:\n\n```sh\nnpm run analyze-bundle\n```\n\nor\n\n```sh\nyarn analyze-bundle\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkristerkari%2Fobservable-redux-json-api-example","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkristerkari%2Fobservable-redux-json-api-example","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkristerkari%2Fobservable-redux-json-api-example/lists"}