읽기 설정

자, 페우터에 이걸 배포하기 전에 분명히 하고 싶은 말이 있어요. 루미파이는 페우터.js를 사용하는 일반적인 웹 앱이기 때문에 어디든 배포할 수 있습니다.

vercel, 넷리파이, 깃허브 페이지즈. pewter.js는 어떤 웹사이트에서도 작동하기 때문에 pewter.com에만 국한되지 않습니다.

실제로 Vercel에 배포하는 것은 프로젝트를 GitHub에 푸시하고, vercel.com에 접속하여 새로운 프로젝트를 추가한 다음, 저장소를 가져오고, 환경 변수를 하나 추가하는 것만큼 간단합니다.

저희가 가지고 있던 변수를 처리하고 배포 버튼을 누르면 됩니다. 간단하게 몇 초 안에 앱이 라이브됩니다. 멋진 점은 pewter를 사용하시면 pewter.site 도메인과 함께 무료 호스팅 옵션도 이용하실 수 있다는 점입니다.

dot versell.app와 유사한 URL을 사용할 수 있으며, 더불어 pewter 앱 센터에 앱을 게시하여 pewter.com 사용자로부터 추가적인 노출을 얻고, 프로젝트를 통해 수익을 창출할 수 있는 방법도 제공됩니다.

자, 어떻게 하는지 보여드리겠습니다. 정말 간단해요. 우선, 코드 베이스 안에서 react-router-config.ts 파일로 들어가세요. 그리고 여기에서 SSR을 false로 바꿔야 합니다.

배포를 위해 pewter에 필요한 index.html 진입점을 가진 앱으로 빌드 스크립트가 생성되어야 합니다. 일단 그것이 끝나면, 간단히 npm run build를 실행하시면 됩니다.

이것은 어플리케이션의 최적화된 프로덕션 빌드를 생성할 거예요. 그리고 이 빌드 안에서 바로 생성될 거에요.

그럼 pewter.com으로 다시 돌아가세요. 여기로 이동해서 앱 센터를 클릭하여 앱 센터를 열어주세요. 앱 게시를 클릭하시면, 여기에서 Pewter를 통해 돈을 벌 수도 있다는 안내를 받으실 수 있습니다.

앱을 최대한 많이 게시해주세요. 그러면 검토를 받으시고, 승인된 앱이 사용자에게 열릴 때마다 수익을 얻게 됩니다.

자, 그럼 호스팅을 한번 확인해 보겠습니다. 현재 저희가 보유한 인스턴스 목록을 보실 수 있는데, 앱(apps) 메뉴에서 새로운 앱을 만들어서 '룸이파이(Roomify)'라고 이름을 지을 수 있습니다.

현재 제작되고 있습니다. 파인더 또는 파일 탐색기를 통해 폴더를 열어주시겠습니까.

그때쯤이면 앱이 생성된 것을 보실 수 있을 겁니다. 원하신다면 앱의 세부사항을 모두 수정하실 수 있고, 그 후에 드래그해야 합니다.

빌드 클라이언트의 내용을 드래그해서, 에셋, 파비콘, 그리고 인덱스 HTML만 포함되도록 해주세요. 빌드 폴더 자체는 아니고요, 클라이언트 안에 있는 내용물들만요.

그리고 배포를 클릭하면, 바로 배포될 거예요. 잠시만 기다려보세요. 그리고 여기 당신의 컴퓨터 안에서 바로 열릴 거예요. 펼쳐서 어떻게 보이는지 확인해볼 수 있고, 이건요.

정말 멋지게 보입니다. 마치 네이티브 모바일 앱처럼 느껴져요. 그리고 여기에서 새로운 프로젝트를 업로드할 수도 있습니다. 한번 테스트해 볼까요?

이걸로 할게요. 이제 리디렉션될 거예요. 네, 렌더링되고 있어요. 확대해서 바로 시각화 결과가 생성되는 것을 볼 수 있을 거예요.

정말 멋지네요. 이번에는 디자인이 조금 바뀌었는데, 굉장히 흥미롭습니다. 그리고 그걸 염두에 두고, 여러분의 앱이 이제 온라인으로 제공될 수 있게 되었어요.

Roomify2라는 이 주소로 가시면 되고요, 공유하시는 분들은 전체 화면으로 접속할 수 있습니다. 정말 좋네요. 시청해 주셔서 정말 감사합니다, 다음 영상에서 또 만나요.

좋은 하루 보내세요.