# Getting started with Gatsby? **URL:** \ **Category:** Installation\ **Created:** [January 10, 2019, 2:02pm UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948 "2019-01-10T14:02:09Z")\ **Posts on this page:** 20\ **Page:** 1
**Author:** ![svikashk](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/svikashk/32/580_2.png) [@svikashk](https://forum.ghost.org/u/svikashk)\ **Post date:** [January 10, 2019, 2:02pm UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/1 "2019-01-10T14:02:09Z")
Huge congrats on the latest updates, folks! I remember having a look at your docs when you moved it to gatsby and was immediately in love with how fast it was. Naturally, when I saw the tweet last night, I was excited. However, as someone who isn’t well equipped with the dev world, I was wondering if there are any beginner’s guide on how to use Gatsby with ghost? Any pointers will be appreciated. 🙂 ---
**Author:** ![Aileen](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/aileen/32/9846_2.png) [@Aileen](https://forum.ghost.org/u/Aileen)\ **Post date:** [January 11, 2019, 2:12am UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/2 "2019-01-11T02:12:43Z")
Thank you! The best point for you to start is using the official Gatsby + Ghost starter here: [GitHub - TryGhost/gatsby-starter-ghost: A starter template to build lightning fast websites with Ghost & Gatsby](https://github.com/TryGhost/gatsby-starter-ghost) Give this a try and let us know if you get stuck or the information is unclear 🤗 ---
**Author:** ![MLFromScratch](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/mlfromscratch/32/2278_2.png) [@MLFromScratch](https://forum.ghost.org/u/MLFromScratch)\ **Post date:** [January 11, 2019, 3:15am UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/3 "2019-01-11T03:15:07Z")
What about Ghost(Pro) users? How would it be available for them? ---
**Author:** ![vikaspotluri123](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/vikaspotluri123/32/24_2.png) [@vikaspotluri123](https://forum.ghost.org/u/vikaspotluri123)\ **Post date:** [January 11, 2019, 4:32am UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/4 "2019-01-11T04:32:05Z")
The Ghost Docs use Ghost(Pro) as a content source. This forum topic might give you a bit of background as to how a Gatsby+Ghost integration works: > [@Gatsby without Netlify](https://forum.ghost.org/t/gatsby-without-netlify/4936/2): > > Netlify is a large proponent of JAMstack and has done a lot of work towards pushing it forward. It’s just a service that makes static site deployment simple and easy. The downside for not using Netlify is you have to add some logic to handle the stuff Netlify abstracts from you. With a basic usecase, you might have your frontend source managed with git, via a service like Github, and your content managed through Ghost. Every time you make a change to your production Github branch (as an example… the tl;dr is your Ghost publication will be set in private mode, and you will use the content API to pull posts from your publication and build your static site. That static site will be hosted somewhere like Netlify ---
**Author:** ![MLFromScratch](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/mlfromscratch/32/2278_2.png) [@MLFromScratch](https://forum.ghost.org/u/MLFromScratch)\ **Post date:** [January 12, 2019, 5:21pm UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/5 "2019-01-12T17:21:19Z")
But your explanation sounds like you would just switch to another place to host the content and then let that place serve the site? So if you write a post then 1. Netlify webhook takes content through Ghost API 2. Netlify serves content somewhere? Or what? But where does Netlify serve that content? And how? How could you make that content be served on the same domain as a site is running before switching to Netlify? It honestly seems more like a hassle than anything, but I’m open to trying it. I’m just not exactly sure how you would proceed. ---
**Author:** ![vikaspotluri123](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/vikaspotluri123/32/24_2.png) [@vikaspotluri123](https://forum.ghost.org/u/vikaspotluri123)\ **Post date:** [January 12, 2019, 5:45pm UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/6 "2019-01-12T17:45:09Z")
> [@MLFromScratch](#): > > But your explanation sounds like you would just switch to another place to host the content and then let that place serve the site? That’s right, Ghost is only being used as a content management interface, and is not responsible for the site frontend. Netlify serves the content from its own servers - your build script will generate files, and Netlify will take those files and serve them just like you would static HTML. Ghost has the ability to set the host for the admin panel - in the case of Ghost(Pro), you have your `.ghost.io` domain as well as your dedicated domain (for example, `docs.ghost.org`) which actually has the frontend So, to answer your question, unless you use a more advanced server configuration, the admin panel for Ghost will be hosted on a domain different than where your content is hosted > [@MLFromScratch](#): > > It honestly seems more like a hassle than anything, but I’m open to trying it. I’m just not exactly sure how you would proceed. This isn’t really something super necessary - it’s more of Ghost having a larger feature set, rather than something everyone should use. If you have a use case for deploying static sites in this method, go for it, but using Ghost as you have been for the past few years is still a completely normal and functional method for managing your site. ---
**Author:** ![vikaspotluri123](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/vikaspotluri123/32/24_2.png) [@vikaspotluri123](https://forum.ghost.org/u/vikaspotluri123)\ **Post date:** [January 13, 2019, 3:40pm UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/8 "2019-01-13T15:40:10Z")
Yep, because you’re going to be pulling in posts from the ghost instance ---
**Author:** ![vikaspotluri123](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/vikaspotluri123/32/24_2.png) [@vikaspotluri123](https://forum.ghost.org/u/vikaspotluri123)\ **Post date:** [January 13, 2019, 4:09pm UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/10 "2019-01-13T16:09:49Z")
Your best bet is the starter repo: > **[GitHub - TryGhost/gatsby-starter-ghost: A starter template to build lightning...](https://github.com/TryGhost/gatsby-starter-ghost)** > > A starter template to build lightning fast websites with Ghost & Gatsby - GitHub - TryGhost/gatsby-starter-ghost: A starter template to build lightning fast websites with Ghost & Gatsby ---
**Author:** ![vikaspotluri123](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/vikaspotluri123/32/24_2.png) [@vikaspotluri123](https://forum.ghost.org/u/vikaspotluri123)\ **Post date:** [January 14, 2019, 2:22am UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/12 "2019-01-14T02:22:05Z")
It’s really difficult to provide information without being able to see the logs. For example, how do you know Ghost isn’t communicating with Netlify? Are your builds not being triggered? Are you able to configure Gatsby to pull in posts from Ghost using the content API key? ---
**Author:** ![vikaspotluri123](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/vikaspotluri123/32/24_2.png) [@vikaspotluri123](https://forum.ghost.org/u/vikaspotluri123)\ **Post date:** [January 14, 2019, 2:42pm UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/14 "2019-01-14T14:42:54Z")
Did you update the content API key in `.ghost.json`? > ---
**Author:** ![Kevin](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/kevin/32/32_2.png) [@Kevin](https://forum.ghost.org/u/Kevin)\ **Post date:** [January 14, 2019, 5:26pm UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/16 "2019-01-14T17:26:28Z")
You also need to change the `apiUrl` values to point at your Ghost instance, in your case it would be your Ghost(Pro) subdomain so something like `"https://xyz.ghost.io"` (replacing `xyz` with your actual subdomain). ---
**Author:** ![MLFromScratch](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/mlfromscratch/32/2278_2.png) [@MLFromScratch](https://forum.ghost.org/u/MLFromScratch)\ **Post date:** [January 14, 2019, 5:38pm UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/17 "2019-01-14T17:38:44Z")
Thank you guys, this is useful info for the rest that want to try Gatsby integration soon! ---
**Author:** ![superwhykz](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/superwhykz/32/2444_2.png) [@superwhykz](https://forum.ghost.org/u/superwhykz)\ **Post date:** [January 27, 2019, 3:55pm UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/19 "2019-01-27T15:55:55Z")
hi @vikaspotluri123, I new to Ghost. For that **contentApiKey** do I need to add **Custom Integration** and use that key. Or there is something else? I tried to roll to Netliify and I am getting this - ![image](https://us1.discourse-cdn.com/flex015/uploads/ghost2/original/2X/a/ae0e16fb0c1c5508efc1ebb056b2f224695a703e.png) and locally I am getting this > Exported queries are only executed for Page components. Instead of an exported > query, either co-locate a GraphQL fragment and compose that fragment into the > query (or other fragment) of the top-level page that renders this component, or > use a in this component. For more info on fragments and > composition, see [http://graphql.org/learn/queries/#fragments](http://graphql.org/learn/queries/#fragments) and for more > information on , see [Querying Data in Components using StaticQuery | Gatsby](https://gatsbyjs.org/docs/static-query) > success extract queries from components — 0.218 s⠁ > (sharp:29701): GLib-GObject-WARNING \*\*: 10:50:06.358: cannot register existing type ‘VipsObject’ > (sharp:29701): GLib-CRITICAL \*\*: 10:50:06.358: g\_once\_init\_leave: assertion ‘result != 0’ failed > (sharp:29701): GLib-GObject-WARNING \*\*: 10:50:06.358: invalid class cast from ‘VipsForeignLoadCsv’ to ‘’ > ⠠ run graphql queries — 7/8 111.96 queries/second > ⠈ run graphql queries — 7/8 111.96 queries/second > ⠂ run graphql queries — 7/8 111.96 queries/second > ⠁ run graphql queries — 7/8 111.96 queries/second > ⡀ run graphql queries — 7/8 111.96 queries/second ---
**Author:** ![vikaspotluri123](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/vikaspotluri123/32/24_2.png) [@vikaspotluri123](https://forum.ghost.org/u/vikaspotluri123)\ **Post date:** [January 27, 2019, 4:10pm UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/20 "2019-01-27T16:10:44Z")
> [@superwhykz](#): > > hi @vikaspotluri123, I new to Ghost. For that **contentApiKey** do I need to add **Custom Integration** and use that key. Or there is something else? I tried to roll to Netliify and I am getting this - Yes - check out the docs: > **[gatsby-source-ghost | Gatsby](https://www.gatsbyjs.com/plugins/gatsby-source-ghost)** > > Gatsby Source Ghost Source plugin for pulling data into Gatsby.js from Ghost, using the Ghost Content API. Demo: https://gatsby.ghost.org… ---
**Author:** ![superwhykz](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/superwhykz/32/2444_2.png) [@superwhykz](https://forum.ghost.org/u/superwhykz)\ **Post date:** [January 27, 2019, 11:46pm UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/21 "2019-01-27T23:46:19Z")
Yes, I went over that doc. I am using a starter for this. From what I see it gets expanded from [https://github.com/TryGhost/gatsby-starter-ghost/blob/master/.ghost.json](https://github.com/TryGhost/gatsby-starter-ghost/blob/master/.ghost.json) which I have my own key/hostname. per **gatsby-config.js** > let ghostConfig > try { > ghostConfig = require(`./.ghost`) > } catch (e) { > ghostConfig = { > production: { > apiUrl: process.env.GHOST\_API\_URL, > contentApiKey: process.env.GHOST\_CONTENT\_API\_KEY, > }, > } > } finally { > const { apiUrl, contentApiKey } = process.env.NODE\_ENV === `development` ? ghostConfig.development : ghostConfig.production > if (!apiUrl || !contentApiKey || contentApiKey.match(//)) { > throw new Error(`GHOST_API_URL and GHOST_CONTENT_API_KEY are required to build. Check the README.`) // eslint-disable-line > } > } Per [README](https://github.com/TryGhost/gatsby-starter-ghost/blob/master/README.md) it says To use your own install, edit the `.ghost.json` config file with your credentials. You can find or your `contentApiKey` in the “Integrations” screen in Ghost Admin. However, I do not see in admin unless I generate key via custom add. That part is not clear and wanted to clarify if I am understanding it right. ![image](https://us1.discourse-cdn.com/flex015/uploads/ghost2/original/2X/0/0ac084b1f867ec35e09f2005a3e9645bbfc1bc59.png) ---
**Author:** ![vikaspotluri123](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/vikaspotluri123/32/24_2.png) [@vikaspotluri123](https://forum.ghost.org/u/vikaspotluri123)\ **Post date:** [January 27, 2019, 11:58pm UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/22 "2019-01-27T23:58:25Z")
> [@superwhykz](#): > > However, I do not see in admin unless I generate key via custom add. That part is not clear and wanted to clarify if I am understanding it right. Yep, you’re supposed to create the content API key :) ---
**Author:** ![superwhykz](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/superwhykz/32/2444_2.png) [@superwhykz](https://forum.ghost.org/u/superwhykz)\ **Post date:** [January 28, 2019, 2:10am UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/23 "2019-01-28T02:10:27Z")
@vikaspotluri123 ehh … I made it running. It seems latest on master has this issue covered. But using **gatsby cli** pulling snapshot that does not have bugfix. ---
**Author:** ![svikashk](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/svikashk/32/580_2.png) [@svikashk](https://forum.ghost.org/u/svikashk)\ **Post date:** [January 28, 2019, 12:44pm UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/24 "2019-01-28T12:44:46Z")
Hey pals! I finally managed to get a version of Gatsby + Ghost + Netlify running on my localhost. However, I noticed that every time I add a new story, it doesn’t reflect on the site. But it works fine if I stop the server and run “gatsby develop”. The logs in Netlify suggests that the site is live, but even after several (hard) refreshes, I don’t see the updated version on my localhost unless I run the command again. Anything I might be doing wrong? ---
**Author:** ![Aileen](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/aileen/32/9846_2.png) [@Aileen](https://forum.ghost.org/u/Aileen)\ **Post date:** [January 30, 2019, 5:49am UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/25 "2019-01-30T05:49:16Z")
Hey @svikashk > [@svikashk](#): > > However, I noticed that every time I add a new story, it doesn’t reflect on the site. But it works fine if I stop the server and run “gatsby develop”. Running the setup locally (for development purposes) means that you have to stop Gatsby and start it again, whenever the content in Ghost changed. This is because Gatsby will fetch everything once and build the static files and that’s it. Having the setup in production, you can create a webhook from Ghost to Netlify in order to trigger a rebuild whenever you published a new post: [https://docs.ghost.org/integrations/netlify/](https://docs.ghost.org/integrations/netlify/) ---
**Author:** ![svikashk](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/svikashk/32/580_2.png) [@svikashk](https://forum.ghost.org/u/svikashk)\ **Post date:** [January 30, 2019, 6:16am UTC](https://forum.ghost.org/t/getting-started-with-gatsby/4948/26 "2019-01-30T06:16:56Z")
Gotcha, @Aileen. Thanks a bunch for helping with this. 🙂 [Next page](https://forum.ghost.org/t/getting-started-with-gatsby/4948.md?page=2)