본문 바로가기

rn7

노마드코더 리액트 네이티브 입문 - 마지막 https://github.com/viromedia/viro GitHub - viromedia/viro: ViroReact: AR and VR using React Native ViroReact: AR and VR using React Native. Contribute to viromedia/viro development by creating an account on GitHub. github.com VR 용 리액트 네이티브를 만드는 팀, 컴포넌트를 활용하여 VR 제작도 가능 웹에 배포하기 npm install gh-pages 그리고 아래 코드를 package.json의 script 에 추가 (강의에 나온 expo build:web 대신 npx expo export:web 으로 변경 됨) "deploy".. 2023. 6. 2.
노마드코더 리액트 네이티브 입문 - 6 Alert API https://reactnative.dev/docs/alert Alert · React Native Launches an alert dialog with the specified title and message. reactnative.dev Alert.alert() 말고도 Alert.prompt() 도 존재한다. (only iOS) Alert.prompt('Title', 'Message'); 입력 받은 값을 활용해줄 수 있다. 일단 기본적인 강의는 여기까지이다. 코드 챌린지 기본적으로 수정기능과 완료기능을 넣기 위해서 삭제 버튼 옆에 버튼들을 추가해주었다. 그리고 섹션을 나눠주기 위해서 flex 사이즈로 내용 부분과 버튼 부분의 레이아웃을 만들었다. 1. 수정 기능 수정 기능을 처음에는.. 2023. 5. 31.
노마드코더 리액트 네이티브 - 5 지금껏 입력 받은 내용을 onSubmitEditing 이벤트로 returnKey 입력을 감지하여 object 에 담아줬다. 이 값을 todos 에 객체 형태로 저장하고 Date.now() 를 키로 전개시켰는데 {Object.keys(todos).map((el, idx) => { return ( {idx+1}. {todos[el].text} ); })} 이렇게 object에 유일한 키로 저장한 값은 Object.keys(객체) 로 키 전체를 반환하는 배열을 받아줄 수 있으며, 이를 통해서 map 으로 반복문을 돌린다. 이때 map 의 값은 키로 받아온 것들이므로 todos에 대괄호로 키에 직접 접근해주고 text 내용을 받아온다. 이제 travel 의 값도 todo와 동일하게 처리해주면 된다. {Objec.. 2023. 5. 30.
노마드코더 리액트 네이티브 입문 - 4 Todo 와 여행 기록 앱 만들기 1. theme을 만들어서 컬러를 미리 저장해두기 관리를 위해서 utils 안에 만들어둠 export const theme = { bg : 'black', gray : '#3a3d40', } 그리고 스타일부분에 하드코딩 대신 적용시켜주기 const styles = StyleSheet.create({ container : { flex: 1, backgroundColor: theme.bg, paddingHorizontal: 20, }, header : { flexDirection: 'row', justifyContent: 'space-between', marginTop: 70, }, btnText : { color : theme.gray, fontSize : 38, font.. 2023. 5. 29.