매우 오래된 Discourse 사이트를 업그레이드하는 방법?

Hi @Paul-Reed and @codinghorror,

@pfaffman 님 덕분에 다시 정상적으로 돌아올 수 있었습니다… 정말 훌륭하게 도와주셨어요! 사이트가 새것처럼 깔끔해졌고, 필요한 모든 것이 백업에 있었기 때문에 Discourse는 정말 놀라웠습니다!

Discourse의 기술력이 정말 대단하네요!

@pfaffman 님이 다음과 같이 알려주셨습니다:

  1. 2개 컨테이너 설치 방법 (여기서 설명되어 있습니다: described here).
  2. 오래된 설치 환경의 경우, 새 설치에서 백업으로 복원하는 것이 가장 적은 저항의 경로인 것 같았습니다.
  3. 백업 파일 외에 유용한 파일은 실제로 하나뿐인데, 바로 /var/discourse/containers/app.yml 파일입니다. 그리고 저는 7일마다가 아니라 매일 백업을 해야 합니다!

제가 알고 있었지만 기억해야 했었던 중요한 교훈:

10분이면 끝날 거라고 생각해도, 때로는 그렇지 않은 법입니다. @Paul-Reed 님에게 헤더에 대해 좋은 조언을 해드리고 싶어서 이 업데이트를 시작했는데, 오호! 그리고 이건 제가 처음 배우는 것이 아니라, 우리가 종종 잊어버리는 것입니다. 제 전문 분야는 컨설팅 회사 https://www.shakacode.com 과 오픈소스 프로젝트 GitHub - shakacode/react_on_rails: Integration of React + Webpack + Rails including server-side rendering of React, enabling a better developer experience and faster client performance. · GitHub 를 통해 React와 Ruby on Rails로 만든 사이트의 성능을 향상시키는 것입니다.

Docker 기반의 DevOps는 할 수 있지만, 제가 달성하려는 목표에서 많은 시간을 빼앗아 갑니다!

그래서 이런 모든 상황 때문에, 제 홈페이지 https://forum.shakacode.com/ 의 일부 업데이트를 @pfaffman 님이 도와주도록 고려하고 있습니다.

모든 도움에 대해 @codinghorror 님과 @pfaffman 님께 진심으로 감사드립니다!


관심 있으신 분들을 위해, 이 오래된 Discourse 사이트 업데이트를 유발한 커스텀 헤더 수정 방법을 공유합니다.

커스텀 헤더

우선, 이 문제를 직접 해결하기보다 (yak shaving) https://support.literatecomputing.com/ 의 @pfaffman 님에게 연락하는 것을 권장합니다. 사실, 이 영역에서 더 멋진 것을 만들고 싶다면 @pfaffman 님이 도와주실 것입니다!

하지만, 직접 해보고 싶은 분들을 위해, 유용한 부분들은 모두 여기에 있다고 생각합니다:

제가 아는 한, 나머지는 모두 비어 있습니다.

CSS

#top-navbar-container {
    background: black;
    height: 25px;
}

#top-navbar-links .spacer {
    display: inline-block;
    margin-left: 12px;
    margin-right: 12px;
}


#top-navbar-links, #top-navbar-links a:visited, #top-navbar-links a {
    color: white;
}

header.d-header {
    background: black;
    background-image: url(/uploads/default/63/873a733a013f8208.jpg);
    padding-top: 0;
    box-shadow: none;
    top: 25px;
    height: 63px;
}

.ember-view > #main-outlet {
    padding-top: 97px;
}

header > .container {
    background-image: url(/uploads/default/63/873a733a013f8208.jpg);
    max-width: 1200px;
    padding-right: 50px;
}

header.d-header > .container > .contents {
    margin: 0;
}

header.d-header #site-logo, header.d-header .logo-small {
    max-height: 53px;
}

body #main .extra-info > a.star {
    color: #A5ACDD;
}

header .extra-info-wrapper h1 {
    margin-top: 18px;    
}

@media screen and (min-width: 1140px)  {
    header .extra-info-wrapper {
        max-width: 780px;
    }
}

@media screen and (min-width: 967px) and (max-width: 1139px)  {
    header .extra-info-wrapper {
        max-width: 647px;
    }
}

#user-notifications, #search-button, #site-map  {
    color: #AAA; 
}

@media screen and (max-width: 966px) {
    .extra-info-wrapper {
        max-width: 620px;
    }
}

header .current-username .username > a {
    color: white;
}

header.d-header .icons .icon:hover {
    background-color: #000000;
}

HEADER

<div id="top-navbar-container" class="d-header">
<div id="top-navbar" class="wrap">
<span id="top-navbar-links" style="height:20px;">
  <a href="http://forum.talksurf.com">Home</a><span class="spacer"> | </span>
  <a href="http://forum.talksurf.com/category/surfing/doug-silva">Doug Silva</a><span class="spacer"> | </span>
  <a href="http://forum.talksurf.com/category/surfing">Surfing</a><span class="spacer"> | </span>
  <a href="http://forum.talksurf.com/category/kitesurfing">Kitesurfing</a><span class="spacer"> | </span>
  <a href="http://forum.talksurf.com/category/standup-paddling">SUP</a><span class="spacer"> | </span>
  <a href="http://forum.talksurf.com/category/windsurfing">Windsurfing</a><span class="spacer"> | </span>
  <a href="http://forum.talksurf.com/t/pros-instructors-equipment-travel/264">Pros</a><span class="spacer"> | </span>
  <a href="http://forum.talksurf.com/t/what-is-talksurf-com/265">About</a><span class="spacer"> | </span>
  <a href="http://forum.talksurf.com/faq">FAQ</a>
</span>
</div>
</div>