본문 바로가기
개발 공부/expo

Expo / 하이브리드 앱 & 웹앱 개발 초기 셋팅

by 루아-흐 2024. 4. 17.
반응형

1. Expo 회원가입

 

Sign Up — Expo

Create an account for Expo here.

expo.dev

하이브리드 어플제작을 위해 Expo에 회원가입!

 

2. 개발 컴퓨터에 Expo 로그인 진행

npx expo login
...
expo 이메일 or 아이디, 패스워드 입력 입력하면 로그인 완료!

윈도우는 cmd 맥은 terminal에서 명렁어를 치고 엑스포에 로그인 합니다.

 

3. 비주얼 스튜디오 코드에서 앱 개발 관련 기본 셋팅 진행

npx create-expo-app 앱이름 //npx create-expo-app 명령어로 기본 앱 생성

터미널에서 개발할 앱 이름의 폴더를 만든 후 기본틀 셋팅이 진행됩니다.

npx로 원격에 있는 명령어들 중 create-expo-app을 사용해서 앱을 초기화 진행

(npx:  npm에서 제공하는 명령어/툴입니다. 특정 기능을 사용하기 위해 내 컴퓨터 전체에 해당 기능 다발을 설치하지 않고, 필요한것만 원격에서 꺼내쓰는 가벼운 명령어 도구입니다.)

 

4. Expo 앱 실행

cd 앱폴더명 //expo 연결을 위해 앱 작업 폴더 명으로 이동

cd는 change directory의 약자로 입력한 폴더명으로 이동하는 명령어입니다

npx expo start //npx expo start로 Expo 앱 실행

명령어는 expo 서버를 킨 것과 동일하며 현재 개발하고 있는 앱을 실행시킨다는 뜻과 같습니다.

(안드로이드 아이폰 스토어에서 Expo Go 다운로드 후 연결 된 것을 확인합니다 - 단, 같은 와이파이 안에 있어야 함)

 


아이폰 어플 설치 - Expo

 

‎Expo Go

‎Start building projects using web technologies with just your iOS device and your computer. Expo is a developer tool for creating experiences with interactive gestures and graphics using JavaScript and React. Note: some programming experience is recomme

apps.apple.com

안드로이드폰 어플 설치 - Expo

 

Expo - Google Play 앱

Expo는 JavaScript 및 React를 사용하여 앱을 제작하는 무료 및 오픈 소스 플랫폼입니다.

play.google.com

Expo 빌드 관련 참고 

 

Create your first build

Learn how to create a build for your app with EAS Build.

docs.expo.dev

 

Expo 웹뷰 만들기 관련 참고 

 

WebView

A library that provides a WebView component.

docs.expo.dev

 

반응형

'개발 공부 > expo' 카테고리의 다른 글

Expo / 기본 셋팅 파일 설명  (1) 2024.04.19