К содержанию
Medusa
Документация

Установка

Фреймворк Medusa поставляется как компактное решение для небольших и средних проектов. В этом разделе показан минимальный путь от пустого проекта до первого рабочего маршрута.

Создание файла .env

В корне проекта уже находится файл .env.example. Скопируйте его в .env и при необходимости скорректируйте базовые параметры приложения: 

ENV_FILE = ./.env

APP_URL = http://localhost:8001
APP_SET_UTC_TIME_ZONE = true

BOOTSTRAP_PDO_AUTOCONNECT = true
PDO_TYPE = mysql
PDO_PORT = 3306
PDO_NAME = app
PDO_CHARSET = utf8mb4
PDO_USER = medusa
PDO_PASSWORD = medusa

DB_WAIT_TIMEOUT = 300
DB_SET_UTC_TIME_ZONE = true

FROM_MAIL = app@mail.ru
REPLY_TO_MAIL = noreply@mail.ru

STORAGE_ROOT_PATH = /storage
STORAGE_DIR_PERMISSIONS = 0755
STORAGE_FILE_PERMISSIONS = 0644

BOOTSTRAP_REDIS_AUTOCONNECT = true
REDIS_SCHEME = tcp
REDIS_PORT = 6379

BOOTSTRAP_RMQ_AUTOCONNECT = true
RMQ_PORT = 5672
RMQ_USER = guest
RMQ_PASS = guest

Настройка msmtp

Если приложению нужна отправка почты, заполните файл .docker/etc/msmtprc данными вашего SMTP-сервера: 

account default

auth on

tls on
tls_starttls off
tls_certcheck off

host mail.medusa.ru
port 465
user app@mail.ru
password qwerty123456

logfile /var/log/msmtp.log

Подготовка дампа базы данных

Если проекту нужен стартовый набор таблиц или тестовых данных, добавьте SQL-запросы в файл .data/dump.sql. Они будут автоматически выполнены при первом запуске контейнера базы данных.

Добавление тестового маршрута

Откройте файл www/routes/web.php и добавьте в него минимальный маршрут с Twig-шаблоном и Vite-entry:

use Medusa\Http\Route;
use Medusa\Http\Request;
use Medusa\Http\Response;
use Medusa\Helpers\Frontend;

Route::get('/greeting', function (Request $request) {
  return new Response\Html(
    Frontend::twig('themes')
      ->include('default', [
        'html' => [
          'lang' => 'ru',
        ],
        'head' => [
          'title' => 'Приветствие',
        ],
      ])
      ->with(
        Frontend::vite('themes')->include('default', [
          'title' => 'Добро пожаловать!',
          'subTitle' => 'Это страница приветствия!',
        ])
      )
      ->html(true),
    200, false
  );
});

Создайте файл www/frontend/themes/default/index.html.twig: 

<!doctype html>
<html lang="{{ html.lang | default('en') }}">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>{{ head.title | default('Page') }}</title>

  {{ head.preload | join('\n\t') | raw }}

  {{ head.styles | join('\n\t') | raw }}
</head>
<body>
  {{ body.content | join('\n\t') | raw }}

  {{ body.scripts | join('\n\t') | raw }}

  {{ body.state | join('\n\t') | raw }}
</body>
</html>

Создайте файл www/frontend/themes/default/entry.js: 

import {mount} from '@shared/js/mount';
import {state} from '@shared/js/state';

import {createApp} from 'vue';
import DefaultTheme from './DefaultTheme.vue';
import './style.css';

mount('default')
   .state(state)
   .each((node, props) => {
      createApp(DefaultTheme, props).mount(node);
   });

Создайте файл www/frontend/themes/default/DefaultTheme.vue: 

<script setup>
import {defaultThemeProps} from './props.js';

defineProps(defaultThemeProps);
</script>

<template>
 <h1>{{ title }}</h1>
 <p>{{ subTitle }}</p>
</template>

Создайте файл www/frontend/themes/default/props.js: 

export const defaultThemeProps = {
  title: {
    type: String,
    required: true,
  },
  subTitle: {
    type: String,
    required: true,
  },
};

Создайте файл www/frontend/themes/default/style.css: 

h1 {
   color: blue;
}

p {
   color: green;
}

Сборка и запуск контейнеров

Выполните команду в терминале:

docker compose up -d --build

Вход в контейнер

Если зависимости или frontend-сборку нужно обновить вручную, сначала войдите в web-контейнер: 

docker exec -it <имя_контейнера> /bin/bash

Установка Composer-зависимостей

Для установки PHP-пакетов выполните команду внутри контейнера:

composer install --no-dev --optimize-autoloader

Установка npm-зависимостей

Для установки npm-пакетов выполните команду внутри контейнера:

npm install

Сборка frontend-части

После установки npm-зависимостей выполните сборку frontend-части:

npm run build

Проверка результата

Откройте в браузере адрес http://localhost:8001/greeting/.

Если всё настроено корректно, вы увидите:

Добро пожаловать!

Это страница приветствия!

Medusa — документация для разработчиков.