Gatsby + API Platform

🚀 Quick start

1. Create a Gatsby site.

   Use the Gatsby CLI (install instructions) to create a new site, specifying the hello-world starter.

   # create a new Gatsby site using the hello-world starter
   gatsby new my-app https://github.com/Enrico724/gatsby-api-platform-starter

2. Start developing.

   Before starting, open the /api-platform/public/api/index.php, and rewrite the autoloder into require_once dirname(__DIR__).'/../vendor/autoload_runtime.php';

   You have to set up your dev enviroment in order to accept CORS request, so you should add the following code to your api-platform/.env file

   ### Allow cors requests for development
   CORS_ALLOW_ORIGIN='^https?://(localhost|127\.0\.0\.1)(:[0-9]+)?$'
   

   Navigate into your new site’s directory and start it up.

   cd my-app/
   npm run develop

   NOTICE: insted of running gatsby <command>, use the available script defined in package.json. All Gatsby commands are rewritten in order to fully function with tha API-Platfom framework.

3. Open the source code and start editing!

   Gatsby is now running at http://localhost:8000!

   Symfony is now running at http://localhost:4000!

   The source code is under the src Directory

4. Using GraphQL?

   Install the composer dependencies inside api-platform, following the API-Plstform docs.

   Set up the Gatsby-plugin-apollo, and set up the client using the following function to retrive the correct api-endpoint. The following implementation is an graphql-example:

   const apiEntryPoint = () => {
       const env = process.env.NODE_ENV
       if (isBrowser && env === 'production')
           return `/api/graphql`;
       return `http://localhost:4000/api/graphql`;
   }
   

🧐 What's inside?

A quick look at the top-level files and directories you'll see in a Gatsby project.

.
├── api-platform
├── node_modules
├── public
├── src
├── .gitignore
├── .prettierrc
├── gatsby-config.js
├── LICENSE
├── package-lock.json
├── package.json
└── README.md

🛠 Build

This starter has been built in order to port your app in any enviroment using less devops possible. Once you have run npm run build, your app will be available inside build directory. public will be places as your public_html folder, and my-app folder will we placed in the root folder.

The only manual operation you have to do is opening the '/build/public/api/index.php' and edit the require file in order to it links you app souce code. This has to be done in order to make api-platform working.

🎓 Learning Gatsby

Looking for more guidance? Full documentation for Gatsby lives on the website. Here are some places to start:

• For most developers, we recommend starting with our in-depth tutorial for creating a site with Gatsby. It starts with zero assumptions about your level of ability and walks through every step of the process.

• To dive straight into code samples, head to our documentation. In particular, check out the Guides, API Reference, and Advanced Tutorials sections in the sidebar.