Cloudflare 인스턴스 생성 가이드

##Kiro - GitHub 연동 단계

Kiro 프리티어는 Git Hub 직접 연동 안됨 터미널 사용 필요

##Git 설치 Windows 11 26H2 winget install –id Git.Git -e –source winget

powershell

1. 버전 확인 (정상 설치 및 환경변수 적용 확인)

git –version

2. 깃허브 사용자 이름 등록 (본인 깃허브 ID 혹은 이름)

git config –global user.name “본인의_깃허브_이름”

3. 깃허브 이메일 등록

git config –global user.email “본인의_깃허브_이메일”

원하는 작업 경로 위치 Powershell 에 레포지토리 복제 git clone https://github.com/ex

Kiro와 연동하여 작업하기 git add . git commit -m “Kiro 작업 완료” git push origin main

##프론트엔드(블로그) 선정

1. 🚀 Astro (현재 전 세계 트렌드 / 최신 엔진이라서 고름 7버전) • 언어: JavaScript / TypeScript • 특징: 현재 마크다운 기반 콘텐츠(블로그, 문서) 사이트 생성기 중 가장 인기 있는 도구입니다. 필요한 부분에만 최소한의 자바스크립트를 전송하는 구조(Islands Architecture) 덕분에 웹사이트 속도가 Hugo만큼이나 엄청나게 빠릅니다. • 추천: 자바스크립트에 조금이라도 익숙하고, 나중에 예쁜 컴포넌트나 기능을 자유롭게 추가하고 싶을 때 좋습니다.

• Hugo/Zola 도 고민했음 : 자바스크립트를 전혀 쓰지 않는 무조건적인 ‘정적 텍스트’ 중심의 출력을 지원하므로 호스팅 서버(Cloudflare Pages 등)의 성능을 100% 끌어다 씁니다.

인스톨 방법 winget install OpenJS.NodeJS.LTS

npm create astro@latest – –template starlight -난 스타라이트 테마로 고름

##클라우드 플레어 연동

이 모든 도구는 Cloudflare Pages, GitHub Pages, Netlify 등의 글로벌 CDN(전 세계 분산 서버) 호스팅을 무료로 지원합니다. 따라서 어떤 툴을 고르시든 일반 워드프레스(WordPress)나 네이버 블로그보다 최소 3배 이상 빠른 속도를 자랑합니다.

현재 화면에서 다른 곳으로 빠져나와 진짜 Pages(정적 호스팅) 메뉴로 진입해야 합니다.

1. Pages 메뉴로 강제 이동하기

• Cloudflare 대시보드 왼쪽 사이드바 메뉴에서 [Workers & Pages (또는 Compute)] ➡️ [Overview (개요)]나 [Workers & Pages] 메인 글자를 다시 클릭합니다. • 화면에 파란색 [Create (프로젝트 생성)] 버튼이 보이면 클릭합니다. • 그 다음 화면 상단에 [Workers] 탭과 [Pages] 탭 두 개가 나란히 보일 텐데, 반드시 오른쪽의 [Pages] 탭을 마우스로 클릭해 주세요! • 그 아래에 있는 [Connect to Git (Git에 연결)] 버튼을 누릅니다.

2. 저장소 선택하기

• 화면에 GitHub 계정이 연동되어 나오고 아래 목록에 Cloudflare-Pages 저장소가 나타날 것입니다. • 해당 저장소를 선택하고 [Begin setup (설정 시작)] 버튼을 누릅니다.

3. ✨ 빌드 구성 값 입력하기 (가장 중요)

이제 Workers 메뉴가 아닌 진짜 Pages 빌드 창이 뜹니다. 아까 폴더 위치를 바꾸지 않으셨으므로 아래 값을 정확하게 수동으로 채워주셔야 합니다. • Framework preset (프레임워크 프리셋): Astro 선택 • Root directory (루트 디렉터리): Starlight/mad-main 입력 👈 (대소문자 똑같이 입력해야 Astro 파일들을 찾아냅니다!) • Build command (빌드 명령): npm run build (Astro 선택 시 자동 입력됨) • Build output directory (출력 디렉터리): dist (Astro 선택 시 자동 입력됨)

4. 배포 시작

• 맨 아래에 있는 [Save and Deploy (저장 및 배포)] 버튼을 클릭합니다.

1. 루트 디렉터리(고급): 입력창에 Starlight/mad-main 이라고 적어줍니다. • ⚠️ 대소문자(Starlight의 S, mad-main의 m)를 정확하게 똑같이 적어주셔야 오류가 안 납니다!
2. 나머지 값은 지금 상태 그대로 두시면 됩니다: • 프레임워크 미리 설정: Astro • 빌드 명령: npm run build

##기본 위치 파일

• index.mdx: 웹사이트의 첫 메인 화면(홈페이지) 파일입니다. • guides/example.md: 예시로 들어있는 가이드 글 파일입니다.