create-directus-docker 1.0.6

package/README.md

@@ -0,0 +1,86 @@
+## Docker with Directus / MySQL / Adminer / GraphQL
+
+This package contains everything you need to get up and running with Directus CMS with a MySQL backend, plus an interactive GraphQL playground to help you develop your API queries.
+
+**Before you do anything else**, you need [Docker](https://www.docker.com) and [Node](https://nodejs.org) installed on your machine:
+
+- [Install Docker Desktop](https://www.docker.com/products/docker-desktop/)  
+- [Install Node](https://nodejs.org/en/download/)
+
+Once you've installed Node and Docker, and have Docker Desktop running on your machine, you can install and configure this package by following these steps:
+
+1. Open a terminal session:  
+    **Mac:** Go to /Applications/Utilities then double-click Terminal.  
+    **Windows:** Click 'Start' taskbar button, Select 'All apps', scroll down and select 'Terminal'
+2. CD into the parent directory where you'd like to install this, ie `cd '~/Documents/My-Folder'`.
+3. From there, run:  
+    `git clone https://github.com/rollmug/directus-mysql-template.git`  
+    OR, if you don't have git installed, [manually download it here](https://github.com/rollmug/directus-mysql-template/archive/refs/heads/main.zip) and unzip it.
+4. Navigate into the folder you just downloaded, ie `cd 'directus-mysql-template'`
+
+**Configure your Directus/MySQL setup:**
+
+1. Within the directus-mysql-template directory, run `npm install`
+2. Lastly, run `npm start`. The wizard will walk you through the config, and automatically launch all containers for you.
+
+*Note that you'll only have to do these two steps the first time you run this.*
+
+### Starting/stopping with Docker Compose
+
+To **stop** your running containers, simply run `docker compose down` in your terminal from within the project directory. All containers will be stopped.
+
+To **restart** your stopped containers, you can let the helper app do it for you:
+
+`npm start`
+
+Or you can follow this sequence:
+
+`docker compose up mysql -d`
+
+Then wait 10-20 seconds (for MySQL to boot), then type:
+
+`docker compose up -d`
+
+**Boom!** You're done. Now you can access the URLS from here:
+
+Directus CMS: http://localhost:8055  
+GraphQL Playground: http://localhost:4000/graphql  
+Adminer (for MySQL): http://localhost:8080
+
+**Check on running containers:**
+
+Simply run `docker compose ps` to see the status of running containers. Or, run `docker compose ps -a` to see all containers, running or not.
+
+## CORS problems on localhost
+
+When using the GraphiQL playground on localhost, you'll run into some browser problems related to CORS. Here's how to get around it:
+
+**Safari:**
+
+1. Enable the developer menu by opening up Settings > Advanced, then check "Show Develop bar in menu"
+2. Click the Develop menu and check "Disable Cross-Origin Restrictions"
+
+**Chrome**
+
+Temporarily Disable CORS in Chrome (MacOS):
+
+1. Quit Chrome
+2. Open terminal and run:
+
+`open -n -a "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" --args --user-data-dir="/tmp/chrome_dev_test" --disable-web-security`
+
+**Windows:**
+
+1. Right click on desktop, add new shortcut
+2. Add the target as "[PATH_TO_CHROME]\chrome.exe" --disable-web-security --disable-gpu --user-data-dir=~/chromeTemp
+3. Click OK
+
+**Firefox:**
+
+For Firefox you can simply install [CORS Everywhere](https://addons.mozilla.org/en-US/firefox/addon/cors-everywhere/) addon.
+
+### Examples of getting an auth token for API:
+
+curl -X POST localhost:8055/auth/login -H 'Content-Type: application/json' -d '{"email":"you@email.com","password":"your-password"}'
+
+curl -X POST localhost:8055/auth/refresh -H 'Content-Type: application/json' -d '{"refresh_token": "W5L70MBXKElx5ZVZwxmQVG8qdVjukiRVIwD5FYG7tCPyyuCM_I3IyCsYnFhMUrRi", "mode": "json"}'

package/docker-compose.yml

@@ -0,0 +1,93 @@
+version: '3'
+
+services:
+
+  mysql:
+    container_name: mysql
+    image: mysql:8
+    restart: always
+    healthcheck: 
+      test: ['mysqladmin', 'ping', '--silent']
+      interval: 5s
+      timeout: 20s
+      retries: 3
+      start_period: 5s
+    networks: 
+      - directus
+    ports:
+      - 3306:3306
+    volumes:
+      - ./mysql:/var/lib/mysql
+    command: --default-authentication-plugin=mysql_native_password
+    environment:
+      MYSQL_USER: ${MYSQL_USER}
+      MYSQL_PASSWORD: ${MYSQL_PASS}
+      MYSQL_DATABASE: ${MYSQL_DB}
+      MYSQL_ROOT_PASSWORD: ${MYSQL_ROOT_PASS}
+
+  adminer:
+    container_name: adminer
+    image: adminer:latest
+    restart: always
+    depends_on:
+      - mysql
+    networks: 
+      - directus
+    environment:
+      ADMINER_DEFAULT_SERVER: mysql
+    ports:
+      - 8080:8080
+
+  cache:
+    container_name: cache
+    image: redis:6
+    networks:
+      - directus
+
+  directus:
+    container_name: directus
+    image: directus/directus:latest
+    ports:
+      - 8055:8055
+    volumes:
+      - ./directus/uploads:/directus/uploads
+    networks:
+      - directus
+    depends_on:
+      - cache
+      - mysql
+    environment:
+      KEY: '255d861b-5ea1-5996-9aa3-922530ec40b1'
+      SECRET: '6116487b-cda1-52c2-b5b5-c8022c45e263'
+      DB_CLIENT: 'mysql'
+      DB_HOST: 'mysql'
+      DB_USER: ${MYSQL_USER}
+      DB_PASSWORD: ${MYSQL_PASS}
+      DB_DATABASE: ${MYSQL_DB}
+      DB_PORT: '3306'
+
+      CACHE_ENABLED: 'true'
+      CACHE_STORE: 'redis'
+      CACHE_REDIS: 'redis://cache:6379'
+      ADMIN_EMAIL: ${ADMIN_EMAIL}
+      ADMIN_PASSWORD: ${ADMIN_PASSWORD}
+      CORS_ENABLED: 'true'
+      CORS_ORIGIN: '*'
+
+      PUBLIC_URL: ${PUBLIC_URL}
+
+  graphiql:
+    container_name: graphiql
+    image: plutoz/graphiql
+    depends_on:
+      - directus
+    ports:
+      - 4000:4000
+    environment:
+      API_ENDPOINT: ${API_ENDPOINT}
+    networks:
+      - directus
+
+networks:
+  directus:
+    driver: bridge

package/lib/check-requirements.js

@@ -0,0 +1,13 @@
+import chalk from 'chalk';
+
+export default function checkRequirements() {
+	const nodeVersion = process.versions.node;
+	const major = +nodeVersion.split('.')[0];
+
+	if (major < 12) {
+		console.error(`You are running ${chalk.red(`Node ${nodeVersion}`)}.`);
+		console.error(`Directus requires ${chalk.green(`Node 12`)} and up.`);
+		console.error('Please update your Node version and try again.');
+		process.exit(1);
+	}
+};

package/lib/index.js

@@ -0,0 +1,136 @@
+#!/usr/bin/env node
+
+import inquirer from 'inquirer';
+import chalk from 'chalk';
+import path from 'path';
+import generator from 'generate-password';
+import * as fs from 'fs';
+import * as dotenv from 'dotenv';
+dotenv.config();
+
+import checkRequirements from './check-requirements.js';
+import launchServices from './launch-services.js';
+
+const rootPath = path.resolve();
+const envPath = './.env';
+
+try {
+    console.log(chalk.magentaBright("Configure Directus with MySQL, Adminer, and a GraphQL playground"));
+    console.log(chalk.dim("---------------------------------------------\n"));
+
+    checkRequirements();
+
+    if (fs.existsSync(envPath) && process.env.ADMIN_EMAIL !== null && process.env.ADMIN_PASSWORD !== null) {
+        console.log(chalk.green("Looks like we're already configured, so let's get things up and running."));
+        console.log("ps - you can always edit the variables that we've just set in the .env file manually.\n\nAutomatically running docker compose:\n");
+        launchServices();
+    } else {
+        //let's do the configuring!
+        console.log("Follow the prompts to configure Directus and MySQL.\n");
+
+        if (fs.existsSync(path.join(rootPath, 'mysql')) === false) {
+            fs.mkdir(path.join(rootPath, 'mysql'), () => {
+                //console.log(`'mysql' directory created.`);
+            });
+        }
+
+        if (fs.existsSync(path.join(rootPath, 'directus')) === false) {
+            fs.mkdir(path.join(rootPath, 'directus'), () => {
+                fs.mkdir(path.join(rootPath, 'directus/uploads'), () => {
+                    //console.log(`'directus' directory created.`);
+                });
+            });
+        }
+
+        inquirer.prompt([
+            {
+                name: 'ADMIN_EMAIL',
+                message: "Type your email then hit return:",
+                validate: (email) => {
+                    let valid = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(email)
+
+                    if (valid) {
+                        return true;
+                    } else {
+                        console.log(chalk.red("\nPlease enter a valid email."))
+                        return false;
+                    }
+                }
+            },
+            {
+                name: 'ADMIN_PASSWORD',
+                message: 'Type a password to login with, or hit return to use suggested:',
+                default: generator.generate({ length: 14, numbers: true, symbols: false }),
+                validate: (password) => {
+                    if (password === null || password === false || password == '' || password.length < 8) {
+                        console.log(chalk.red("\nPassword cannot be empty, and must have at least 8 characters."))
+                    } else {
+                        return true;
+                    }
+                }
+            },
+            {
+                name: 'MYSQL_USER',
+                message: "Specify a user name for your MySQL database:",
+                default: 'admin'
+            },
+            {
+                name: 'MYSQL_PASS',
+                message: "MySQL Password:",
+                default: generator.generate({ length: 14, numbers: true, symbols: false }),
+            },
+            {
+                name: 'MYSQL_DB',
+                message: "Give your database a name:",
+                default: 'directus'
+            },
+            {
+                name: 'MYSQL_ROOT_PASS',
+                message: "Root password:",
+                default: generator.generate({ length: 14, numbers: true, symbols: false })
+            }
+        ]).then(answers => {
+            console.log(chalk.magentaBright("\nWriting to environment file. Be sure to take note of your credentials below, you'll need them shortly!\n"));
+            console.log(answers);
+
+            var writeStream = fs.createWriteStream(envPath);
+            writeStream.write("# Environment variables\n\n# Email and password to login to Directus:\n");
+            writeStream.write(`ADMIN_EMAIL="${answers.ADMIN_EMAIL}"`);
+            writeStream.write("\n");
+            writeStream.write(`ADMIN_PASSWORD="${answers.ADMIN_PASSWORD}"`);
+            writeStream.write("\n");
+
+            writeStream.write("\n");
+            writeStream.write("# Define the mysql user name and password:\n");
+
+            writeStream.write(`MYSQL_USER="${answers.MYSQL_USER}"`);
+            writeStream.write("\n");
+            writeStream.write(`MYSQL_PASS="${answers.MYSQL_PASS}"`);
+            writeStream.write("\n");
+
+            writeStream.write("\n");
+            writeStream.write("# Give your database a name:\n");
+            writeStream.write(`MYSQL_DB="${answers.MYSQL_DB}"`);
+            writeStream.write("\n");
+
+            writeStream.write("\n");
+            writeStream.write("# Set a root password for MySQL to something secure:\n");
+            writeStream.write(`MYSQL_ROOT_PASS="${answers.MYSQL_ROOT_PASS}"`);
+            writeStream.write("\n\n");
+
+            writeStream.write("# Set the domain for directus to use:\n");
+            writeStream.write("# eg, https://mydomain.com\n");
+            writeStream.write("# in local dev environments, just leave it set to localhost:port\n");
+            writeStream.write("PUBLIC_URL=\"http://localhost:8055\"\n");
+            writeStream.write("API_ENDPOINT=\"http://localhost:8055/graphql\"");
+
+            writeStream.end();
+
+            console.log(chalk.greenBright("\nAll set!"));
+            console.log("You can always edit the variables that we've just set in the .env file manually.\n");
+            console.log(`${chalk.greenBright("To launch all services, just run 'npm start' again.")}\n`);
+        })
+    }
+} catch (err) {
+    console.error(err)
+}

package/lib/launch-services.js

@@ -0,0 +1,71 @@
+import chalk from 'chalk';
+import ora from 'ora';
+import waitOn from 'wait-on';
+import { spawn } from 'node:child_process';
+import logUpdate from 'log-update';
+
+export default function launchServices() {
+    const launch = spawn('docker', ['compose', 'up', 'mysql', '-d']);
+
+    const opts = {
+        resources: [
+            'tcp:127.0.0.1:3306'
+        ],
+        delay: 1000,
+        interval: 100,
+        timeout: 30000,
+        tcpTimeout: 30000
+    }
+
+    launch.stderr.on('data', (data) => {
+        logUpdate(`${data}`);
+    });
+
+    launch.on('close', code => {
+        logUpdate.done();
+        console.log(`Docker has launched MySQL service (status = ${code}).`);
+
+        const loader = ora('Waiting for MySQL to be ready').start();
+
+        waitOn(opts, (err) => {
+            if (err) console.log(err);
+            // once here, all resources are available
+
+            const sleeper = spawn('sleep', [5]);
+
+            sleeper.on('close', code => {
+                loader.stop();
+                console.log('MySQL ready.');
+
+                logUpdate("Building and launching containers:\n");
+                logUpdate.done();
+
+                const launch2 = spawn('docker', ['compose', 'up', '-d']);
+
+                launch2.stderr.on('data', (data) => {
+                    logUpdate(`${data}`);
+                });
+
+                launch2.on('close', code => {
+                    logUpdate('Done.');
+                    logUpdate.done();
+
+                    console.log(chalk.green("\nAll services should be ready. You can access them at the following URLs:\n"));
+
+                    console.log(`Directus CMS: ${chalk.cyan("http://localhost:8055")}`);
+                    console.log(`Adminer: ${chalk.cyan("http://localhost:8080")}`);
+                    console.log(`GraphiQL Playground: ${chalk.cyan("http://localhost:4000/graphql")}`);
+
+                    console.log(`\n${chalk.redBright("Note: learn how to avoid CORS errors in the GraphiQL Playground when running on localhost:")}`);
+                    console.log(`https://github.com/rollmug/directus-mysql-template#cors-problems-on-localhost`)
+
+                    console.log(`\n${chalk.green("Done! When you're finished, you can stop all running containers with:")}\n`);
+                    console.log(`docker compose down\n`);
+                    console.log(`${chalk.green("You can start them all back up again with:")}`);
+                    console.log(`npm start\n`);
+                });
+            });
+
+        });
+    });
+}

package/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "create-directus-docker",
+  "version": "1.0.6",
+  "description": "A helper app to configure Directus on Docker with MySQL, Adminer, and GraphQL",
+  "main": "./lib/index.js",
+  "type": "module",
+  "scripts": {
+    "start": "node ./lib/index.js",
+    "launch": "node ./lib/index.js",
+    "test": "echo \"No test specified\""
+  },
+  "bin": {
+    "create-directus-docker": "./lib/index.js",
+    "cdd": "./lib/index.js"
+  },
+  "keywords": [
+    "directus",
+    "docker",
+    "mysql",
+    "installer"
+  ],
+  "exports": {
+    ".": "./lib/index.js",
+    "./package.json": "./package.json"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/rollmug/directus-mysql-template.git"
+  },
+  "author": {
+    "name": "Dave Kobrenski",
+    "email": "dave@rlmg.com"
+  },
+  "license": "GPL-3.0-only",
+  "bugs": {
+    "url": "https://github.com/rollmug/directus-mysql-template/issues"
+  },
+  "homepage": "https://github.com/rollmug/directus-mysql-template#readme",
+  "dependencies": {
+    "chalk": "^5.2.0",
+    "dotenv": "^16.0.3",
+    "generate-password": "^1.7.0",
+    "inquirer": "^9.1.4",
+    "log-update": "^5.0.1",
+    "ora": "^6.1.2",
+    "wait-on": "^7.0.1"
+  }
+}