개발 블로그 중간발표 'GitHub Blog Opening'

드디어 개발블로그가 일부 완성되었다.

한 동안 정신없이 달려 드디어 일부 공개를 하는 이 마음이 너무 행복하고 더욱 내일이 기다려지기도 한다.

왜냐하면 아직 가야 할길이 너무나 많이 남아 있기 때문에 멈출 수가 없다.

솔직히 아는 지식없이 무작정 시작을 했지만 그래도 그냥 행복하다.
뭐 사실 큰 성과는 없는것은 사실이지만 그래도 내가 행복해하는 모습이 나 스스로에게 뿌듯함을 느끼기도 한다.
무에서 유를 창조한다는것이 얼마나 험난한 길임을 알면서도 나는 나의 모든 열정을 여기에 솟고 매일매일 검색하고 자료를 수집하고 찾고 또 찾고 있다.

 

GitHub Blog 준비과정

1. GitHub 계정 생성: GitHub에 로그인하거나 계정을 만듭니다.
2. 새 Repository 생성: 새로운 repository를 생성합니다. Repository 이름은 {사용자명}.github.io로 지어야 GitHub Pages에서 호스팅할 수 있습니다. 예를 들어, 사용자명이 username이면 repository 이름은 username.github.io가 되어야 합니다.

Jekyll 테마 선택

1. Jekyll 테마 선택: Jekyll 공식 테마나 GitHub에서 제공하는 다양한 테마 중 하나를 선택합니다. 테마를 선택할 때는 repository의 _config.yml 파일에 맞는 테마를 선택해야 합니다.
2. 테마 적용: 선택한 테마의 GitHub 페이지에서 설치 및 설정 방법을 확인하고, 필요한 경우 _config.yml 파일을 수정하여 테마를 적용합니다.

로컬 환경에서 설정

1. 로컬에 Git 설치: 컴퓨터에 Git을 설치합니다.
2. Repository 클론: Git을 사용하여 로컬 컴퓨터로 repository를 클론합니다.

git clone https://github.com/username/username.github.io

 

3. Jekyll 설치: Jekyll을 로컬에 설치합니다.

 

 

bash
gem install jekyll bundler

 

로컬에서 테스트: Jekyll을 사용하여 로컬에서 사이트를 테스트합니다.

cd username.github.io
bundle exec jekyll serve

 

 

이후 웹 브라우저에서 http://localhost:4000을 열어 사이트가 정상적으로 작동하는지 확인합니다.

사이트 커스터마이즈

1. 기본 설정 변경: _config.yml 파일에서 사이트의 기본 설정을 변경합니다. 예를 들어, 사이트 이름, 설명, 소셜 미디어 링크 등을 설정할 수 있습니다.
2. 페이지 추가 및 수정: 필요에 따라 새로운 페이지를 추가하거나 기존 페이지를 수정합니다. Jekyll에서는 Markdown 형식으로 글을 작성하고 _posts 디렉터리에 저장하여 블로그 글을 추가할 수 있습니다.

GitHub에 푸시하여 배포

1. 변경 사항 커밋 및 푸시: 로컬에서 수정한 사항을 Git을 사용하여 커밋하고 GitHub에 푸시합니다.

git add .
git commit -m "설명"
git push origin main

 

 

 2.GitHub Pages 설정: GitHub repository의 Settings 탭에서 GitHub Pages를 사용하여 배포되도록 설정합니다. 배포된 사이트는 http://syskido.github.io에서 접근할 수 있습니다.

사이트 관리 및 유지보수

1. 정기적인 업데이트: 사이트의 내용이나 디자인을 변경할 때마다 로컬에서 테스트한 후 변경 사항을 GitHub에 푸시하여 업데이트합니다.
2. 이슈 처리: GitHub Issues를 사용하여 사이트 관련 문제를 추적하고 해결합니다.

정적 사이트 생성기(Static Site Generator, SSG)

 

는 웹 사이트를 생성할 때 서버 측에서 동적으로 컨텐츠를 생성하는 대신 사전에 정적 파일로 변환하여 제공하는 도구입니다. 정적 사이트 생성기는 다음과 같은 주요 특징을 가지고 있습니다:

동작 원리

• Markdown 및 템플릿 엔진 사용: 주로 Markdown이나 다른 마크업 언어로 작성된 파일들과, 템플릿 엔진을 사용하여 사이트의 레이아웃과 디자인을 구성합니다.
• 빌드 프로세스: 개발자가 지정한 템플릿과 콘텐츠 파일들을 통해 HTML, CSS, JavaScript 등의 정적 파일을 빌드합니다.
• 서버 요구 사항 없음: 정적 파일들만으로 웹 사이트를 호스팅할 수 있어 서버 측 구성이 단순화됩니다.

 

주요 장점

• 속도: 빠른 로딩 속도를 제공합니다. 정적 파일을 사용하기 때문에 서버에서 동적으로 생성하는 과정이 없어 응답 시간이 단축됩니다.
• 보안: 서버 측 스크립트나 데이터베이스에 접근하는 과정이 없어 보안 위험이 줄어듭니다.
• 간편성: 통합된 빌드 시스템을 통해 개발자가 사이트의 구조를 관리하고, 필요할 때 쉽게 배포할 수 있습니다.

주요 정적 사이트 생성기

여러 가지 정적 사이트 생성기가 있지만, 대표적으로 많이 사용되는 몇 가지를 소개하겠습니다:

• Jekyll: Ruby 기반의 정적 사이트 생성기로, GitHub Pages와 호환성이 뛰어나며, 다양한 테마와 플러그인을 지원합니다.
• Hugo: Go 언어로 개발된 매우 빠른 정적 사이트 생성기로, 다양한 테마와 강력한 템플릿 시스템을 제공합니다.
• Gatsby: React 기반의 정적 사이트 생성기로, 최신 프론트엔드 기술을 활용하여 동적인 기능을 정적 사이트에 통합할 수 있습니다.
• Hexo: Node.js 기반의 간단한 정적 사이트 생성기로, 특히 블로그에 많이 사용됩니다.

 

사용 방법

대부분의 정적 사이트 생성기는 비슷한 작업 흐름을 가지고 있습니다:

1. 프로젝트 초기화: 생성기의 명령어를 사용하여 새로운 프로젝트를 초기화합니다.
2. 템플릿 및 레이아웃 설정: 사용할 테마나 템플릿을 설정하고, 사이트의 레이아웃을 결정합니다.
3. 콘텐츠 작성: Markdown 파일을 사용하여 콘텐츠를 작성하고, 필요한 경우 이미지나 다른 자원을 관리합니다.
4. 빌드 및 배포: 생성기의 빌드 명령어를 사용하여 정적 파일들을 생성하고, 이를 호스팅 서비스에 배포합니다.
5. 유지보수: 콘텐츠나 디자인을 업데이트할 때마다 위 과정을 반복하여 사이트를 관리합니다.