vscode 콘솔에서 d 를 눌러 개발자 웹으로 가서 Publish 라고 적힌 부분을 찾자. 클릭을 하게 되면 기본적으로 expo 웹사이트에 내 JS 코드가 공유가 된다.
클릭을 하고 app 이름 url 그리고 github 주소 (optional) 을 입력해주면 된다. easy
작업이 진행되는 동안 일어나는 일은 코드를 압축하고, 사진이 있다면 사진도 압축하고 등의 작업이다. 운영체제와 대화하고 있는 React.JS 를 일반적인 JS 로 변환시키고 있고 그러고 나면 이 코드는 expo 서버에 upload 될 것이다. 이 기능이 매우 유용한 것은 expo 로 작업을 하고 있다가 팀원들 혹은 고객에게 미리보기를 제공할 수 있다는 것이다.
링크로 들어가 expo 앱을 다운 받기만 하면 말이다.
실행이 안되는 경우가 있는데 try / cath를 JSON parse 구문 주위에 해주어야 한다.
react native web 의 존재
안드로이드, iOS 그리고 웹 까지 React Native 로 개발이 가능하다.
코드에는 몇 가지 버그가 있다. 이를 수정해야 한다.
무슨 버그냐면 AsyncStorage 에 값이 null 인 경우가 있기 때문이다.
위의 두가지를 수정해 주자.
const saveToDos = async (toSave) => {
try {
await AsyncStorage.setItem(STORAGE_KEY, JSON.stringify(toSave));
} catch (e) {}
};
const loadToDos = async () => {
try {
const s = await AsyncStorage.getItem(STORAGE_KEY);
return s !== null ? setToDos(JSON.parse(s)) : null;
} catch (e) {}
};
React Native web 의 경우 AsyncStorage 를 localstorage도 지원해준다. 놀라운 일이다.
우리가 입력해준 View 자동으로 div 로 변환해주고
새롭게 추가한 ToDo는 자동적으로 HTML로 변환해준다.
Alert 는 React Native Web 에서는 동작하지 않기 때문이다.
이는 해결할 것이다.
그래도 지금으로서는 이게 얼마나 멋진 일인지 알았으면 좋겠다.
하나의 코드로 3개의 플랫폼에서 앱을 만들 었으니 말이다. iOS, Android, mobile WebSite
