{"id":17647772,"url":"https://github.com/moshfeu/synced-shopping-list","last_synced_at":"2025-05-07T04:11:08.854Z","repository":{"id":37014577,"uuid":"298868533","full_name":"moshfeu/synced-shopping-list","owner":"moshfeu","description":"A pwd Shopping List synced between clients, fully offline support.","archived":false,"fork":false,"pushed_at":"2025-03-11T21:28:51.000Z","size":2581,"stargazers_count":3,"open_issues_count":13,"forks_count":3,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-05-02T04:42:32.753Z","etag":null,"topics":["firebase","netlify","offline","react","shopping-list","typescript"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/moshfeu.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"License.md","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":"2020-09-26T17:46:55.000Z","updated_at":"2024-12-11T05:31:49.000Z","dependencies_parsed_at":"2024-06-24T21:25:37.976Z","dependency_job_id":"7dc0b136-eb50-4d31-87e9-93ca3f70f697","html_url":"https://github.com/moshfeu/synced-shopping-list","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/moshfeu%2Fsynced-shopping-list","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/moshfeu%2Fsynced-shopping-list/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/moshfeu%2Fsynced-shopping-list/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/moshfeu%2Fsynced-shopping-list/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/moshfeu","download_url":"https://codeload.github.com/moshfeu/synced-shopping-list/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252810273,"owners_count":21807759,"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":["firebase","netlify","offline","react","shopping-list","typescript"],"created_at":"2024-10-23T11:14:29.881Z","updated_at":"2025-05-07T04:11:08.832Z","avatar_url":"https://github.com/moshfeu.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Synced Shopping List\n\nA shopping list \u003ca href=\"https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps\" target=\"_blank\"\u003ePWA\u003c/a\u003e synced between clients.\n\n## Stack\n\n- React (CRA)\n- Typescript\n- Material-UI\n- Firebase\n- Netlify (hosting + functions)\n\n## Additional Capabilities\n\n1. Support fully offline. By nature firebase realtime [doesn't support](https://github.com/firebase/firebase-js-sdk/issues/3905#issuecomment-705194518) offline mode. This app does.\n2. When there is a new version, the app refreshes automatically (instead of `console.log` supplied by CRA template)\n\n## Installation\n\n### App\n\n```sh\nyarn\n```\n\n### Database (Firebase realtime database)\n\n1. Follow the instruction - \u003ca href=\"https://firebase.google.com/docs/database/web/start\" target=\"_blank\"\u003ehttps://firebase.google.com/docs/database/web/start\u003c/a\u003e.\n2. Rename `env.sample` to `.env.local` and update its content with the details received from firebase.\n3. Set up authentication - \u003ca href=\"https://firebase.google.com/docs/database/security/get-started#set_up\" target=\"_blank\"\u003ehttps://firebase.google.com/docs/database/security/get-started#set_up\u003c/a\u003e. The UI doesn't have login so it only supports external providers (e.g. Google)\n4. Limit the users who can access the db to avoid exceeding the free plan. You can do it by setting the \u003ca href=\"https://firebase.google.com/docs/database/security/get-started#access_your_rules\" target=\"_blank\"\u003erules\u003c/a\u003e write / read to certain users, like this:\n\n```json\n{\n  \"rules\": {\n    \".read\": \"auth.token.email == 'my@email.com' ||\n\t\t\t\t\t\t\tauth.token.email == 'my.friend@gmail.com'\",\n    \".write\": \"auth.token.email == 'my@email.com' ||\n\t\t\t\t\t\t\tauth.token.email == 'my.friend@gmail.com'\",\n  }\n}\n```\n\n### Storage (for item's image)\n\n- Enable cors - follow https://firebase.google.com/docs/storage/web/download-files#cors_configuration\n\n### Messaging (Push Notifications)\n\nIn order to let the server (the code will published soon) to send a push notification, the app should register itself to FCM (\"Firebase Cloud Messaging\"), get a token and submit it to server. In order to do this:\n\n1. [Register the app](https://firebase.google.com/docs/cloud-messaging/js/client#configure_web_credentials_with_fcm) and get the Notification Token.\n2. Add it as `REACT_APP_NOTIFICATION_TOKEN` to `env.local` / server env variable.\n\n### Deploy\n\n\u003ca href=\"https://app.netlify.com/start/deploy?repository=https://github.com/moshfeu/synced-shopping-list\" target=\"_blank\"\u003e\u003cimg src=\"https://www.netlify.com/img/deploy/button.svg\" alt=\"deploy with netlify\"\u003e\u003c/a\u003e\n\nIn the process you'll set the build variables the same as in the `.env` file.\n\nNotes:\n\n1. If you configure netlify manually (not via the \"Deploy\" button), don't forget to \u003ca href=\"https://docs.netlify.com/configure-builds/environment-variables/#declare-variables\" target=\"_blank\"\u003econfigure\u003c/a\u003e the build variables.\n2. `yarn push` triggers also `npm version` which bumps the app's version which reflected in the UI (main nav at the bottom)\n\n## Run\n\n```sh\nyarn start\n```\n\n### Run local functions under port 9999\n\n```sh\nnetlify functions:serve\n```\n\nThe *proxy* function aims to solve the CORS issue when trying to save an image from Google search result (Item Details \u003e Image \u003e Replace (Google)).\n\n### Credits\n\n- Illustrations by [undraw](https://undraw.co/) ❤️","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmoshfeu%2Fsynced-shopping-list","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmoshfeu%2Fsynced-shopping-list","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmoshfeu%2Fsynced-shopping-list/lists"}