GitHub Pages에서 파일 다운로드 링크 만들기
GitHub Pages는 정적 웹사이트를 무료로 호스팅할 수 있는 강력한 도구입니다. 이번 글에서는 GitHub Pages에 파일을 업로드하고, 사용자가 해당 파일을 URL을 통해 다운로드할 수 있도록 링크를 제공하는 방법을 소개합니다. 또한, 여러 파일을 ZIP으로 묶어 한 번에 다운로드할 수 있도록 설정하는 방법도 설명합니다.
1. 준비물
2. 프로젝트 디렉터리 구성
예제에서는 PDF 파일과 이미지 파일을 업로드하고, 이를 HTML 페이지에서 다운로드할 수 있도록 링크를 제공합니다.
mywebsite/
├── index.html # 메인 페이지 (다운로드 링크 제공)
└── resources/ # 리소스 저장 폴더
├── sample.pdf # PDF 파일
└── image.jpg # 이미지 파일3. 프로젝트 설정 및 파일 준비
- 로컬 컴퓨터에 프로젝트 폴더 생성:
- mkdir mywebsite cd mywebsite mkdir resources
- resources 폴더에 파일 준비:
- PDF 파일(sample.pdf)과 이미지 파일(image.jpg)을 resources 폴더에 넣습니다.
4. HTML 페이지 작성 (다운로드 링크 포함)
프로젝트 폴더 내에 index.html 파일을 생성하고, 다음 코드를 작성합니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Download Files</title>
</head>
<body>
<h1>Download Resources</h1>
<ul>
<li><a href="resources/sample.pdf" download>Download PDF</a></li>
<li><a href="resources/image.jpg" download>Download Image</a></li>
</ul>
<p>Click the links above to download the files.</p>
</body>
</html>5. Git 저장소 초기화 및 파일 커밋
1. 터미널에서 프로젝트 디렉터리로 이동:
cd mywebsite
2. Git 저장소 초기화:
git init
3. 파일을 Git에 추가 및 커밋:
git add .
git commit -m "Initial commit with resources and index.html"6. GitHub에 푸시하기
1. GitHub에서 새 저장소 생성:
- 저장소 이름: yourusername.github.io
- 공개 저장소로 설정합니다.
2. 원격 저장소와 연결:
git remote add origin https://github.com/yourusername/yourusername.github.io.git
3. 파일 푸시:
git push -u origin master7. GitHub Pages 설정
- GitHub 저장소로 이동:
https://github.com/yourusername/yourusername.github.io - Settings > Pages 메뉴로 이동합니다.
- Source에서 master 브랜치를 선택하고 Save를 누릅니다.
8. 다운로드 링크 테스트
1. 브라우저에서 GitHub Pages 사이트 열기:
https://yourusername.github.io/"Download Resources" 페이지가 표시되면, PDF와 이미지 파일 링크를 클릭해 파일이 정상적으로 다운로드되는지 확인합니다:
2. PDF 다운로드:
https://yourusername.github.io/resources/sample.pdf
3. 이미지 다운로드:
https://yourusername.github.io/resources/image.jpg9. 여러 파일을 ZIP으로 묶어 다운로드 제공하기
1. 폴더를 ZIP 파일로 압축:
cd resources zip -r resources.zip .
2. 압축한 ZIP 파일을 Git에 추가:
git add resources.zip git commit -m "Add ZIP file for bulk download"
3. 변경 사항 푸시:
git push origin master
4. HTML에 ZIP 파일 다운로드 링크 추가:
<li><a href="resources.zip" download>Download All Files (ZIP)</a></li>
5. 브라우저에서 다운로드 테스트:
ZIP 파일 다운로드:
https://yourusername.github.io/resources.zip10. 결론
이제 여러분은 GitHub Pages를 이용해 파일을 업로드하고 다운로드 링크를 제공하는 방법을 익히셨습니다.
- PDF, 이미지 등 개별 파일을 다운로드할 수 있고,
- 여러 파일을 ZIP 파일로 묶어 한 번에 다운로드할 수도 있습니다.
응용 아이디어
- 소프트웨어 설치 파일 제공
- 연구 자료 배포
- 포트폴리오 파일 다운로드 링크 제공
이 글이 유익하셨다면 댓글과 공유 부탁드립니다! 😊
추가로 궁금한 점이 있다면 언제든지 질문해 주세요!
태그
#GitHubPages #파일다운로드 #ZIP다운로드 #초보개발 #Git #웹사이트호스팅 #정적사이트
'임베디드 관련 카테고리 > Github' 카테고리의 다른 글
| Git을 활용한 버전 관리: v1.00과 v1.01 모두 유지하기 (1) | 2024.10.28 |
|---|---|
| 로컬 프로젝트를 GitHub에 업로드하는 방법 (0) | 2024.10.28 |
| GitHub Pages로 버전별 웹사이트 배포하기 (4) | 2024.10.27 |
| GitHub Actions 설정하고 실행 (Window) (0) | 2024.10.25 |
| GitHub의 PAT 저장 및 Git Credential Manager(GCM) 사용법 (1) | 2024.10.24 |
댓글