mirror of
https://github.com/evroon/bracket.git
synced 2026-01-17 10:38:31 -05:00
47 lines
33 KiB
HTML
47 lines
33 KiB
HTML
<!doctype html>
|
||
<html lang="en" dir="ltr" class="docs-wrapper plugin-docs plugin-id-default docs-version-current docs-doc-page docs-doc-id-deployment/docker" data-has-hydrated="false">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="generator" content="Docusaurus v3.0.1">
|
||
<title data-rh="true">Docker | Bracket</title><meta data-rh="true" name="viewport" content="width=device-width,initial-scale=1"><meta data-rh="true" name="twitter:card" content="summary_large_image"><meta data-rh="true" property="og:image" content="https://docs.bracketapp.nl/img/bracket-screenshot-design.png"><meta data-rh="true" name="twitter:image" content="https://docs.bracketapp.nl/img/bracket-screenshot-design.png"><meta data-rh="true" property="og:url" content="https://docs.bracketapp.nl/docs/deployment/docker"><meta data-rh="true" property="og:locale" content="en"><meta data-rh="true" name="docusaurus_locale" content="en"><meta data-rh="true" name="docsearch:language" content="en"><meta data-rh="true" name="docusaurus_version" content="current"><meta data-rh="true" name="docusaurus_tag" content="docs-default-current"><meta data-rh="true" name="docsearch:version" content="current"><meta data-rh="true" name="docsearch:docusaurus_tag" content="docs-default-current"><meta data-rh="true" property="og:title" content="Docker | Bracket"><meta data-rh="true" name="description" content="This section describes how to deploy Bracket (frontend and backend) to docker using docker-compose."><meta data-rh="true" property="og:description" content="This section describes how to deploy Bracket (frontend and backend) to docker using docker-compose."><link data-rh="true" rel="icon" href="/img/logo.svg"><link data-rh="true" rel="canonical" href="https://docs.bracketapp.nl/docs/deployment/docker"><link data-rh="true" rel="alternate" href="https://docs.bracketapp.nl/docs/deployment/docker" hreflang="en"><link data-rh="true" rel="alternate" href="https://docs.bracketapp.nl/docs/deployment/docker" hreflang="x-default"><script src="https://analytics.bracketapp.nl/script.js" async data-website-id="9c5b1839-5cbd-4d04-b95b-a217838898a9" data-domains="docs.bracketapp.nl"></script><link rel="stylesheet" href="/assets/css/styles.6c3e2005.css">
|
||
<script src="/assets/js/runtime~main.42e2f5d4.js" defer="defer"></script>
|
||
<script src="/assets/js/main.af2a8d16.js" defer="defer"></script>
|
||
</head>
|
||
<body class="navigation-with-keyboard">
|
||
<script>!function(){function t(t){document.documentElement.setAttribute("data-theme",t)}var e=function(){try{return new URLSearchParams(window.location.search).get("docusaurus-theme")}catch(t){}}()||function(){try{return localStorage.getItem("theme")}catch(t){}}();t(null!==e?e:"dark")}(),function(){try{const c=new URLSearchParams(window.location.search).entries();for(var[t,e]of c)if(t.startsWith("docusaurus-data-")){var a=t.replace("docusaurus-data-","data-");document.documentElement.setAttribute(a,e)}}catch(t){}}()</script><div id="__docusaurus"><div role="region" aria-label="Skip to main content"><a class="skipToContent_fXgn" href="#__docusaurus_skipToContent_fallback">Skip to main content</a></div><nav aria-label="Main" class="navbar navbar--fixed-top"><div class="navbar__inner"><div class="navbar__items"><button aria-label="Toggle navigation bar" aria-expanded="false" class="navbar__toggle clean-btn" type="button"><svg width="30" height="30" viewBox="0 0 30 30" aria-hidden="true"><path stroke="currentColor" stroke-linecap="round" stroke-miterlimit="10" stroke-width="2" d="M4 7h22M4 15h22M4 23h22"></path></svg></button><a class="navbar__brand" href="/"><div class="navbar__logo"><img src="/img/logo.svg" alt="Bracket Logo" class="themedComponent_mlkZ themedComponent--light_NVdE"><img src="/img/logo.svg" alt="Bracket Logo" class="themedComponent_mlkZ themedComponent--dark_xIcU"></div><b class="navbar__title text--truncate">Bracket</b></a><a aria-current="page" class="navbar__item navbar__link navbar__link--active" href="/docs/intro">Documentation</a><a class="navbar__item navbar__link" href="/docs/running-bracket/quickstart">Quickstart</a><a href="https://github.com/evroon/bracket" target="_blank" rel="noopener noreferrer" class="navbar__item navbar__link">GitHub<svg width="13.5" height="13.5" aria-hidden="true" viewBox="0 0 24 24" class="iconExternalLink_nPIU"><path fill="currentColor" d="M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"></path></svg></a></div><div class="navbar__items navbar__items--right"><div class="navbarSearchContainer_Bca1"><div class="navbar__search"><span aria-label="expand searchbar" role="button" class="search-icon" tabindex="0"></span><input id="search_input_react" type="search" placeholder="Loading..." aria-label="Search" class="navbar__search-input search-bar" disabled=""></div></div></div></div><div role="presentation" class="navbar-sidebar__backdrop"></div></nav><div id="__docusaurus_skipToContent_fallback" class="main-wrapper mainWrapper_z2l0"><div class="docsWrapper_hBAB"><button aria-label="Scroll back to top" class="clean-btn theme-back-to-top-button backToTopButton_sjWU" type="button"></button><div class="docRoot_UBD9"><aside class="theme-doc-sidebar-container docSidebarContainer_YfHR"><div class="sidebarViewport_aRkj"><div class="sidebar_njMd"><nav aria-label="Docs sidebar" class="menu thin-scrollbar menu_SIkG"><ul class="theme-doc-sidebar-menu menu__list"><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/docs/intro">Introduction</a></li><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-1 menu__list-item menu__list-item--collapsed"><div class="menu__list-item-collapsible"><a class="menu__link menu__link--sublist" aria-expanded="false" href="/docs/category/running-bracket">Running Bracket</a><button aria-label="Expand sidebar category 'Running Bracket'" type="button" class="clean-btn menu__caret"></button></div></li><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-1 menu__list-item"><div class="menu__list-item-collapsible"><a class="menu__link menu__link--sublist menu__link--active" aria-expanded="true" href="/docs/category/deployment">Deployment</a><button aria-label="Collapse sidebar category 'Deployment'" type="button" class="clean-btn menu__caret"></button></div><ul style="display:block;overflow:visible;height:auto" class="menu__list"><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/deployment/">Deployment</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/deployment/cloud-services">Cloud services</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link menu__link--active" aria-current="page" tabindex="0" href="/docs/deployment/docker">Docker</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/deployment/nomad">Nomad</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/deployment/systemd">Systemd</a></li></ul></li><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-1 menu__list-item menu__list-item--collapsed"><div class="menu__list-item-collapsible"><a class="menu__link menu__link--sublist" aria-expanded="false" href="/docs/category/community">Community</a><button aria-label="Expand sidebar category 'Community'" type="button" class="clean-btn menu__caret"></button></div></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/docs/api">API</a></li></ul></nav></div></div></aside><main class="docMainContainer_TBSr"><div class="container padding-top--md padding-bottom--lg"><div class="row"><div class="col docItemCol_VOVn"><div class="docItemContainer_Djhp"><article><nav class="theme-doc-breadcrumbs breadcrumbsContainer_Z_bl" aria-label="Breadcrumbs"><ul class="breadcrumbs" itemscope="" itemtype="https://schema.org/BreadcrumbList"><li class="breadcrumbs__item"><a aria-label="Home page" class="breadcrumbs__link" href="/"><svg viewBox="0 0 24 24" class="breadcrumbHomeIcon_YNFT"><path d="M10 19v-5h4v5c0 .55.45 1 1 1h3c.55 0 1-.45 1-1v-7h1.7c.46 0 .68-.57.33-.87L12.67 3.6c-.38-.34-.96-.34-1.34 0l-8.36 7.53c-.34.3-.13.87.33.87H5v7c0 .55.45 1 1 1h3c.55 0 1-.45 1-1z" fill="currentColor"></path></svg></a></li><li itemscope="" itemprop="itemListElement" itemtype="https://schema.org/ListItem" class="breadcrumbs__item"><a class="breadcrumbs__link" itemprop="item" href="/docs/category/deployment"><span itemprop="name">Deployment</span></a><meta itemprop="position" content="1"></li><li itemscope="" itemprop="itemListElement" itemtype="https://schema.org/ListItem" class="breadcrumbs__item breadcrumbs__item--active"><span class="breadcrumbs__link" itemprop="name">Docker</span><meta itemprop="position" content="2"></li></ul></nav><div class="tocCollapsible_ETCw theme-doc-toc-mobile tocMobile_ITEo"><button type="button" class="clean-btn tocCollapsibleButton_TO0P">On this page</button></div><div class="theme-doc-markdown markdown"><h1>Docker</h1>
|
||
<p>This section describes how to deploy Bracket (frontend and backend) to docker using docker-compose.</p>
|
||
<h2 class="anchor anchorWithStickyNavbar_LWe7" id="1-install-docker-and-docker-compose">1. Install Docker and docker compose<a href="#1-install-docker-and-docker-compose" class="hash-link" aria-label="Direct link to 1. Install Docker and docker compose" title="Direct link to 1. Install Docker and docker compose"></a></h2>
|
||
<p>First, make sure you have docker and docker compose installed.</p>
|
||
<h2 class="anchor anchorWithStickyNavbar_LWe7" id="2-store-the-docker-composeyml-file">2. Store the docker-compose.yml file<a href="#2-store-the-docker-composeyml-file" class="hash-link" aria-label="Direct link to 2. Store the docker-compose.yml file" title="Direct link to 2. Store the docker-compose.yml file"></a></h2>
|
||
<p>Then, store the following YAML in a file called <code>docker-compose.yml</code> in an empty directory.</p>
|
||
<p>The highlighted lines will be discussed in the next steps.</p>
|
||
<div class="language-yaml codeBlockContainer_Ckt0 theme-code-block" style="--prism-background-color:hsl(220, 13%, 18%);--prism-color:hsl(220, 14%, 71%)"><div class="codeBlockContent_biex"><pre tabindex="0" class="prism-code language-yaml codeBlock_bY9V thin-scrollbar" style="background-color:hsl(220, 13%, 18%);color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><code class="codeBlockLines_e6Vv"><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token key atrule" style="color:hsl(29, 54%, 61%)">services</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"></span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">bracket-frontend</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"></span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">image</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"> ghcr.io/evroon/bracket</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">-</span><span class="token plain">frontend</span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">container_name</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"> bracket</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">-</span><span class="token plain">frontend</span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">ports</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"></span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">-</span><span class="token plain"> </span><span class="token string" style="color:hsl(95, 38%, 62%)">"3000:3000"</span><span class="token plain"></span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">environment</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"></span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">NODE_ENV</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"> </span><span class="token string" style="color:hsl(95, 38%, 62%)">"production"</span><span class="token plain"></span><br></span><span class="token-line theme-code-block-highlighted-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">NEXT_PUBLIC_API_BASE_URL</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"> </span><span class="token string" style="color:hsl(95, 38%, 62%)">"http://your-site.com:8400"</span><span class="token plain"></span><br></span><span class="token-line theme-code-block-highlighted-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">NEXT_PUBLIC_HCAPTCHA_SITE_KEY</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"> </span><span class="token string" style="color:hsl(95, 38%, 62%)">"10000000-ffff-ffff-ffff-000000000001"</span><span class="token plain"></span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">restart</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"> unless</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">-</span><span class="token plain">stopped</span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">bracket-backend</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"></span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">image</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"> ghcr.io/evroon/bracket</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">-</span><span class="token plain">backend</span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">container_name</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"> bracket</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">-</span><span class="token plain">backend</span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">ports</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"></span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">-</span><span class="token plain"> </span><span class="token string" style="color:hsl(95, 38%, 62%)">"8400:8400"</span><span class="token plain"></span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">environment</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"></span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">ENVIRONMENT</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"> </span><span class="token string" style="color:hsl(95, 38%, 62%)">"PRODUCTION"</span><span class="token plain"></span><br></span><span class="token-line theme-code-block-highlighted-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">PG_DSN</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"> </span><span class="token string" style="color:hsl(95, 38%, 62%)">"postgresql://bracket_prod:bracket_prod@postgres:5432/bracket_prod"</span><span class="token plain"></span><br></span><span class="token-line theme-code-block-highlighted-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">CORS_ORIGINS</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"> https</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain">//your</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">-</span><span class="token plain">site.com</span><br></span><span class="token-line theme-code-block-highlighted-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">JWT_SECRET</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"> change_me</span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">volumes</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"></span><br></span><span class="token-line theme-code-block-highlighted-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">-</span><span class="token plain"> ./backend/static</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain">/app/static</span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">restart</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"> unless</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">-</span><span class="token plain">stopped</span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">depends_on</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"></span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">-</span><span class="token plain"> postgres</span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">postgres</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"></span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">image</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"> postgres</span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">restart</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"> always</span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">environment</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"></span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">POSTGRES_DB</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"> bracket_prod</span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">POSTGRES_USER</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"> bracket_prod</span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">POSTGRES_PASSWORD</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"> bracket_prod</span><br></span><span class="token-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token key atrule" style="color:hsl(29, 54%, 61%)">volumes</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain"></span><br></span><span class="token-line theme-code-block-highlighted-line" style="color:hsl(220, 14%, 71%);text-shadow:0 1px rgba(0, 0, 0, 0.3)"><span class="token plain"> </span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">-</span><span class="token plain"> ./postgres</span><span class="token punctuation" style="color:hsl(220, 14%, 71%)">:</span><span class="token plain">/var/lib/postgresql/data</span><br></span></code></pre><div class="buttonGroup__atx"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_eSgA" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_y97N"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_LjdS"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div>
|
||
<h2 class="anchor anchorWithStickyNavbar_LWe7" id="3-set-up-the-environment-variables">3. Set up the environment variables<a href="#3-set-up-the-environment-variables" class="hash-link" aria-label="Direct link to 3. Set up the environment variables" title="Direct link to 3. Set up the environment variables"></a></h2>
|
||
<p>Replace the lines that are highlighted in the code block from the previous step.</p>
|
||
<p>Replace the following values for <code>bracket-frontend</code>:</p>
|
||
<ul>
|
||
<li><code>NEXT_PUBLIC_API_BASE_URL</code>: The address of your backend. The frontend will send
|
||
requests to this address.</li>
|
||
<li><code>NEXT_PUBLIC_HCAPTCHA_SITE_KEY</code>: Either leave empty to disable it or
|
||
<a href="https://dashboard.hcaptcha.com/signup" target="_blank" rel="noopener noreferrer">signup for hCaptcha</a>, create a site and
|
||
put the site key here</li>
|
||
</ul>
|
||
<p>Replace the following values for <code>bracket-backend</code>:</p>
|
||
<ul>
|
||
<li><code>PG_DSN</code>: The DSN with format <code>postgresql://<username>:<password>@<host>:<port>/<database></code></li>
|
||
<li><code>CORS_ORIGINS</code>: Put the address of your frontend here, it's used to make sure incoming requests
|
||
can only come from your actual frontend</li>
|
||
<li><code>JWT_SECRET</code>: Generate a secret to create JWTs using <code>openssl rand -hex 32</code></li>
|
||
</ul>
|
||
<div class="theme-admonition theme-admonition-warning admonition_xJq3 alert alert--warning"><div class="admonitionHeading_Gvgb"><span class="admonitionIcon_Rf37"><svg viewBox="0 0 16 16"><path fill-rule="evenodd" d="M8.893 1.5c-.183-.31-.52-.5-.887-.5s-.703.19-.886.5L.138 13.499a.98.98 0 0 0 0 1.001c.193.31.53.501.886.501h13.964c.367 0 .704-.19.877-.5a1.03 1.03 0 0 0 .01-1.002L8.893 1.5zm.133 11.497H6.987v-2.003h2.039v2.003zm0-3.004H6.987V5.987h2.039v4.006z"></path></svg></span>warning</div><div class="admonitionContent_BuS1"><p>Note that your <code>docker-compose.yml</code> file now contains secrets.
|
||
If you want a more secure setup, you can store secrets in separate files on the host and
|
||
load them via <a href="https://docs.docker.com/compose/use-secrets/" target="_blank" rel="noopener noreferrer">docker secrets</a>.</p></div></div>
|
||
<h2 class="anchor anchorWithStickyNavbar_LWe7" id="4-update-volume-bindings">4. Update volume bindings<a href="#4-update-volume-bindings" class="hash-link" aria-label="Direct link to 4. Update volume bindings" title="Direct link to 4. Update volume bindings"></a></h2>
|
||
<p>Bracket needs two volume bindings: for the backend and for the database.</p>
|
||
<p>Update the two volume binding paths to point to a directory where you want to store the
|
||
persistent data.</p>
|
||
<h2 class="anchor anchorWithStickyNavbar_LWe7" id="5-access-the-application">5. Access the application<a href="#5-access-the-application" class="hash-link" aria-label="Direct link to 5. Access the application" title="Direct link to 5. Access the application"></a></h2>
|
||
<p>Run it using <code>docker compose up -d</code> in the same directory as the file.
|
||
Access Bracket at <code>http://localhost:3000</code>.</p></div><footer class="theme-doc-footer docusaurus-mt-lg"><div class="theme-doc-footer-edit-meta-row row"><div class="col"><a href="https://github.com/evroon/bracket/tree/master/docs/docs/deployment/docker.md" target="_blank" rel="noopener noreferrer" class="theme-edit-this-page"><svg fill="currentColor" height="20" width="20" viewBox="0 0 40 40" class="iconEdit_Z9Sw" aria-hidden="true"><g><path d="m34.5 11.7l-3 3.1-6.3-6.3 3.1-3q0.5-0.5 1.2-0.5t1.1 0.5l3.9 3.9q0.5 0.4 0.5 1.1t-0.5 1.2z m-29.5 17.1l18.4-18.5 6.3 6.3-18.4 18.4h-6.3v-6.2z"></path></g></svg>Edit this page</a></div><div class="col lastUpdated_vwxv"></div></div></footer></article><nav class="pagination-nav docusaurus-mt-lg" aria-label="Docs pages"><a class="pagination-nav__link pagination-nav__link--prev" href="/docs/deployment/cloud-services"><div class="pagination-nav__sublabel">Previous</div><div class="pagination-nav__label">Cloud services</div></a><a class="pagination-nav__link pagination-nav__link--next" href="/docs/deployment/nomad"><div class="pagination-nav__sublabel">Next</div><div class="pagination-nav__label">Nomad</div></a></nav></div></div><div class="col col--3"><div class="tableOfContents_bqdL thin-scrollbar theme-doc-toc-desktop"><ul class="table-of-contents table-of-contents__left-border"><li><a href="#1-install-docker-and-docker-compose" class="table-of-contents__link toc-highlight">1. Install Docker and docker compose</a></li><li><a href="#2-store-the-docker-composeyml-file" class="table-of-contents__link toc-highlight">2. Store the docker-compose.yml file</a></li><li><a href="#3-set-up-the-environment-variables" class="table-of-contents__link toc-highlight">3. Set up the environment variables</a></li><li><a href="#4-update-volume-bindings" class="table-of-contents__link toc-highlight">4. Update volume bindings</a></li><li><a href="#5-access-the-application" class="table-of-contents__link toc-highlight">5. Access the application</a></li></ul></div></div></div></div></main></div></div></div><footer class="footer footer--dark"><div class="container container-fluid"><div class="row footer__links"><div class="col footer__col"><div class="footer__title">Intro</div><ul class="footer__items clean-list"><li class="footer__item"><a class="footer__link-item" href="/docs/intro">Introduction</a></li><li class="footer__item"><a class="footer__link-item" href="/docs/running-bracket/quickstart">Quickstart</a></li></ul></div><div class="col footer__col"><div class="footer__title">Running Bracket</div><ul class="footer__items clean-list"><li class="footer__item"><a class="footer__link-item" href="/docs/running-bracket/configuration">Configuration</a></li><li class="footer__item"><a class="footer__link-item" href="/docs/deployment">Deployment</a></li></ul></div><div class="col footer__col"><div class="footer__title">Community</div><ul class="footer__items clean-list"><li class="footer__item"><a class="footer__link-item" href="/docs/community/contributing">Contributing</a></li><li class="footer__item"><a class="footer__link-item" href="/docs/community/development">Developing</a></li></ul></div><div class="col footer__col"><div class="footer__title">More</div><ul class="footer__items clean-list"><li class="footer__item"><a href="https://github.com/evroon/bracket" target="_blank" rel="noopener noreferrer" class="footer__link-item">GitHub<svg width="13.5" height="13.5" aria-hidden="true" viewBox="0 0 24 24" class="iconExternalLink_nPIU"><path fill="currentColor" d="M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"></path></svg></a></li><li class="footer__item"><a href="https://github.com/evroon/bracket/blob/master/LICENSE" target="_blank" rel="noopener noreferrer" class="footer__link-item">License<svg width="13.5" height="13.5" aria-hidden="true" viewBox="0 0 24 24" class="iconExternalLink_nPIU"><path fill="currentColor" d="M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"></path></svg></a></li><li class="footer__item"><a href="https://github.com/evroon/bracket/releases" target="_blank" rel="noopener noreferrer" class="footer__link-item">Changelog<svg width="13.5" height="13.5" aria-hidden="true" viewBox="0 0 24 24" class="iconExternalLink_nPIU"><path fill="currentColor" d="M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"></path></svg></a></li></ul></div></div><div class="footer__bottom text--center"><div class="footer__copyright">Bracket - Self-Hosted Tournament System.<br> Licensed under AGPL-v3.0. Copyright © 2024 Bracket. Built with Docusaurus.</div></div></div></footer></div>
|
||
</body>
|
||
</html> |