Getting Started

Installation

If you use the API Platform Distribution, API Platform Admin is already installed, you can skip this installation guide.

Otherwise, all you need to install API Platform Admin is a JavaScript package manager. We recommend Yarn (npm is also supported).

If you don't have an existing React Application, create one using Create React App:

$ yarn create react-app my-admin

Go to the directory of your project:

$ cd my-admin

Finally, install the @api-platform/admin library:

$ yarn add @api-platform/admin

Creating the Admin

To initialize API Platform Admin, register it in your application. For instance, if you used Create React App, replace the content of src/App.js by:

import React from "react";
import { HydraAdmin } from "@api-platform/admin";

// Replace with your own API entrypoint
// For instance if https://example.com/api/books is the path to the collection of book resources, then the entrypoint is https://example.com/api
export default () => (
  <HydraAdmin entrypoint="https://demo.api-platform.com"></HydraAdmin>
);

Be sure to make your API send proper CORS HTTP headers to allow the admin's domain to access it.

To do so, if you use the API Platform Distribution, update the value of the CORS_ALLOW_ORIGIN parameter in api/.env (it will be set to ^https?://localhost:?[0-9]*$ by default).

If you use a custom installation of Symfony and API Platform Core, you will need to adjust the NelmioCorsBundle configuration to expose the Link HTTP header and to send proper CORS headers on the route under which the API will be served (/api by default). Here is a sample configuration:

# config/packages/nelmio_cors.yaml

nelmio_cors:
    paths:
        '^/api/':
            origin_regex: true
            allow_origin: ['^http://localhost:[0-9]+'] # You probably want to change this regex to match your real domain
            allow_methods: ['GET', 'OPTIONS', 'POST', 'PUT', 'PATCH', 'DELETE']
            allow_headers: ['Content-Type', 'Authorization']
            expose_headers: ['Link']
            max_age: 3600

Clear the cache to apply this change:

$ docker-compose exec php bin/console cache:clear --env=prod

Your new administration interface is ready! Type yarn start to try it!

Note: if you don't want to hardcode the API URL, you can use an environment variable.