Merge pull request #355 from apollographql/gatsby-docs

Move from Hexo to Gatsby
This commit is contained in:
Trevor Blades
2019-03-25 15:44:03 -07:00
committed by GitHub
12 changed files with 11296 additions and 4763 deletions

2
docs/.gitignore vendored
View File

@@ -4,7 +4,7 @@ db.json
*.log
node_modules/
public/*
!public/_redirects
.deploy*/
docs.json
_multiconfig.yml
.cache

View File

@@ -1,52 +0,0 @@
title: Platform
propertytitle: How to use the Apollo GraphQL platform
description: How to use the Apollo GraphQL platform
versions:
- '1'
sidebar_categories:
null:
- index
- intro/platform
- intro/benefits
Tutorial:
- tutorial/introduction
- tutorial/schema
- tutorial/data-source
- tutorial/resolvers
- tutorial/production
- tutorial/client
- tutorial/queries
- tutorial/mutations
- tutorial/local-state
# - tutorial/whats-next
Platform:
- platform/schema-registry
- platform/schema-validation
- platform/client-awareness
- platform/operation-registry
- platform/editor-plugins
- platform/tracing
- platform/setup-analytics
- platform/errors
- platform/integrations
Resources:
- title: Principled GraphQL
href: https://www.principledgraphql.com
- resources/graphql-glossary
- resources/faq
References:
- references/apollo-config
- references/apollo-engine
- references/engine-proxy
github_repo: apollographql/apollo
content_root: docs/source
url: https://www.apollographql.com/docs
root: /docs/
public_dir: public/docs

View File

@@ -1,117 +0,0 @@
@color-primary: #22a699;
@color-secondary: #e535ab;
.docstart {
width: 100%;
height: 390px;
//border-right: 0px solid #22A699;
//border:0px solid #22A699;
}
.docstart .pop-banner {
background-color: fade(@color-primary, 5%);
border: 2px solid @color-primary;
padding: 0.5rem;
margin-left: 20%;
margin-right: 20%;
margin-bottom: 2rem;
.pb-content {
padding-left: 0;
padding-right: 0;
}
.pb-early-access {
font-weight: 700;
letter-spacing: 0.25em;
text-transform: uppercase;
color: @color-primary;
}
.pb-head {
font-weight: bold;
font-size: 1.1rem;
}
.pb-link,
.pb-link a {
color: @color-primary;
text-decoration: underline;
}
}
.fundamentals,
.quickstart,
.guides {
//border:0px solid #22A699;
width: 33.3%;
float: left;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
border-right: 0px;
p {
font-size: 0.8rem;
line-height: 1.5rem;
color: #81849b;
}
}
.headers {
padding-top: 10px;
padding-bottom: 10px;
}
#documentation-heading {
font-size: 20px;
}
.documentation-buttons {
display: flex;
justify-content: space-evenly;
width: 100%;
max-width: 640px;
margin: 0 auto 24px;
.btn.default {
color: white;
border: 2px solid @color-secondary;
border-radius: 3em;
text-indent: 0.1em;
letter-spacing: 0.1em;
text-transform: uppercase;
font-size: 14px;
line-height: 20px;
font-weight: 600;
padding: 12px 24px;
background-color: @color-secondary;
&.hollow {
color: @color-secondary;
background-color: white;
}
@media (max-width: 480px) {
font-size: 9px;
padding: 6px 12px;
}
}
}
// /*
// ##Device = Most of the Smartphones Mobiles (Portrait)
// ##Screen = B/w 320px to 479px
// */
@media (min-width: 320px) and (max-width: 480px) {
.docstart .pop-banner {
margin-left: 0;
margin-right: 0;
padding-left: 2rem;
padding-right: 2rem;
.pb-head {
padding-top: 0.3rem;
padding-bottom: 0.3rem;
}
.pb-link {
padding-left: 1.5rem;
padding-right: 1.5rem;
}
}
}

58
docs/gatsby-config.js Normal file
View File

@@ -0,0 +1,58 @@
module.exports = {
__experimentalThemes: [
{
resolve: 'gatsby-theme-apollo-docs',
options: {
root: __dirname,
subtitle: 'Platform',
description: 'How to use the Apollo GraphQL platform',
contentDir: 'docs/source',
basePath: '/docs',
githubRepo: 'apollographql/apollo',
sidebarCategories: {
null: [
'index',
'intro/platform',
'intro/benefits'
],
Tutorial: [
'tutorial/introduction',
'tutorial/schema',
'tutorial/data-source',
'tutorial/resolvers',
'tutorial/production',
'tutorial/client',
'tutorial/queries',
'tutorial/mutations',
'tutorial/local-state',
// 'tutorial/whats-next'
],
Platform: [
'platform/schema-registry',
'platform/schema-validation',
'platform/client-awareness',
'platform/operation-registry',
'platform/editor-plugins',
'platform/tracing',
'platform/setup-analytics',
'platform/errors',
'platform/integrations'
],
Resources: [
{
title: 'Principled GraphQL',
href: 'https://www.principledgraphql.com'
},
'resources/graphql-glossary',
'resources/faq'
],
References: [
'references/apollo-config',
'references/apollo-engine',
'references/engine-proxy'
]
}
}
}
]
};

15781
docs/package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@@ -1,26 +1,9 @@
{
"name": "hexo-site",
"version": "0.0.0",
"private": true,
"hexo": {
"version": "3.8.0"
},
"devDependencies": {
"apollo-hexo-config": "1.0.8",
"chexo": "1.0.7",
"hexo": "3.8.0",
"hexo-browsersync": "0.3.0",
"hexo-prism-plus": "1.1.0",
"hexo-renderer-ejs": "0.3.1",
"hexo-renderer-less": "0.2.0",
"hexo-renderer-marked": "0.3.2",
"hexo-server": "0.3.3",
"meteor-theme-hexo": "2.0.1"
},
"scripts": {
"start": "npm run build && chexo apollo-hexo-config -- server",
"build": "chexo apollo-hexo-config -- generate",
"clean": "hexo clean",
"test": "npm run clean; npm run build"
"start": "gatsby develop --prefix-paths"
},
"dependencies": {
"gatsby": "^2.2.11",
"gatsby-theme-apollo-docs": "^0.2.36"
}
}

View File

@@ -13,7 +13,5 @@ The Apollo GraphQL platform is an implementation of GraphQL that helps you manag
</div>
<div style="text-align:center">
![Graph layer](./img/platform.jpg)
<img src="./img/platform.jpg" alt="Graph layer">
</div>

View File

@@ -15,7 +15,7 @@ components, commercial extensions, and cloud services. The major pieces
are:
<div style="text-align:center">
![Graph layer](../img/platform-diagram.png)
<img src="../img/platform-diagram.png" alt="Graph layer">
</div>
<h2 id="open-source">Core open source components</h2>

View File

@@ -14,7 +14,7 @@ Apollo is a complete platform for implementing a graph over your data. It includ
Why do you need a graph? Today, one of the most difficult parts of building an app is figuring out your data layer. Often, there's many data sources you need to fetch from and many clients you need to support. When you layer a graph in between your services and your UI, you can remove a lot of complexity from your data fetching logic and ship features faster.
<div style="text-align:center">
![Graph layer](../images/graph-layer.png)
<img src="../images/graph-layer.png" alt="Graph layer">
</div>
**[GraphQL](https://www.graphql.org/)** is the specification that we'll be using to communicate between our graph API and client. The spec itself is language-agnostic and unopinionated, so we're choosing to implement GraphQL with the Apollo platform.
@@ -26,7 +26,7 @@ In this tutorial, we'll build an interactive app for reserving your spot on an u
Here's what the finished app will look like:
<div style="text-align:center">
![Space explorer](../images/space-explorer.png)
<img src="../images/space-explorer.png" alt="Space explorer">
</div>
The app has five screens: a login screen, a list of launches, a launch detail, a profile page, and a cart. The graph API powering our space app connects to a REST API and a SQLite database. Don't worry if you're unfamiliar with those technologies, you don't need to know how to build a REST API or SQLite database from scratch in order to complete the tutorial.

View File

@@ -186,15 +186,13 @@ The GraphQL Playground provides the ability to introspect your schema. **Introsp
<div style="text-align:center">
![Schema button](../images/schematab.png)
<br></br>
<img src="../images/schematab.png" alt="Schema button">
</div>
You can quickly have access to the documentation of a GraphQL API via the `schema` button.
<div style="text-align:center">
![More details on a Schema Type](../images/moredetailsonatype.png)
<br></br>
<img src="../images/moredetailsonatype.png" alt="More details on a Schema Type">
</div>
That's all for building our schema. Let's move on to the next part of our tutorial.

6
netlify.toml Normal file
View File

@@ -0,0 +1,6 @@
[build]
base = "docs/"
publish = "docs/public/"
command = "gatsby build --prefix-paths && mkdir -p docs && mv public/* docs && mv docs public/"
[build.environment]
NPM_VERSION = "6"