[Doc] graphql tutorial

[jcalcaben]

Description

This topic creates a tutorial about using GraphQL in PWA Studio.

Related Issue

Closes PWA-307

Acceptance

Any developer

Verification Stakeholders

Any developer

Specification

Verification Steps

1. Navigate to the pwa-devdocs directory: cd pwa-devdocs
2. Run the linter: yarn lint src/tutorials/pwa-studio-fundamentals/work-with-graphql
3. Verify no linting issues
4. Start the preview server: yarn develop
5. Navigate to the tutorials section
6. Verify topic is listed on the left navigation and linked to the correct page

Screenshots / Screen Captures (if appropriate)

Checklist

• I have updated the documentation accordingly, if necessary.
  [ ] I have added tests to cover my changes, if necessary.

[PWAStudioBot]

	Fails
🚫	A version label is required. A maintainer must add one.

	Messages
📖	Access a deployed version of this PR here. Make sure to wait for the "pwa-pull-request-deploy" job to complete.
📖	DangerCI Failures related to missing labels/description/linked issues/etc will persist until the next push or next nightly build run (assuming they are fixed).
📖	Associated JIRA tickets: PWA-307.

Generated by 🚫 dangerJS against 79f2281

[devops-pwa-codebuild]

Performance Test Results

The following fails have been reported by WebpageTest. These numbers indicates a possible performance issue with the PR which requires further manual testing to validate.

https://pr-2432.pwa-venia.com : LH Performance Expected 0.85 Actual 0.52, LH Best Practices Expected 1 Actual 0.92, WPT Cache Expected 90 Actual 88
https://pr-2432.pwa-venia.com/venia-tops.html : LH Performance Expected 0.75 Actual 0.35, LH Best Practices Expected 1 Actual 0.92
https://pr-2432.pwa-venia.com/valeria-two-layer-tank.html : LH Performance Expected 0.8 Actual 0.51, LH Accessibility Expected 0.9 Actual 0.89, LH Best Practices Expected 1 Actual 0.92

[supernova-at]

Looks good! We have started to export objects from our .gql.js files in the shape of

{
  queries: {}
  mutations: {}
}

but I don't think that's too important to capture here.

Likewise, there's some stylistic differences around checking for and displaying Loading. Instead of doing Loading at the end, we usually explicitly check for loading and "early out" render a Loading state.

Again, I'm not sure that makes much difference here.

[supernova-at]

Quick typo fix then 👍