Frontend, Редактор Панель и API Theindex.
Самый простой способ - начать работу, используя Docker Compose. Вам нужно скопировать файл docker-compose.yml и example.env из github. Переименовать example.env to .env и отрегулировать переменные среды, как вам нужно. со следующей командой:
docker-compose up -d Вам нужно будет изменить <host-port> на выбор по вашему порту. Веб-сервер не защищен через SSL/TLS, он обязан поместить обратный прокси перед этим контейнером. Когда вы запускаете изображение в первый раз, не забудьте установить свой собственный ID Discord в ENV SETUP_WHITELIST_DISCORD_ID чтобы иметь возможность войти в систему и редактировать. После того, как ваш контейнер настроится один раз, вы можете удалить переменную ENV из вашей настройки.
Мы используем MongoDB в качестве нашего сервера баз данных. Вы можете развернуть свою собственную настройку Mongo в качестве сервиса HA или просто простой контейнер для одиночного Docker через EG:
ПРИМЕЧАНИЕ. База данных начнется пустой, вы должны заполнить данные самостоятельно.
docker run -d
--name mongo
-v ./db:/data/db
mongoДля целей разработки или тестирования настоятельно рекомендуется использовать монго-экспресс для доступа, просмотра и редактирования текущего состояния базы данных. Если вы сделаете его общедоступным, не забудьте обеспечить его с помощью учетных данных для входа .
Чтобы просто развернуть контейнер для докеров монгона, запустите:
docker run -d
--name mongo-express
-p 8081:8081
mongo-express Вы также можете взглянуть на наш предоставленный файл docker-compose о том, как его настроить.
Чтобы повысить производительность, мы используем REDIS для кэша результатов MongoDB. Кэш автопопулируется на пропусканиях кеша.
Вы можете создать новый экземпляр с Docker, работая:
docker run -d
--name redis
redis Redis DB уже включен в пример docker-compose File
ПРЕДУПРЕЖДЕНИЕ: Имейте в виду, что мы не предлагаем никакой официальной поддержки, и каждое обновление может быть с нарушениями изменений. Обязательно сделайте резервные копии перед обновлением
Чтобы получить новейшую версию изображения контейнера, вам нужно будет запустить:
docker pull ghcr.io/snaacky/theindex:latestПосле этого вам нужно будет остановить и удалить свой текущий экземпляр работы и запустить его снова.
Вот коллекция возможных переменных среды со значениями по умолчанию, которые вы должны установить в своем файле .env :
| Параметр | Функция | По умолчанию |
|---|---|---|
NEXT_PUBLIC_SITE_NAME | Название вашего сайта | "The Index" |
NEXT_PUBLIC_DOMAIN | Ваш домен или IP, удалите сцепку | "https://theindex.moe" |
DATABASE_URL | Взгляните на документы MongoDB | "mongodb://mongo:27017/index" |
CACHE_URL | Строка подключения для базы данных Redis Cache | "redis://redis:6379" |
CHROME_URL | URL -адрес webSocket -incest hrome | "ws://chrome:3300" |
AUDIT_WEBHOOK | Webhook-Url для аудита-лога, оставьте пустым, чтобы отключить поддержку | "" |
AUTH_DISCORD_ID | Discord OAuth2 идентификатор клиента | "your_discord_oauth_client_id" |
AUTH_DISCORD_SECRET | Discord OAuth2 Client Secret | "your_discord_oauth_client_secret" |
DISCORD_BOT_TOKEN | Необходимо получить доступ к ресурсам бота | "your_discord_bot_token" |
SETUP_WHITELIST_DISCORD_ID | Если вам нужна помощь в получении вашего идентификатора, проверьте это руководство | "your_discord_id" |
И следующие переменные ENV необходимы только тогда, когда вы находитесь в режиме DEV и отладки БД
| Параметр | Функция | По умолчанию |
|---|---|---|
ME_CONFIG_BASICAUTH_USERNAME | Монго-экспресс-имя пользователя | "Админ" |
ME_CONFIG_BASICAUTH_PASSWORD | Монго-экспресс-пароль | "Super_Secret" |
Если вы хотите проверить, как файл Docker-Compose заполняет Envs, используйте docker-compose config
Начало работы не так просто. Вам нужно будет установить последнюю версию Docker с Docker-Compose на вашей машине.
Начните с клонирования репо через графический клиент GIT (настоятельно рекомендуется) или используйте CLI через
git clone https://github.com/snaacky/theindexexample.env в .env .NEXT_PUBLIC_DOMAIN и NEXTAUTH_URL с http://localhost:3000NEXTAUTH_SECRET . Вы можете использовать генераторы, например, 1Password или создать его самостоятельно.DATABASE_URL , CACHE_URL и CHROME_URL чтобы использовать Localhost вместо mongo , redis и chrome например: mongodb://mongo:27017 -> становится mongodb://localhost:27017https://discord.com/developers -> Создайте новое приложение -> Перейдите в Auth2 внутри панели вашего приложения -> Скопируйте CLIENT ID и CLIENT SECRET в файл .env .Redirects в Auth2 Скопируйте и вставьте следующий URL -адрес, необходимый для проверки вашего входа в систему Discord http://localhost:3000/api/auth/callback/discord .SETUP_WHITELIST_DISCORD_ID с вашим идентификатором Discord, чтобы иметь учетную запись администратора при входе в систему.MEILI_MASTER_KEY . Вы можете использовать генераторы, например, 1Password или создать его самостоятельно.docker-compose :| услуга | картирование порта |
|---|---|
mongo | 27017:27017 |
redis | 6379:6379 |
meili | 7700:7700 |
chrome | 3300:3000 |
В качестве примера, настройка для mongo должна выглядеть похоже на это:
mongo :
image : mongo
container_name : index-db
restart : unless-stopped
ports :
- ' 27017:27017 '
volumes :
- ./db:/data/dbdocker-compose up -d mongo redis meili chrome mongo-expressВ качестве альтернативы вы также можете просто прокомментировать или удалить службу индекса и запустить команду
docker-compose up -dЧтобы начать кодирование на Frontend, вам нужно убедиться, что у вас есть последняя версия Node.js правильно установлена. Чтобы установить все необходимые зависимости, запускаясь один раз:
bun installПримечание: мы решили придерживаться NPM вместо пряжи для управления зависимостями.
Теперь у вас должна быть папка, называемая node_modules , которая содержит все необходимые нам зависимости. Мы используем Next.js в качестве структуры для нашего веб -службы React. Чтобы проверить веб -службу, вам придется запустить сервер DB в фоновом режиме и запустить фронт через:
bun run devПосле компиляции вы можете открыть http: // localhost: 3000 в выбранном браузере и увидеть работает веб -приложение.
Поскольку мы используем Next.js, Frontend поддерживает горячую перезагрузку, поэтому вы можете просто оставить страницу открытой, в то время как вы изменяете код и видите изменения в лету в вашем браузере.
Чтобы создать готовое изображение Docker, просто запустите:
docker build . -t index Теперь у вас есть локальное изображение с index тегов, которое содержит распределяемую версию кода, которую теперь можно запустить.
Мы используем краситель, чтобы обеспечить согласованный стиль кода для всех участников. Вы можете просто автоматически в формате все с помощью, например, запуска команды
bunx prettier --write . Там, где это возможно, мы используем ISR для предварительного генерации всех общедоступных страниц для кэширования CDN или прокси при проверке и получении новых данных с SWR, запрашивая наш собственный API.
Мы обслуживаем каждый запрос API по конечной точке /api , соответствующий код можно просматривать на страницах /API.
/api/auth зарезервировано для NextAuth.js./api/edit/... требует зарегистрированного пользователя и, как правило, (по крайней мере) права редактора и для изменения или создания нового контента. Ключевое слово _id _new зарезервировано для создания нового контента./api/delete/... требует зарегистрированного пользователя и обычно (по крайней мере) права редактора и для удаления контента./api/[content]s являются общедоступными конечными точками для получения списка всех элементов определенного контента./api/[content]/... это общедоступные конечные точки для получения информации о конкретном контенте. Сначала каждый запрос страницы должен пройти через _app.ts, где применяется базовый макет и, если страница имеет свойство auth , она также подтверждает, может ли пользователь получить доступ к данной странице. Действительные атрибуты авторов:
auth является null или typeof auth === "undefined" , никаких ограничений. Кажется, это публичная страница.requireLogin , не нужно, но установите его по логическим причинам. Пользователь должен быть вошел в систему.requireAdmin , что только пользователь с правами администратора может получить доступ к этой странице.requireEditor , только редакторы могут просмотреть эту страницу. Занятия притяжения всегда приветствуются, но не всегда могут быть объединены, так как это должно быть в соответствии с нашим представлением об индексе. Если вам нужна определенная функция или у вас есть идея, вы всегда можете открыть запрос на функции в выпуске или сообщить о нашем Discord в #index для обсуждения. Если это неплохо, в соответствии с нашими идеями, и мы найдем некоторое время, мы обязательно реализуем вашу запрошенную функцию (когда -нибудь ...).
И самое главное:
Помощь нашего удивительного сообщества: 3
Editor -viewsfunc(_id, dataObject) и обновить только по мере необходимости, GraphQL было бы неплохо ...add , remove API вместо того, чтобы отправлять целые массивы для обновления списков -> graphql?