홈페이지

  • |

    정적홈페이지 – Cloudflare Pages로 홈페이지 배포하기

    Cloudflare Pages로 홈페이지 배포하기 왜 이 과정이 필요한가요? Hugo로 만든 정적 사이트는 그대로는 인터넷에 공개되지 않습니다. 반드시 “빌드된 결과물(public 폴더)”을 누군가의 서버가 대신 호스팅해줘야 합니다. Cloudflare Pages는 이 과정을 초보자에게 가장 단순하게 만들어 줍니다. GitHub와 연결하면 git push만으로 자동 빌드·배포(업데이트)됩니다. 무료 플랜만으로도 전 세계 CDN을 통해 빠르게 제공됩니다. HUGO_VERSION 환경 변수를 지정하면, 내 로컬과 같은…

  • |

    사이트 제작기 1부 – 왜 정적 홈페이지로 시작했나

    이 시리즈에 대하여 이 글은 여러분이 지금 보고 계신 jesusiswith.us 사이트가 어떻게 만들어졌는지를, 실제 코드와 폴더를 열어 보며 처음부터 끝까지 소개하는 4부작 시리즈입니다. “홈페이지를 코딩 없이 만들 수 있다”는 말이 정확히 무슨 뜻인지, 그리고 그 안에서 어떤 자동화가 매일 밤 조용히 돌아가고 있는지를 초보자도 이해할 수 있게 풀어씁니다. 1부 (이 글) — 왜 정적 홈페이지인가…

  • |

    사이트 제작기 2부 – 콘텐츠 3구역 대해부

    사이트 제작기 시리즈 · 1부 — 왜 정적 홈페이지인가 / 2부 (이 글) — 콘텐츠 3구역 대해부 / 3부 — 자동화 파이프라인 / 4부 — 커스터마이징과 관리자 패널 1부에서 “우리가 글을 쓰는 곳은 content/ 폴더뿐”이라고 했습니다. 그런데 그 안을 열어 보면 글이 아무렇게나 쌓여 있는 게 아니라, 성격이 뚜렷한 세 개의 구역으로 정돈되어 있습니다. 이번…

  • |

    사이트 제작기 3부 – 매일 밤 도는 자동화 파이프라인

    사이트 제작기 시리즈 · 1부 — 왜 정적 홈페이지인가 / 2부 — 콘텐츠 3구역 / 3부 (이 글) — 자동화 파이프라인 / 4부 — 커스터마이징과 관리자 패널 2부 마지막에서 “AI가 매일 자동으로 글을 올린다”고 했습니다. 이번 편은 그 무인 자동화 라인을 통째로 열어 봅니다. 사람이 잠든 밤사이 이 사이트에서는 세 개의 톱니바퀴가 맞물려 돌아갑니다. 하나씩…

  • |

    사이트 제작기 4부 – 디자인 커스터마이징과 관리자 패널

    사이트 제작기 시리즈 · 1부 — 왜 정적 홈페이지인가 / 2부 — 콘텐츠 3구역 / 3부 — 자동화 파이프라인 / 4부 (이 글, 완결) — 커스터마이징과 관리자 패널 1부에서 “Hugoplate 테마를 바닥부터 만들지 않고 가져와 필요한 부분만 고쳐 썼다”고 했습니다. 이번 완결편은 바로 그 길들이기(커스터마이징) 이야기입니다. 남이 만든 옷을 사서 내 몸에 맞게 수선한 셈인데,…

  • |

    홈페이지 구축 기초 개념 이해하기

    홈페이지 구축 기초 개념 이해하기 도메인, 호스팅, 그리고 홈페이지를 만드는 여러 가지 방법 이 챕터는 본 강좌(Hugo + GitHub + Cloudflare Pages)를 시작하기 전에 알아두면 좋은 배경지식을 다룹니다. 미국 거주자 기준으로 설명하며, 한국의 서비스도 함께 언급합니다. 🎯 목표 홈페이지가 인터넷에 존재하기 위해 필요한 3요소(도메인, 호스팅, 사이트)를 구분할 수 있다. 도메인을 어디서 어떻게 구입하는지, 무엇을 주의해야…

  • |

    개인 홈페이지 제작부터 도메인 연결까지: 전 과정 따라하기 매뉴얼

    🚀 개인 홈페이지 제작부터 도메인 연결까지: 전 과정 따라하기 매뉴얼 이 문서는 Hugo 정적 사이트를 GitHub에 올리고, Cloudflare Pages로 무료 배포한 뒤, 내 도메인(ccumgol.net)으로 서비스하기까지의 전 과정을 초보자가 따라 할 수 있도록 정리한 매뉴얼입니다. 로컬 개발 환경과 프로젝트 구조에 대한 기초는 manual.md를, 이 과정에서 실제로 겪은 문제들은 issue-report.md를 함께 참고하세요. 0. 전체 그림 이해하기 먼저…

  • |

    AI 에이전트로 정적 홈페이지 완성하기 — 단계별 명령문 가이드

    AI 에이전트로 정적 홈페이지 완성하기 — 단계별 명령문 가이드 대상: Claude Code, Google Antigravity 등 “명령(프롬프트)만으로 일하는” AI 코딩 에이전트 목표: 폴더 지정 → plan.md(Gemini Gems) → Hugo 사이트 제작 → GitHub 연동 → Cloudflare 빌드 → 도메인 연결까지, 명령문 순서대로 따라 하면 완성 스택: Hugo(Extended) + GitHub + Cloudflare Pages 1. 큰 그림: 에이전트가…

  • |

    정적 홈페이지 관련 용어사전

    🔗 https://prod-files-secure.s3.us-west-2.amazonaws.com/68046b18-ba21-4ad4-9672-0fbf6e4e4664/d08ba9e8-0db9-49bc-adc1-6496bd92235d/%E1%84%8C%E1%85%A5%E1%86%BC%E1%84%8C%E1%85%A5%E1%86%A8_%E1%84%92%E1%85%A9%E1%86%B7%E1%84%91%E1%85%A6%E1%84%8B%E1%85%B5%E1%84%8C%E1%85%B5_%E1%84%86%E1%85%A1%E1%86%AB%E1%84%83%E1%85%B3%E1%86%AF%E1%84%80%E1%85%B5__%E1%84%8E%E1%85%A9%E1%84%87%E1%85%A9%E1%84%8C%E1%85%A1_%E1%84%8B%E1%85%AD%E1%86%BC%E1%84%8B%E1%85%A5%E1%84%8C%E1%85%B5%E1%86%B8__%E1%84%80%E1%85%A2%E1%84%82%E1%85%A7%E1%86%B7_%E1%84%8C%E1%85%B5%E1%84%83%E1%85%A9.html?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=ASIAZI2LB466VM5NRI4Z%2F20260701%2Fus-west-2%2Fs3%2Faws4_request&X-Amz-Date=20260701T055704Z&X-Amz-Expires=3600&X-Amz-Security-Token=IQoJb3JpZ2luX2VjEAsaCXVzLXdlc3QtMiJGMEQCIAOhm9MfLbHvc%2BIQ%2BZ7O5fdrs6ZPjIRTryICFGeNb%2FC4AiArBqDBklemQSnyQPm%2FDhd8Q3nh2Is7lMeI9WgEql%2F1NSqIBAjU%2F%2F%2F%2F%2F%2F%2F%2F%2F%2F8BEAAaDDYzNzQyMzE4MzgwNSIMVVTH3BnG36%2FBa%2B9qKtwDU64ZIRulJtLd5LMJPZNG165WOO2XfwOquC6wgD%2BReMRcH%2B176a6FbAgHVBVfedUpNwvkvRTnmSOTYSks6HOjm1P4acSu03OGHlCSVmObKzqXo9pjwCpAjybsT1rIO7KrVyhE6qXil2w1gFcl%2FZ0p8GPV3l6UXgB7nPZ9V%2BcoySBCbzSfTjMlNTKDy9zmBW79xWul6JMCu4f%2FT4rSL4quHESCPeNhCuZPvWVdJFLOfE92c4dDOkgQFxLKzGicUK%2F%2Fknut6o7oqAIP5dfnoq9TKBv7dRWLVRleQlb2ztmuSShFjWNPd4HGqZ2fG97d3Cizn9vg0y0zoZNDzib2gHEHUfVnTZOY%2FBkWgmwlz7w3qKhJs5aZI%2BRJ%2FZgBiwqC4UJtsi594ZqXwa9kxRdzhPeLe%2B1CdMZ6dRitZIcbH%2BoV77qWGoNdrjwfnQo3%2BmYDnu8G%2BcKmbt5HZ3heHqDbLQxDVTcS4I40uwslYk%2Bt57%2F3KXICuX%2BP2wktYTo%2BySihFKYYINNnAykP5k%2F5fLVAq8gQBOpaa6f0TkIkZhijmUJcBjVwvYc77eJNocEGYnARgGb3JHprvnMrKn2Ma9wtu52uOGJi4SMBzznsDWetOtYotrcmjFqc51Nn6gg4cbQw3oSS0gY6pgGgyyAKpmkSen%2B4Mt5wlt%2FQmO0lwaEnMR3jo2f%2BSvVGv2A6zRWNKqPC%2F3hNNqyHuKkvXum56mdal%2BUoexW%2FX6Dh94Zo82xs2yumd2qwER97tjfzYlYJm0kTVuv3LSlZIHx6uvqKQHu6jKTL3z6vvXpWhVFUHkbirsPU46b6f2QHXOzknHc9Pm9wS%2FyoOFVg7CcUMP6%2Fngr543AcPogxdOPzFyBjrAwv&X-Amz-Signature=f232b7955b78510880dcd4df288d78fff98096dfba315a62a77fc4a967ca5156&X-Amz-SignedHeaders=host&x-amz-checksum-mode=ENABLED&x-id=GetObject 1. 가장 먼저 알아야 할 큰 개념 정적 홈페이지 (Static Website)미리 다 만들어 놓은 완성된 페이지를 그대로 보여주는 방식의 홈페이지. 식당으로 치면 “이미 만들어 놓은 도시락”을 그대로 내주는 것과 같습니다. 방문자가 누구든 똑같은 페이지를 빠르게 받아 봅니다. 동적 홈페이지 (Dynamic Website)방문자가 접속할 때마다 그 자리에서 페이지를 새로 만들어 보여주는 방식. “주문 받고 즉석에서…

  • |

    정적 홈페이지 Hugo용 추천 테마

    추천 Hugo 테마 27선 (블로그, 포트폴리오 및 범용, 2026년 최신 기준) 블로그, 개인 포트폴리오, 그리고 다양한 목적의 웹사이트 구축에 두루 적합하면서도, 깃허브 등에서 활발하게 유지보수되고 있는 무료 오픈소스(MIT 라이선스 등) Hugo 테마들을 엄선했습니다. 작성 배경 및 출처:이 문서는 Notion AI, Gemini, Grok, ChatGPT, Claude, Perplexity 등 주요 최신 AI 서비스들에서 각각 10개씩 추천받은 결과를 바탕으로,…