![[React Native] Codepush Standalone 구축하기 - 고급편](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2F6znra%2FbtsL8Mh9bu7%2FSsBERNtjRm7ynVQE5TCej0%2Fimg.png)
안녕하세요! RyuWoong 입니다.
이번에 기본편에 이은, 고급편! 되겠습니다.
Codepush Standalone 문서에서 가이드 하는 대로 Azure로 구축하는 것을 진행해보도록 하겠습니다.
code-push-server/api/README.md at main · microsoft/code-push-server
Standalone CodePush server from App Center. Contribute to microsoft/code-push-server development by creating an account on GitHub.
github.com
위 링크를 함께 참조하면서 따라오길 추천합니다!
Azure 설정하기.
먼저 Azure에 가입하고 무료계정을 만듭니다.
Azure 무료 계정 또는 종량제 만들기 | Microsoft Azure
Azure 계정을 만들어 애플리케이션을 만들고, 배포하고, 관리하기 위한 확장성 있고 비용 효율적인 서비스를 시작합니다.
azure.microsoft.com
이후 가이드에 CLI로 가이드를 주니 우리도 CLI로 하기위해 Brew를 통해 Azure CLI를 설치해줍니다.
brew install azure-cli
이후 문서에 적힌 Step을 한단계씩 밟아 보겠습니다.
az login
// Azure 로그인
az account set --subscription <subscription-id>
// 아마 처음 사용자라면, 기본적으로 아래와 같은 subscription을 제공합니다.
// az account set --subscription "Azure subscription 1"
az group create --name <resource-group-name> --location <az-location eg. eastus>
// 그룹을 생성해요, 이름은 아무거나 하셔도 되고, 지역은 다양하게 있는데 국내는 "Korea South" (부산) 과 "Korea Central" (서울) 이 있습니다.
// az group create --name codepush --location "Korea Central"
az deployment group create --resource-group <resource-group-name> --template-file ./codepush-infrastructure.bicep --parameters project_suffix=<project-suffix> az_location=<az-location eg. eastus> github_client_id=<github-client-id> github_client_secret=<github-client-secret> microsoft_client_id=<microsoft-client-id> microsoft_client_secret=<microsoft-client-secret>
// 그룹 내 필요한 리소스를 생성해요, webapp, storage, price 정책을 생성합니다.
// az deployment group create --resource-group codepush --template-file ./codepush-infrastructure.bicep --parameters project_suffix=server az_location="Korea Central" github_client_id=Ov23liYPashQs2hX3QnX github_client_secret=41a4a390948cbbb7814c2c6ac0cbc69242c6bad7
마지막 명령어는, parameter 입력 받은 것을 포함합니다. 만약 추가적인 parameter를 요구하더라도 차후에 수정이 가능하니 당황하지 말고, 아무거나 입력하시면 됩니다. 또 githubOAuthApp 나 MicrosoftOAuthApp 설정을 알맞게 수정해줘야하는거 잊지마세요!
여기까지 완료하면, Azure Resource Group과 그 하위에 WebApp 및 Storage가 생성된 걸 확인할 수 있는데요.
이렇게 되면, Codepush 서버의 기본적은 구성은 완료 됐다고 할 수 있습니다. WebApp에 API서버를 배포해보도록 하겠습니다.
WebApp의 기본 설정으로 Local git을 통해 deploy 할 수 있게 되어 있습니다. 따라서, Codepush Server 루트 디렉토리에서, 아래와 같이 입력해 WebApp에 push하여 deploy 되게 해줍니다.
git remote add azure https://<app-name>.scm.azurewebsites.net/<app-name>.git
// WebApp이름을 넣으면 됩니다.
git push azure main
// azure에 main브런치를 push합니다.
위 명력어를 입력하면, 루트 디렉토리에 있는 deply.sh를 읽어들여 서비스가 배포됩니다.
이후 기본편에 알려드렸던 대로, 아래 명령어를 통해 계정을 생성하고 codepush를 사용할 수 있습니다!
code-push-standalone register https://<app-name>.azurewebsites.net
// 계정을 생성합니다.
이렇게 하면, Codepush Standalone 서버를 구축할 수 있습니다.
생각보다 단순한데, 인프라 지식을 요구해서 처음 접하는 분들은 막막할 수 있다는 생각이 드네요.
회사에서는 DevOps분이 계셔서, AWS S3를 이용하여 구축했습니다.
GitHub - nmengual/code-push-server: Standalone CodePush server from App Center
Standalone CodePush server from App Center. Contribute to nmengual/code-push-server development by creating an account on GitHub.
github.com
AWS S3를 사용하는 방식은 위 레포를 활용하였습니다. 조금 변형해서 하긴 했지만, 일반적으로 EC2 하나를 사용해서 구현하면 수월하게 구축할 수 있지 않을까 생각합니다.
구축 관련 내용은 인프라에 관핸 내용을 주로 이뤄 여기서는 다루지 않으려합니다. 만약 기회가 있다면 따로 이야기 하도록 하겠습니다.
대안
Codepush 말고도 다른 대안이 있습니다.
1. Expo로 전환
Expo Application Services (EAS)
Deeply integrated cloud services for Expo and React Native apps, from the team behind Expo.
expo.dev
기본 RN을 Expo로 마이그레이션 하는 것입니다. expo에는 EAS라는 서비스가 있어 Codepush 대신 이용가능합니다.
다만 공수가 많이 들 수 있습니다. 그래도 먼 미래를 고려하면 나쁘지 않은 선택지 일 수 있습니다.
2. Hot Updator
Hot Updater
Support New / Old ArchitectureCompatible with both the new and old React Native architectures, offering maximum flexibility for your projects
gronxb.github.io
두 번째는 Codepush 대신 사용할 수 있는 라이브러린데, 국내 개발자분이 제작 및 관리 하시고 계신 라이브러리입니다.
문서도 깔끔하게 잘 되어 있고, 무엇보다도 Supabasse, Clouflare를 지원함으로 비용이나 난이도 측면에서 Codepush를 구축하는 것보다 쉬울수 있다고 생각합니다.
'Front-End > React Native Issue' 카테고리의 다른 글
[React Native] Codepush Standalone 구축하기 - 기본편 (0) | 2025.01.11 |
---|---|
[React Native] Focus Input을 따라 Scroll하기 (0) | 2024.08.30 |
[React Native] React Native IDE (0) | 2024.05.15 |
[React Native] Xcode 15.3 버전 이후 Build 시 Flipper Error (0) | 2024.03.24 |
[React Native] React Native 환경 변수 설정 하기. (0) | 2024.02.28 |
삽질의 기록과 일상을 남기는 블로그입니다. 주로 React Native를 다룹니다.
포스팅이 좋았다면 "좋아요❤️" 또는 "구독👍🏻" 해주세요!