{"id":26997490,"url":"https://github.com/grimmerk/typescript-full-stack-example","last_synced_at":"2026-04-13T13:32:38.482Z","repository":{"id":39003985,"uuid":"284472232","full_name":"grimmerk/typescript-full-stack-example","owner":"grimmerk","description":"A full-stack example that integrates some famous stack: TypeScript, React Hooks, Redux Toolkit, GraphQL, NestJS, TypeORM, PostgreSQL, Passport.js, JWT, Traefik, Azure.","archived":false,"fork":false,"pushed_at":"2023-01-24T05:12:07.000Z","size":2783,"stargazers_count":1,"open_issues_count":37,"forks_count":0,"subscribers_count":2,"default_branch":"develop","last_synced_at":"2025-04-04T02:18:21.957Z","etag":null,"topics":["fullstack","immerjs","jwt","nest","nestjs","passportjs","postgresql","react-hooks","redux-toolkit","reverse-proxy","traefik","typeorm"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","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/grimmerk.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}},"created_at":"2020-08-02T13:58:14.000Z","updated_at":"2022-07-16T07:48:26.000Z","dependencies_parsed_at":"2023-02-13T18:02:19.210Z","dependency_job_id":null,"html_url":"https://github.com/grimmerk/typescript-full-stack-example","commit_stats":null,"previous_names":["grimmerk/typescript-full-stack-example"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/grimmerk/typescript-full-stack-example","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/grimmerk%2Ftypescript-full-stack-example","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/grimmerk%2Ftypescript-full-stack-example/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/grimmerk%2Ftypescript-full-stack-example/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/grimmerk%2Ftypescript-full-stack-example/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/grimmerk","download_url":"https://codeload.github.com/grimmerk/typescript-full-stack-example/tar.gz/refs/heads/develop","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/grimmerk%2Ftypescript-full-stack-example/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31754955,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-13T13:27:56.013Z","status":"ssl_error","status_checked_at":"2026-04-13T13:21:23.512Z","response_time":93,"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":["fullstack","immerjs","jwt","nest","nestjs","passportjs","postgresql","react-hooks","redux-toolkit","reverse-proxy","traefik","typeorm"],"created_at":"2025-04-04T02:18:24.818Z","updated_at":"2026-04-13T13:32:38.450Z","avatar_url":"https://github.com/grimmerk.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# FullStack example\n\n## Installation\n\n1. Install Node.js 12+ \u0026 [`yarn 1`](https://classic.yarnpkg.com/lang/en/)\n2. Execute `yarn install` in client path.\n3. Execute `yarn install` in server path.\n4. Prepare [Docker](https://docs.docker.com/get-docker/) environment if you do not have\n\n## Development\n\n1. Execute `yarn start` in client path to launch dev react server, http://localhost:3000. You can also use `VSCode+F5` to use `Debugger for Chrome`.\n2. To launch PostgreSQL database, execute `docker run -p 5432:5432 --name some-postgres -d postgres:12.1`\n3. Use `VSCode+F5` to launch and debug API server, http://localhost:3001 which mainly uses GraphQL and only uses RESTFUL for authentication part. Or just execute `yarn start` to launch it.\n4. (optional) load the restaurant data, follow https://github.com/grimmer0125/full-stack-example#load-data\n\nOpen http://localhost:3000 to play this example.\n\n## Tech Stack\n\n- TypeScript (3.7+)\n- React\n- CRA (Create React App)\n- [Redux Toolkit](https://redux-toolkit.js.org/) (which enhances Redux development, such as `write \"mutating\" logic in Redux Toolkit` since [Immer](https://immerjs.github.io/immer/docs/introduction) inside)\n- PostgreSQL\n- [NestJS](https://nestjs.com/) (a Node.js server framework)\n    - [GraphQL](https://docs.nestjs.com/graphql/quick-start)\n- [TypeORM](https://typeorm.io/)\n- Passport (jwt)\n\n## Functionality\n\n### Load data\n\nIf you do not see restaurant list, please execute this step. If you already see, doing this will duplicate the data.\n\nOpen http://localhost:3001/graphql, in the playground, paste\n\n```\nmutation fetchRawData {\n  etlRestaurantRawData(sourceURL:\"https://gist.githubusercontent.com/seahyc/7ee4da8a3fb75a13739bdf5549172b1f/raw/f1c3084250b1cb263198e433ae36ba8d7a0d9ea9/hours.csv\")\n}\n```\n\nto ask the server to load the Data.\n\np.s. A few restuarants(~11) in the raw data has duplicate row. Currently the code just choose the first one.\n\n### Signup and login\n\nNo email verification and password reset yet.\n\n### Pagination of Restaurants\n\n### Filter by WeekDay, Time, and restaurant Name\n\n### Save restaurants to a named collection and browse collection list\n\nIn `/dashboard`, click the `+` button in a restaurant cell, input a restaurant collection, then click `submit` to store it. You can input a new or existing collection name. For existing collection, click a collection to copy its name to speed up.\n\nTo browse collection list, click `collection` link in the top bar to navigate to `/collection`. You can also click a collection to see its restaurant list in the right panel.\n\n### Share a restaurant collection to others\n\n1. Before doing this, your target user must signup first.\n2. In `/collection`, click `+` to input the email of the target user.\n3. The target user will be authorized to see this shared collection and able to add a restaurant into it !!\n\n### Real-time Auto Synchronization Data\n\nCurrent done:\n\n1. User A chooses a shared collection to see its detailed restaurant list.\n2. User B add a restaurant into this shared collection.\n3. User A will see the added one without refreshing.\n\n## Run this app locally via docker-compose\n\n`docker-compose up -d`\n\n## Testing on deployed site\n\nTry http://fullstack.grimmer.io/, deployed on Azure.\nYou can use http://api.grimmer.io/graphql to import restaurant data if there is no data yet.\n\nCommand: [Load data](#load-data)\n\n### Use reverse proxy, traefik to deploy\n\ntraefik: https://docs.traefik.io/\n\nSteps:\n\n1. Install docker, docker-compose and login private docker registry.\n2. Frontend setting: `export REACT_APP_API_URL=api.grimmer.io`\n3. db setting:\n   1. `export POSTGRES_USER=YOUR_USER`\n   2. `export POSTGRES_PASSWORD=YOUR_PASSWORD`\n   3. `export POSTGRES_DB=YOUR_DB`\n4. `docker network create traefik_net`\n5. `docker-compose -f traefik-docker-compose.yml up -d`\n6. `docker-compose -f docker-compose.azure.yml up -d`\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgrimmerk%2Ftypescript-full-stack-example","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgrimmerk%2Ftypescript-full-stack-example","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgrimmerk%2Ftypescript-full-stack-example/lists"}