이 영상은 레플릿(replit)과 깃허브(github)를 연동하여 서비스를 무료로 배포하는 방법을 다룹니다. 특히, 레플릿에서 개발한 코드를 깃허브로 푸시하고, 클라우드플레어(cloudflare) 또는 넷틀리파이(netlify)와 같은 서비스를 활용하여 저렴하게 배포하는 과정을 상세히 설명하며, 실시간 업데이트 기능까지 시연합니다.

1. 레플릿과 깃허브 연동의 필요성 및 장점

•

레플릿에서 개발한 코드를 깃허브와 연동하면, 코드 보관과 협업이 쉬워짐 깃허브는 개발자들이 코드를 저장하고 협업할 수 있는 공간임

•

깃허브에 연동된 코드는 커서, VS 코드 등 다양한 개발 툴과도 쉽게 연결 가능

•

배포를 레플릿에서만 하는 것이 아니라, 깃허브에 저장된 코드를 다른 서비스(예: 클라우드플레어, 넷틀리파이)로 연동해 배포할 수 있음 레플릿에서는 코드 수정 및 개발만 하고, 배포는 깃허브를 거쳐 외부 서비스에서 진행 가능 예시: 클라우드플레어, 넷틀리파이 등에서 깃허브 코드를 연동해 배포

•

클라우드플레어나 넷틀리파이에서 배포하면 비용이 저렴해 많은 사용자가 서비스를 이용해도 부담이 적음

•

**핵심:**레플릿-깃허브-외부 서비스(클라우드플레어 등) 연동으로 개발, 협업, 배포까지 효율적으로 진행 가능

2. 링크트리 클론 서비스 제작 및 레플릿에서 코드 준비

•

예시로 링크트리 클론 서비스를 제작함 레플릿에 링크트리 서비스 설명 프롬프트 입력 및 실행 결과물에 대해 직접 수정(버튼, 프로필 사진, 링크 등)

•

제작 과정은 빠르게 넘어감

3. 레플릿과 깃허브 연동 방법

•

레플릿 왼쪽 메뉴에서 '올툴즈' 클릭 후 '기술' 클릭

•

세팅 안내문구가 나오면 클릭

•

'깃허브와 연동' 클릭 시 깃허브 로그인 페이지로 이동 로그인 후 권한 승인하면 연동 완료

•

레플릿으로 돌아와 새로고침 후 안내문구 클릭

•

레포지토리 이름과 설명 입력 후 생성 깃허브에서 프로젝트 폴더가 생성됨

•

깃허브에서 레포지토리 생성 확인 가능

•

레플릿에서 '푸시브랜치' 버튼 클릭 레플릿에서 만든 코드가 깃허브레포지토리에 모두 푸시됨

•

이로써 레플릿과 깃허브연동 완료

4. 깃허브와 클라우드플레어 연동 및 배포 방법

•

클라우드플레어 로그인 후, 왼쪽 메뉴에서 '워커스 앤 페이지' → '페이지스' → '깃허브연동' 클릭

•

깃허브와 연동하면, 원하는 레포지토리 선택 후 다음 단계로 진행

•

개발 언어나 프레임워크에 따라 명령어가 다르므로, 레플릿 어시스턴트에게 문의 권장 예시: HTML로만 만들었을 경우 별도 입력 없이 진행 가능

•

설정이 끝나면 배포 완료, 제공된 링크에서 서비스 확인 가능

•

레플릿에서 코드 수정 후, 깃허브푸시 버튼을 누르면 클라우드플레어에서 자동으로 실시간 배포됨

5. 마무리 및 참고사항

•

레플릿, 깃허브, 클라우드플레어연동을 통해 서비스 배포까지 진행 가능함을 시연

•

깃허브와 연동하면 다양한 외부 서비스와 연결 가능하므로 참고할 것

•

궁금한 점은 댓글이나 오픈 톡방에서 질문 가능

•

구독과 좋아요 요청 및 마무리 인사

Made with Slashpage