블로그 메뉴 추가 (#3, #17)

.bundle/config

@@ -0,0 +1,2 @@
+---
+BUNDLE_PATH: "vendor/bundler"

.gitignore

@@ -1,4 +1,5 @@
 _site
 .sass-cache
 .jekyll-metadata
-.DS_Store
+.DS_Store
+vendor/

Gemfile

@@ -43,4 +43,10 @@ gem "http_parser.rb", "~> 0.6.0", :platforms => [:jruby]
 # Add the following to enable i18n
 group :jekyll_plugins do
   gem "jekyll-polyglot"
-end
+end
+
+# Paginator plugin
+gem "jekyll-paginate-v2"
+
+# Redirect-from plugin
+gem "jekyll-redirect-from"

Gemfile.lock

@@ -29,8 +29,12 @@ GEM
       safe_yaml (~> 1.0)
     jekyll-feed (0.17.0)
       jekyll (>= 3.7, < 5.0)
+    jekyll-paginate-v2 (3.0.0)
+      jekyll (>= 3.0, < 5.0)
     jekyll-polyglot (1.5.1)
       jekyll (>= 3.0)
+    jekyll-redirect-from (0.16.0)
+      jekyll (>= 3.3, < 5.0)
     jekyll-sass-converter (1.5.2)
       sass (~> 3.4)
     jekyll-seo-tag (2.8.0)
@@ -80,7 +84,9 @@ DEPENDENCIES
   http_parser.rb (~> 0.6.0)
   jekyll (~> 3.9.2)
   jekyll-feed (~> 0.6)
+  jekyll-paginate-v2
   jekyll-polyglot
+  jekyll-redirect-from
   kramdown-parser-gfm
   minima (~> 2.0)
   tzinfo (~> 1.2)

HOW_TO_USE.md

@@ -0,0 +1,84 @@
+# 클라우드 유랑단 홈페이지 사용법
+
+## 메인 페이지
+
+- `_config.yml` 파일의 `main` 섹션에 새로운 `slide` 값을 추가하거나 기존 값을 수정합니다.
+- 아래와 같이 `title`과 `description`을 입력하면 새로운 메인 화면 내용이 추가됩니다.
+
+  ```yaml
+  main:
+    slide:
+      - title: 여러분 곁의 클라우드 유랑단
+        description: 클라우드 유랑단은 다양성을 인정하고 정보 격차 해소를 위해 노력합니다. <br />열린 마음으로 서로를 존중하며 다 같이 성장하는 따뜻한 커뮤니티가 되도록 함께 해주세요!
+        # link: # 생략하면 '더 보기' 버튼이 사라집니다.
+      # - title: # 큰 글씨입니다.
+      #   description: # 작은 글씨입니다. 줄 바꿈은 <br />을 넣어주세요.
+      #   link: # https:// 를 포함한 url을 적어주세요. 생략하면 '더 보기' 버튼이 사라집니다.
+  ```
+
+## 행사 추가하기
+
+- `_events/` 디렉토리 아래에 새로운 행사 파일을 추가하거나, 기존 행사 정보를 변경할 수 있습니다.
+- 새로운 행사 추가를 위해서는 `_template.ko.md` 및 `_template.en.md` 파일을 복사하여 각각 한국어와 영어로 작성하여 사용합니다.
+  - 파일명은 `YYYY-MM-DD-간단한지역또는행사명.md` 형식으로 작성합니다. (예. `2023-02-18-DDD.md`)
+  - 행사 소개 사진 파일명은 동일하게 지정하여 `assets/img/events/thumbnail/` 에 저장합니다. (예. `2023-02-18-DDD.png`)
+
+    ```markdown
+    ---
+    lang:  # 언어 정보 (ko 또는 en)
+    title: # 행사 제목
+    date:  # 행사 일정, YYYY-mm-dd
+    link:  # 행사 링크
+    description: >-
+      # 간략한 행사 소개, 1줄 가량
+    ---
+    ```
+
+## 유랑단원 추가하기
+
+- `_members/` 디렉토리 아래에 새로운 유랑단원 파일을 추가하거나, 기존 유랑단원 정보를 변경할 수 있습니다.
+- 새로운 단원 추가를 위해서는 `_template.ko.md` 및 `_template.en.md` 파일을 복사하여 각각 한국어와 영어로 작성하여 사용합니다.
+  - 파일명은 `영문이름-영문성.md` 파일을 복사하여 사용합니다. (예. `justin-yoo.md`)
+  - 유랑단원의 사진 파일명은 동일하게 지정하여 `assets/img/members/` 에 저장합니다. (예. `justin-yoo.png`)
+
+    ```markdown
+    ---
+    lang:       # 언어 정보 (ko 또는 en)
+    # 기본 정보
+    order:      # 정렬 순서 (숫자)
+    name:       # 언어별 이름
+    from:       # 언어별 소속
+    profile:    # 사진 파일명 (300px x 300px)
+
+    # 소셜 정보 (최대 4개)
+    github:     # GitHub ID
+    twitter:    # Twitter ID (@ 제외)
+    linkedin:   # Linkedin ID
+    homepage:   # 홈페이지 주소 (https:// 제외)
+    mediaum:    # 미디엄 주소 (@ 제외)
+    youtube:    # Youtube Channel ID (@ 제외)
+    ---
+    ```
+
+## 블로그 추가하기
+
+- `_posts/` 디렉토리 아래에 새로운 블로그 글을 작성할 수 있습니다.
+- `YYYY-MM-DD-파일-제목-아무거나.md` 형태로 블로그 글을 작성해주세요.
+  - 다국어 지원 글인 경우, `_posts/en` 등과 같이 언어 디렉토리에 **동일한 파일명**으로 작성해주세요.
+  - 템플릿으로 작성된 `2000-01-31-TITLE-HERE.md` 파일을 복사하여 사용하셔도 됩니다.
+- 아래와 같이 블로그 글 상단의 메타 정보를 작성합니다.
+
+  ```markdown
+  ---
+  lang: ko                # 언어 정보 / 변경하지 말아주세요 (영어의 경우 en으로 되어 있습니다)
+  layout: blog_post       # 레이아웃 정보 / 변경하지 말아주세요
+  title:                  # (언어별) 제목을 적어주세요
+  author:                 # (언어별) 작성자 이름을 적어주세요 / 미작성 시 기본값(클라우드 유랑단)으로 표시됩니다
+  thumbnail:              # (썸네일 존재시) 파일 이름을 적어주세요. 해당 파일은 /assets/blog/ 경로에 있어야 합니다.
+  published: false        # 공개 여부입니다. 블로그 글을 공개하시려면 true로 변경해주세요.
+  ---
+  ```
+
+- 파일 내용은 Markdown 또는 HTML으로 작성하시면 됩니다.
+  - 블로그 글에 포함하는 이미지 또는 파일은 `/assets/blog/` 경로에 디렉토리를 생성하고 저장해주세요. (위 메타의 thumbnail 값 제외)
+  - 예. `2000-01-31-TITLE-HERE.md`에 포함할 파일은 `/assets/blog/TITLE-HERE/` 디렉토리에 저장해주세요.

Makefile

@@ -0,0 +1,39 @@
+SHELL := /bin/bash
+BUNDLE := bundle
+GEM := gem
+VENDOR_DIR = assets/vendor/
+JEKYLL := $(BUNDLE) exec jekyll
+
+PROJECT_DEPS := Gemfile
+
+.PHONY: all clean install update
+
+all : serve
+
+check:
+	$(JEKYLL) doctor
+	$(HTMLPROOF) --check-html \
+		--http-status-ignore 999 \
+		--internal-domains localhost:4000 \
+		--assume-extension \
+		_site
+
+install: $(PROJECT_DEPS)
+	$(GEM) install bundler -v 2.3.13
+	$(BUNDLE) install --path vendor/bundler
+
+update: $(PROJECT_DEPS)
+	$(BUNDLE) update
+
+include-submodule-deps:
+	git submodule update --init --recursive
+	git submodule update --remote
+
+build: install include-submodule-deps
+	$(JEKYLL) build --config _config.yml
+
+serve: install include-submodule-deps
+	JEKYLL_ENV=development $(JEKYLL) serve --incremental --config _config.yml
+
+build_deploy: include-submodule-deps
+	JEKYLL_ENV=production $(JEKYLL) build

README.md

@@ -87,62 +87,4 @@
 
 ## 사용법
 
-### 메인 페이지
-
-- `_config.yml` 파일의 `main` 섹션에 새로운 `slide` 값을 추가하거나 기존 값을 수정합니다.
-- 아래와 같이 `title`과 `description`을 입력하면 새로운 메인 화면 내용이 추가됩니다.
-
-  ```yaml
-  main:
-    slide:
-      - title: 여러분 곁의 클라우드 유랑단
-        description: 클라우드 유랑단은 다양성을 인정하고 정보 격차 해소를 위해 노력합니다. <br />열린 마음으로 서로를 존중하며 다 같이 성장하는 따뜻한 커뮤니티가 되도록 함께 해주세요!
-        # link: # 생략하면 '더 보기' 버튼이 사라집니다.
-      # - title: # 큰 글씨입니다.
-      #   description: # 작은 글씨입니다. 줄 바꿈은 <br />을 넣어주세요.
-      #   link: # https:// 를 포함한 url을 적어주세요. 생략하면 '더 보기' 버튼이 사라집니다.
-  ```
-
-### 행사 추가하기
-
-- `_events/` 디렉토리 아래에 새로운 행사 파일을 추가하거나, 기존 행사 정보를 변경할 수 있습니다.
-- 새로운 행사 추가를 위해서는 `_template.ko.md` 및 `_template.en.md` 파일을 복사하여 각각 한국어와 영어로 작성하여 사용합니다.
-  - 파일명은 `YYYY-MM-DD-간단한지역또는행사명.md` 형식으로 작성합니다. (예. `2023-02-18-DDD.md`)
-  - 행사 소개 사진 파일명은 동일하게 지정하여 `assets/img/events/thumbnail/` 에 저장합니다. (예. `2023-02-18-DDD.png`)
-
-    ```markdown
-    ---
-    lang:  # 언어 정보 (ko 또는 en)
-    title: # 행사 제목
-    date:  # 행사 일정, YYYY-mm-dd
-    link:  # 행사 링크
-    description: >-
-      # 간략한 행사 소개, 1줄 가량
-    ---
-    ```
-
-### 유랑단원 추가하기
-
-- `_members/` 디렉토리 아래에 새로운 유랑단원 파일을 추가하거나, 기존 유랑단원 정보를 변경할 수 있습니다.
-- 새로운 단원 추가를 위해서는 `_template.ko.md` 및 `_template.en.md` 파일을 복사하여 각각 한국어와 영어로 작성하여 사용합니다.
-  - 파일명은 `영문이름-영문성.md` 파일을 복사하여 사용합니다. (예. `justin-yoo.md`)
-  - 유랑단원의 사진 파일명은 동일하게 지정하여 `assets/img/members/` 에 저장합니다. (예. `justin-yoo.png`)
-
-    ```markdown
-    ---
-    lang:       # 언어 정보 (ko 또는 en)
-    # 기본 정보
-    order:      # 정렬 순서 (숫자)
-    name:       # 한글 이름
-    from:       # 소속
-    profile:    # 사진 파일명 (300px x 300px)
-
-    # 소셜 정보 (최대 4개)
-    github:     # GitHub ID
-    twitter:    # Twitter ID (@ 제외)
-    linkedin:   # Linkedin ID
-    homepage:   # 홈페이지 주소 (https:// 제외)
-    mediaum:    # 미디엄 주소 (@ 제외)
-    youtube:    # Youtube Channel ID (@ 제외)
-    ---
-    ```
+[HOW_TO_USE.md](./HOW_TO_USE.md) 문서를 참고해주세요.

_config.yml

@@ -1,12 +1,14 @@
 # Site settings
 title: SITE_TITLE                       # 기본값, 언어별 _data/[lang]/translations.yml 의 title 을 사용
-email: enquiry@bandwagon.cloud
 description: SITE_DESCRIPTIONS          # 기본값, 언어별 _data/[lang]/translations.yml 의 description 을 사용
+email: enquiry@bandwagon.cloud
 url: https://bandwagon.cloud
 baseurl: /
 analytics:
   google: G-3JQWP2V3H3
   microsoft: fy8z2p7qhr
+timezone: Asia/Seoul
+
 
 # Site properties
 ext_links:
@@ -15,12 +17,15 @@ ext_links:
   youtube: https://youtube.com/@CloudBandWagon
   facebook: https://www.facebook.com/groups/377135874191187
 
+
 # Build settings
 markdown: kramdown
 theme: minima
 plugins:
   - jekyll-polyglot
   - jekyll-feed
+  - jekyll-paginate-v2
+  - jekyll-redirect-from
 permalink: pretty
 sass:
   sourcemap: never
@@ -29,6 +34,10 @@ collections:
     output: false
   members:
     output: false
+  posts:
+    output: true
+    permalink: /blog/:title/
+
 
 # Include from processing
 include:
@@ -40,11 +49,9 @@ exclude:
   - README.md
   - Gemfile
   - Gemfile.lock
-  - node_modules
-  - vendor/bundle/
-  - vendor/cache/
-  - vendor/gems/
-  - vendor/ruby/
+  - node_modules/
+  - images/
+  - vendor/
 
 
 # Polyglot settings for i18n
@@ -55,3 +62,21 @@ languages:
 exclude_from_localization:
   - assets
 parallel_localization: true
+
+
+# Pagination
+pagination:
+  enabled: true
+  debug: false
+  collection: 'posts'
+  per_page: 5
+  permalink: '/blog/:num/'
+  title: ':title (:num / :max)'
+  limit: 0
+  sort_field: 'date'
+  sort_reverse: true
+  category: 'posts'
+  trail:
+    before: 2
+    after: 2
+  extension: html

_data/en/translations.yml

@@ -4,6 +4,10 @@ site:
     The Cloud Bandwagon are here for you -
     Cloud Bandwagon celebrates diversity and strives to bridge the information gap.
     Join us as we build a welcoming community of open minds and respect for each other!
+  author: Cloud Bandwagon
+menu:
+  home: Home
+  blog: Blog
 includes:
   carousel:
     slides:
@@ -25,4 +29,6 @@ includes:
     social:
       heading: Social
       description: Find us on other services!
-    coc: The Cloud Bandwagon and those who be with us adhere to a <a href="__COC_URL__" target="_blank">Code of Conduct</a>.
+    coc: The Cloud Bandwagon and those who be with us adhere to a <a href="__COC_URL__" target="_blank">Code of Conduct</a>.
+  blog:
+    readmore: Read more

_data/ko/translations.yml

@@ -4,6 +4,10 @@ site:
     여러분 곁의 클라우드 유랑단 -
     클라우드 유랑단은 다양성을 인정하고 정보 격차 해소를 위해 노력합니다.
     열린 마음으로 서로를 존중하며 다 같이 성장하는 따뜻한 커뮤니티가 되도록 함께 해주세요!
+  author: 클라우드 유랑단
+menu:
+  home: 홈
+  blog: 블로그
 includes:
   carousel:
     slides:
@@ -25,4 +29,6 @@ includes:
     social:
       heading: 유랑단 소식
       description: 더 많은 곳에서 클라우드 유랑단을 만나보세요!
-    coc: 클라우드 유랑단 및 유랑단과 함께 하는 모든 사람들은 <a href="__COC_URL__" target="_blank">행동 강령</a>을 준수합니다.
+    coc: 클라우드 유랑단 및 유랑단과 함께 하는 모든 사람들은 <a href="__COC_URL__" target="_blank">행동 강령</a>을 준수합니다.
+  blog:
+    readmore: 더 보기

_includes/footer.html

@@ -26,20 +26,6 @@ <h4>{{ translations.includes.footer.social.heading }}</h4>
     </div>
 
     <div class="container">
-      <div class="i18n align-items-center">
-        <ul>
-{% for lang_code in site.languages %}
-  {% if lang_code == site.default_lang %}{% assign lang_href = site.baseurl | append: page.url | relative_url | replace: "//", "/" %}
-  {% else %}{% assign lang_href = site.baseurl | append: lang_code | append: page.url | relative_url | replace: "//", "/"  %}
-  {% endif %}
-        <li{% if lang_code == site.active_lang %} class="active"{% endif %}>
-          {% if lang_code == site.active_lang %}<span>{{ site.data.languages[lang_code] }}</span>
-          {% else %}<a href="{{ lang_href }}">{{ site.data.languages[lang_code] }}</a>{% endif %}
-        </li>
-        {%- if forloop.last == false -%}<li>{{" "}}{{ site.langsep }}{{" "}}</li>{%- endif -%}
-{% endfor %}
-        </ul>
-      </div>
       <div class="copyright">
         <p class="footer-links">{{ translations.includes.footer.coc | replace: "__COC_URL__", site.ext_links.coc }}</p>
         &copy; Copyright <strong><span>{{ translations.site.title }}</span></strong>. All Rights Reserved.