https://github.com/skunkworker/rails-vue-ssr-hypernova-example
Rails Vue SSR with component import from rails, custom synchronous batching, caching of hypernova responses and VueJS.
https://github.com/skunkworker/rails-vue-ssr-hypernova-example
hacktoberfest hypernova rails-vue-ssr
Last synced: 7 months ago
JSON representation
Rails Vue SSR with component import from rails, custom synchronous batching, caching of hypernova responses and VueJS.
- Host: GitHub
- URL: https://github.com/skunkworker/rails-vue-ssr-hypernova-example
- Owner: skunkworker
- Created: 2020-01-02T07:08:29.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2023-11-01T04:29:46.000Z (over 2 years ago)
- Last Synced: 2024-10-11T00:09:41.971Z (over 1 year ago)
- Topics: hacktoberfest, hypernova, rails-vue-ssr
- Language: Ruby
- Homepage:
- Size: 3.73 MB
- Stars: 4
- Watchers: 1
- Forks: 0
- Open Issues: 47
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Rails + Vue SSR example
This example was made because of the following:
* Use components from `app/javascript` with Rails and SSR.
* Custom hypernova ruby API implementation with single and batch support.
* Cachable responses from hypernova.
**Running the example**
Run the procfile using foreman.
Then navigate to [localhost:3000](localhost:3000)
```
foreman start -f Procfile.dev
````
**Why wasn't `hypernova-ruby` used?**
Hypernova ruby writes to the `document.body` and when trying to cache the result you would get `__hypernova_render_token[0]__`, instead I wrote a simple helper using HTTParty that supports a batch of multiple components rendered together and a singular component render. [See this for more information about this issue](https://github.com/airbnb/hypernova-ruby/issues/15)
**How can I add more components?**
In the hypernova server index file `/vue-ssr/src/index.js` add your own component to the `if/else` block in `getComponent` and import the `.vue` file in the headers. Included is some basic webpack config for easy imports, like `Components/FooBar.vue` to resolve the file `/app/javascript/src/components/FooBar.vue`.