{"id":13819050,"url":"https://github.com/bessey/hypernova_apollo_rails","last_synced_at":"2025-05-16T04:32:10.572Z","repository":{"id":147723249,"uuid":"164174478","full_name":"bessey/hypernova_apollo_rails","owner":"bessey","description":"Example of React + Apollo + Hypernova + Rails + Webpacker","archived":false,"fork":false,"pushed_at":"2019-01-06T13:05:44.000Z","size":143,"stargazers_count":14,"open_issues_count":1,"forks_count":2,"subscribers_count":1,"default_branch":"master","last_synced_at":"2024-08-05T08:07:31.428Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"Ruby","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/bessey.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":"2019-01-05T02:28:34.000Z","updated_at":"2020-07-18T07:34:03.000Z","dependencies_parsed_at":"2023-04-03T14:49:28.093Z","dependency_job_id":null,"html_url":"https://github.com/bessey/hypernova_apollo_rails","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/bessey%2Fhypernova_apollo_rails","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bessey%2Fhypernova_apollo_rails/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bessey%2Fhypernova_apollo_rails/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bessey%2Fhypernova_apollo_rails/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bessey","download_url":"https://codeload.github.com/bessey/hypernova_apollo_rails/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":225405501,"owners_count":17469348,"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":[],"created_at":"2024-08-04T08:00:38.618Z","updated_at":"2024-11-19T18:30:54.083Z","avatar_url":"https://github.com/bessey.png","language":"Ruby","funding_links":[],"categories":["Happy Exploring 🤘"],"sub_categories":[],"readme":"# Rails + Webpacker + React + Apollo + Hypernova SSR\n\nComplete example for the blog post [Server Side Rendering for React + Apollo GraphQL Client](https://bessey.io/blog/2019/01/02/apollo-graphql-hypernova/).\n\nOn the Ruby side we have a Rails 5.2 app, with [Webpacker](https://github.com/rails/webpacker) installed, and customized to support [Hypernova](https://github.com/airbnb/hypernova). On the JS side, we have a couple React components, one using [Apollo GraphQL Client](https://github.com/apollographql/react-apollo).\n\n### Setup\n\n```sh\n# install dependencies\nbundle install\nyarn install\n# boot rails\n./bin/rails server\n# (optional) boot hypernova for SSR\nyarn run hypernova\n```\n\n### Points of Interest\nThere's plenty of Rails + Webpacker boilerplate here, so here's some key places to look for implementation details:\n\n- [./config/initializers/hypernova.rb](./config/initializers/hypernova.rb) - Hypernova configuration, including a Rails error logger on failure, which really helps when debugging!\n- [./script/hypernova.js](./script/hypernova.js) - the Hypernova server script, to run in production for SSR, and optionally in development for testing SSR (though Hypernova will fall back to just client side rendering just fine)\n- [./config/webpack/server.js](./config/webpack/server.js) - a new Webpacker environment for outputting Hypernova compatible JS.\n- [./config/webpack/{development,production}.js](./config/webpack/development.js) - slightly changed from default scaffolding to _also_ build server.js\n- [./app/javascript/packs/hypernova-server.js](./app/javascript/packs/hypernova-server.js) - the Hypernova server entry point, all SSR components must be registered in this (as well as application.js for client rendering too)\n- [./app/javascript/hypernovaApolloRenderer.js](./app/javascript/hypernovaApolloRenderer.jsx) - customized component renderer, extending the [hypernova-react](https://github.com/airbnb/hypernova-react) package's source to also include [react-apollo](https://github.com/apollographql/react-apollo) data pre-fetching\n- [./app/javascript/containers/withApollo.js](./app/javascript/containers/withApollo.js) - HOC providing to the client a self-rehydrating Apollo Client Provider\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbessey%2Fhypernova_apollo_rails","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbessey%2Fhypernova_apollo_rails","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbessey%2Fhypernova_apollo_rails/lists"}