I had some trouble to get server side rendering with the AWSAppSyncClient working. I finally found a solution in https://github.com/awslabs/aws-mobile-appsync-sdk-js/issues/82 but it might be worth to share it here as well. Instead of adding a big code block to each file I'll just refer to this Pull Request.
______
In case you want to use the `AWSAppSyncClient` you just need to replace the `create()` function with this function:
```jsx
import AWSAppSyncClient from 'aws-appsync';
import { AUTH_TYPE } from 'aws-appsync/lib/link/auth-link';
function create(initialState) {
const client = new AWSAppSyncClient({
url: AWS_AppSync.graphqlEndpoint,
region: AWS_AppSync.region,
auth: {
type: AUTH_TYPE.API_KEY,
apiKey: AWS_AppSync.apiKey,
// Amazon Cognito Federated Identities using AWS Amplify
//credentials: () => Auth.currentCredentials(),
// Amazon Cognito user pools using AWS Amplify
// type: AUTH_TYPE.AMAZON_COGNITO_USER_POOLS,
// jwtToken: async () => (await Auth.currentSession()).getIdToken().getJwtToken(),
},
disableOffline: true,
}, {
cache: new InMemoryCache().restore(initialState || {}),
ssrMode: true
});
return client;
}
```
* [fix] apollo-redux: Separate out entire example #3463
Apollo and Redux are completely separate ways of managing state. This example serves as a conduit if you were using Apollo 1.X with Redux, and are migrating to Apollo 2.x, however, you have chosen not to manage your entire application state within Apollo (`apollo-link-state`).
There is no "withData" function that allows you to call either/or. You must call "withRedux" and/or "withApollo" on your Component. They can be combined in the example at `index.js` or remain separate as seen in `apollo.js` and `redux.js`.
Going forward, this example may go the way of the dodo.
* [chore] reformat code to match next syntax
Localize prettier sometimes has a mind of its own. 😄️
* Fix linting
* [refactor] with-apollo-and-redux: 2.0.0
- This ports over `with-apollo` (w/ recent `withRouter` fix and addition
for Post) along with implementing `apollo-cache-redux` #3463
- The `redux` side of things is lacking (it is the *same* as the
original example)
- Created a `routes.js` for use on Server and Client Side (to expand the
PostList functionality)
- SSR is maintained
- Redid the "PostVote" a bit... sorry. 😬️
Possible todo(s):
- Add in API and Clock Examples from `with-redux` to show Apollo and
Redux working together a bit more
- redux-saga (I personally use this, may be too opinionated for the base
example though)
Packages updated:
- apollo-cache-redux
- apollo-client-preset
- graphql
- graphql-anywhere
- graphql-tag
- isomorphic-unfetch
- next-routes
- prop-types
- react
- react-apollo
- react-dom
- redux
* [refactor] fix linting issues
When I run `yarn lint` explicitly these were caught, but not doing a
build proper. Apologies on that!
* [chore] 📦️ package.json: like other examples
* [refactor] +apollo-cache-inmemory, -apollo-cache-redux
Separation of Apollo and Redux. 😄️
We could stand to use a few actual examples of Redux, though this is a
good starting block.
Some other code cleanup as well.
* Add minimal apollo example
* Update apollo example README
* Update apollo example demo link in README
* Fix button styles
* Fix show more button
* Alias demo url
* Include the data field on the Apollo store when hydrating
* Revert
* Include the data field on the Apollo store when hydrating per tpreusse's suggestion.
* Add example to faq section in README
* Sort by newest; Add active state to buttons
* Make optimization suggestions
* Use process.browser; inline props
* Pass wrapped component's initial props into component heirarchy if they exist
* Remove unnecessary sorting of array
* Update Apollo example
* Remove trailing comma
* Update reduxRootKey
* Remove unnecessary babelrc
* Update with-apollo example
- Remove use of deprecated 'reduxRootKey' option
- Add loading indicator inside pagination button
* Fix with-apollo example pagination; Pass initialState to ApolloClient
* Split apollo example into two (one with and without Redux integration)
* Rename createClient private function to _initClient
* Set initialState default parameter inside initClient function
* Remove redux dep from with-apollo example