Skip to content

Instantly share code, notes, and snippets.

View takanorip's full-sized avatar
🍣
sushi

takanorip takanorip

🍣
sushi
39 followers · 1 following
View GitHub Profile
@takanorip
takanorip / apollo-ssr-skip.jsx
Created December 10, 2018 00:52
const withClientOnlyUser = () => (
<Query query={GET_USER_WITH_ID} ssr={false}>
{({ data }) => <span>I won't be run on the server</span>}
</Query>
);
@takanorip
takanorip / renderToStringWithData.js
Created December 10, 2018 03:00
import { renderToStringWithData } from "react-apollo"
const client = new ApolloClient(...);
renderToStringWithData(App).then((content) => {
const initialState = client.extract();
const html = <Html content={content} state={initialState} />;
res.status(200);
res.send(`<!doctype html>\n${ReactDOM.renderToStaticMarkup(html)}`);
@takanorip
takanorip / getDataFromTree.js
Last active December 10, 2018 03:07
import { getDataFromTree } from "react-apollo"
app.use((req, res) => {
const client = new ApolloClient(...);
getDataFromTree(App).then(() => {
const content = ReactDOM.renderToString(App);
const initialState = client.extract();
const html = <Html content={content} state={initialState} />;
@takanorip
takanorip / html.js
Created December 10, 2018 03:21
const Html = ({ content, state }) => (
<html>
<body>
<div id="root" dangerouslySetInnerHTML={{ __html: content }} />
<script dangerouslySetInnerHTML={{
__html: `window.__APOLLO_STATE__=${JSON.stringify(state).replace(/</g, '\\u003c')};`,
}} />
</body>
</html>
);
@takanorip
takanorip / lit-apollo-sample.js
Created December 11, 2018 17:37
// CodeSandboxで動かすときにエラーが出たので
// babel-polyfillをimportしてる
import "babel-polyfill";
import gql from "graphql-tag";
import { ApolloClient } from "apollo-client";
import { ApolloQuery, html } from "lit-apollo";
import { InMemoryCache } from "apollo-cache-inmemory";
import { from } from "apollo-link";
import { HttpLink } from "apollo-link-http";