Publish: Step-by-step first install



  • Publish is the content management component of the DADI web services stack, a set of flexible interfaces to easily manage content stored in API. This post gives an overview of setting it up and connecting to a DADI API instance.

    We should note that many of the core web services in the DADI platform can be installed very simply using the DADI CLI tool. Publish is still in a public beta phase and doesn't yet benefit from CLI's simplified install process.

    Setup and build

    1. We need to start by adding a directory for the Publish files. If you already have one, change into that directory first.

      $ mkdir ~/projects/publish-cms
      $ cd ~/projects/publish-cms
      
    2. Add a package.json file to this directory, to list our dependencies. Add a new file to your directory with the following contents:

      ~/projects/publish-cms/package.json

      {
        "name": "publish-cms",
        "version": "1.0.0",
        "main": "index.js",
        "dependencies": {
          "@dadi/publish": "1.0.3-beta"
        }
      }
      
    3. Add a file called server.js, which we'll use for launching the application:

      ~/projects/publish-cms/server.js

      const app = require('@dadi/publish')
      app.run()
      
    4. Install the Publish dependency. Our package.json contains a reference to the @dadi/publish dependency, so let's now pull that into the project:

      $ npm install
      

    During the installation process you'll see some deprecation warnings - these are nothing to worry about at this stage.

    When installation completes, you're ready to start the application.

    1. You can now run npm start to launch the application. Publish runs on port 3001 by default - you should be able to navigate to http://localhost:3001 in your browser where you'll see Publish running. The first thing you'll notice is the warning "API failure" - we haven't configured the connection with API yet, so this is expected.

    Connecting to API

    Now that the application is installed, we're going to configure it to connect to an instance of DADI API.

    If you have your own instance of API running, use that in the below configuration of Publish. If you don't have an API running yet, head to the API documentation for more information, or check out the Adam K Dean's article on setting up a photo gallery website where he briefly explains API installation. In a future article, we'll be covering "Installing API with CLI and setting up collections".

    1. Create a config directory in your Publish directory to contain the configuration files for the application:

    2. Inside the new config directory create a configuration file for the development environment called config.development.json. Add the following:

      ~/projects/publish-cms/config/config.development.json

      {
        "app": {
          "name": "DADI Publish",
          "publisher": "My Publishing Company"
        },
        "server": {
          "host": "0.0.0.0",
          "port": 3001,
        },
        "apis": [
          {
            "name": "Test API",
            "host": "http://localhost",
            "port": 3002,
            "database": "api",
            "version": "1.0",
            "credentials": {
              "clientId" : "your-client-id",
              "secret" : "your-secret"
            }
          }
        ],
        "auth": {
          "enabled": false
        }
      }
      
    3. You can now run npm start again. You should see a number of collections listed in the menu, which should look something like this:

    0_1512488142471_Screen Shot on 2017-12-04 at 11%3A05%3A41.png

    Overriding Publish defaults

    By default all collections and collection fields from your API are visible and editable within Publish. To hide collections and/or fields within collections, see below.

    Extending API fields

    API collection schemas allow custom properties that can be read by Publish to modify the editing interface.

    Add a publish configuration block to each field in your API collection schemas to control how they appear in Publish:

    {
      "fields": {
        "field1": {
          "type": "String",
          "required": true,
          "label": "Title",
          "publish": {
            "display": {
              "edit": true, // field will appear in the edit view
              "list": false // field will not appear in the index view
            }
          }
        }
      }
    }
    

    Hiding an entire collection

    Hide a collection by adding hidden to the collection settings block:

    {
      "fields": {
        "field1": {
          
        },
        "field2": {
          
        },
      },
      "settings": {
        "publish": {
          "hidden": true
        }
      }
    }
    

    Next steps

    This post has only just scratched the surface of what is possible with DADI Publish. In a future article, we'll go into more detail about setting up authentication for Publish so you can control access to your content management system.

    If you want to know more about how Publish can elevate the potential of your editorial team, ask me here, on Discord or tweet @dadi.


Log in to reply
 

Looks like your connection to DADI Forum was lost, please wait while we try to reconnect.