Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore(docs): add http to localhost #28896

Merged
merged 1 commit into from
Jan 6, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@ exports.sourceNodes = ({ actions, createNodeId, createContentDigest }) => {
}
```

The above code block creates a node called `"Test Node"` as seen from the `title` parameter. If this process is successful restarting the server will make the `allTestNode` query available at `localhost:8000/___graphql`.
The above code block creates a node called `"Test Node"` as seen from the `title` parameter. If this process is successful restarting the server will make the `allTestNode` query available at `http://localhost:8000/___graphql`.

> Libraries like [Axios](https://www.npmjs.com/package/axios) can be used to handle calls in the `gatsby-node.js` file

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -269,7 +269,7 @@ exports.sourceNodes = async ({
// ...
```

You can read about each of the packages that are working together in [Apollo's docs](https://www.apollographql.com/docs/react/). The end result is creating a `client` that you can use to call methods like `query` to get data from the source it's configured to work with. In this case, that is `localhost:4000` where you should have the API running. If you can't configure the API to run locally, you can update the URLs for the client to use `gatsby-source-plugin-api.glitch.me` where a version of the API is deployed, instead of `localhost:4000`.
You can read about each of the packages that are working together in [Apollo's docs](https://www.apollographql.com/docs/react/). The end result is creating a `client` that you can use to call methods like `query` to get data from the source it's configured to work with. In this case, that is `http://localhost:4000` where you should have the API running. If you can't configure the API to run locally, you can update the URLs for the client to use `gatsby-source-plugin-api.glitch.me` where a version of the API is deployed, instead of `http://localhost:4000`.

#### Query data from the API

Expand Down Expand Up @@ -924,8 +924,8 @@ You can test that this is working by running the site again and updating one of

Follow these steps to test it out:

1. Open up your site at `localhost:8000` after you run `gatsby develop`
2. Open up the GraphQL playground at `localhost:4000` (if you are running the `api` folder locally) or `https://gatsby-source-plugin-api.glitch.me/` and first run a query for posts:
1. Open up your site at `http://localhost:8000` after you run `gatsby develop`
2. Open up the GraphQL playground at `http://localhost:4000` (if you are running the `api` folder locally) or `https://gatsby-source-plugin-api.glitch.me/` and first run a query for posts:

```graphql
query {
Expand Down
2 changes: 1 addition & 1 deletion docs/tutorial/using-multiple-themes-together.md
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,7 @@ module.exports = {
gatsby develop
```

4. Checkout `localhost:8000` to see what is currently there.
4. Checkout `http://localhost:8000` to see what is currently there.

## Add content

Expand Down
10 changes: 5 additions & 5 deletions examples/creating-source-plugins/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,23 +22,23 @@ _Note: if you aren't using yarn, you can navigate into each of the 3 folders and

Then you can run the api or example projects in separate terminal windows with the commands below.

For the API which runs at `localhost:4000`, use this command:
For the API which runs at `http://localhost:4000`, use this command:

```
yarn workspace api start
```

And to run the example site with `gatsby develop` at `localhost:8000`, use this command:
And to run the example site with `gatsby develop` at `http://localhost:8000`, use this command:

```
yarn workspace example-site develop
```

Running the example site also runs the plugin because it is included in the site's config. You'll see output in the console for different functionality and then can open up the browser to `localhost:8000` to see the site.
Running the example site also runs the plugin because it is included in the site's config. You'll see output in the console for different functionality and then can open up the browser to `http://localhost:8000` to see the site.

## Developing and Experimenting

You can open up `localhost:4000` with the API running, which will load a GraphQL Playground, which is a GraphQL IDE (like GraphiQL, that Gatsby runs at `localhost:8000/___graphql`) for running queries and mutations on the data from the API.
You can open up `http://localhost:4000` with the API running, which will load a GraphQL Playground, which is a GraphQL IDE (like GraphiQL, that Gatsby runs at `http://localhost:8000/___graphql`) for running queries and mutations on the data from the API.

You can test a query like this to see data returned:

Expand All @@ -53,7 +53,7 @@ query {

This query will return the IDs for all posts in the API. You can copy one of these IDs and provide it as an argument to a mutation to update information about that post.

You can run 3 different mutations from the GraphQL Playground (at `localhost:4000`): `createPost`, `updatePost`, and `deletePost`. These methods would mimic CRUD operations happening on the API of the data source like a headless CMS. An example `updatePost` mutation is outlined below.
You can run 3 different mutations from the GraphQL Playground (at `http://localhost:4000`): `createPost`, `updatePost`, and `deletePost`. These methods would mimic CRUD operations happening on the API of the data source like a headless CMS. An example `updatePost` mutation is outlined below.

When you run a mutation on a post, a subscription event is published, which lets the plugin know it should respond and update nodes. The following mutation can be copied into the left side of the GraphQL playground so long as you replace "post-id" with a value returned for an ID from a query (like the one above).

Expand Down
8 changes: 4 additions & 4 deletions packages/gatsby-admin/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ Or in the `scripts` section of your `package.json`:
}
```

Once you run `gatsby develop` with the flag enabled, you can visit `localhost:8000/___admin` to view Admin for your Gatsby site!
Once you run `gatsby develop` with the flag enabled, you can visit `http://localhost:8000/___admin` to view Admin for your Gatsby site!

![Gatsby Admin homepage showing a list of installed plugins, as well as a search input to search for plugins to install](https://user-images.githubusercontent.com/7525670/95580804-36df9200-0a38-11eb-80a7-fbd847a13da1.png)

Expand Down Expand Up @@ -58,7 +58,7 @@ It also listens to the [`gatsby develop` status server](https://github.com/gatsb

To discover where they are (and whether they are already running) there is a service discovery mechanism in `gatsby-core-utils`. It stores the ports of the running Gatsby site(s) at `~/.config/gatsby/sites/<pathhash>/<servername>.json`.

Admin can then fetch `localhost:8000/___services` (where `:8000` is the well-known port of the running site), which returns a list of all the random ports used by the site:
Admin can then fetch `http://localhost:8000/___services` (where `:8000` is the well-known port of the running site), which returns a list of all the random ports used by the site:

```
$ curl http://localhost:8000/___services | jq
Expand All @@ -75,7 +75,7 @@ $ curl http://localhost:8000/___services | jq
}
```

That's how the Admin frontend knows to connect to `localhost:50400/graphql` to connect to the GraphQL server, and `localhost:60731` to connect to the develop status server.
That's how the Admin frontend knows to connect to `http://localhost:50400/graphql` to connect to the GraphQL server, and `http://localhost:60731` to connect to the develop status server.

#### Production Deployment

Expand Down Expand Up @@ -111,4 +111,4 @@ $ gatsby-dev --packages gatsby gatsby-cli gatsby-recipes gatsby-core-utils gatsb
$ GATSBY_EXPERIMENTAL_ENABLE_ADMIN=true gatsby develop
```

Then visit `localhost:8000/\_\_\_admin` and you should see Gatsby Admin for your site!
Then visit `http://localhost:8000/\_\_\_admin` and you should see Gatsby Admin for your site!
2 changes: 1 addition & 1 deletion packages/gatsby-design-tokens/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -242,4 +242,4 @@ with
const header = system
```

and you should see `Futura PT` turning into `system-ui` within a few moments on your `localhost:8000`.
and you should see `Futura PT` turning into `system-ui` within a few moments on your `http://localhost:8000`.