React Native9 🥈 리액트 심화 개념 1. useEffect: 컴포넌트의 라이프사이클 제어useEffect()는 컴포넌트가 렌더링된 이후에 실행되는 코드를 작성할 때 사용합니다.ex) API 호출, 이벤트 등록, 타이머 설정 등✅ 의존성 배열이란?useEffect(() => { // effect 내부 코드}, [의존성]);이 배열에 있는 값이 변할 때마다 useEffect 내부 코드가 실행됩니다.🧠 상황별 정리1. [] (빈 배열)useEffect(() => { console.log('✅ 마운트될 때만 실행'); return () => { console.log('🧹 언마운트될 때 정리'); };}, []);컴포넌트가 처음 렌더링될 때 한 번만 실행배열 안에 아무 의존성도 없으므로, 이후 업데이트 시 실행되지 않음return은.. 2025. 6. 20. 🥇 리액트 기본기 (반드시 알아야 할 핵심) 1. JSXJSX는 JavaScript XML의 약자로, JavaScript 안에 HTML을 작성할 수 있는 문법입니다.JSX 덕분에 UI 구조를 선언형으로 표현할 수 있어, 코드의 가독성이 좋아집니다.const name = '개발자';return Hello, {name}!;위 코드는 문자열 변수 name을 HTML 구조 내에서 바로 사용할 수 있게 해줍니다.2. 컴포넌트컴포넌트는 UI의 독립적인 단위입니다. 리액트는 컴포넌트를 조립해서 화면을 구성합니다.보통 함수형으로 작성되며, 각 컴포넌트는 자신만의 props와 state를 가질 수 있습니다.function Welcome(props) { return Hello, {props.name};}이처럼 함수 하나가 하나의 화면 조각(UI)를 구성합니다.3... 2025. 6. 20. Query vs Mutation Query vs Mutation 2025. 6. 20. 코드 푸쉬 https://github.com/microsoft/react-native-code-push GitHub - microsoft/react-native-code-push: React Native module for CodePushReact Native module for CodePush. Contribute to microsoft/react-native-code-push development by creating an account on GitHub.github.com https://github.com/Soomgo-Mobile/react-native-code-push GitHub - Soomgo-Mobile/react-native-code-push: Seamless transition from AppCen.. 2025. 6. 20. React Native IOS 기본 명령어 캐시 정리 및 의존성 정리watchman watch-del-allrm -rf node_modulesrm -rf ios/Podsrm -rf ios/Podfile.lockrm -rf ~/Library/Developer/Xcode/DerivedDatanpm cache clean --forcenpm installcd iospod install --repo-updatecd .. ✅ 4. Xcode에서 다시 열기open ios/CheongjeongEarth.xcworkspace 2. 의존성 재설치rm -rf ios/Pods ios/Podfile.lockcd iospod install --repo-updatecd .. cd ios && pod install && cd ..cd ios && rm -rf Pods P.. 2025. 6. 17. 애니메이션과 useNativeDriver useNativeDriver: true, 2025. 6. 5. KeyboardAvoidingView + ScrollView VS keyboardAwareScrollView 차이 ㄷㅈㄷ 2025. 6. 5. Mac에서 React Native CLI로 개발 환경 구축하기 React Native 프로젝트를 React Native CLI 방식으로 세팅하면서 겪은 문제들과 해결 과정을 정리합니다.Expo가 아닌 Native 기반 프로젝트(ios/android 디렉토리 포함)가 필요할 때 사용합니다.✅ 1. React Native CLI 프로젝트 생성 전 기본 확인Node 버전 확인node -v # v20.19.2 (권장: 18.x ~ 20.x)✅ 2. 예전 react-native-cli 삭제 (필수)react-native-cli는 더 이상 사용하지 않습니다. 남아있으면 충돌이 발생합니다.npm uninstall -g react-native-cli sudo rm -rf /usr/local/lib/node_modules/react-native-cli ✅ 3. React Nativ.. 2025. 5. 30. Redux 개념 정리 (Android 개발자 관점에서 이해해보자!) React Native나 React를 공부하다 보면 종종 등장하는 개념이 바로 Redux다. 처음 봤을 땐 생소할 수 있지만, Android 개발자 입장에서 접근하면 훨씬 쉽게 이해할 수 있다. 이 글에서는 Redux의 개념부터 구조, 그리고 Android의 MVVM 패턴과 비교하며 설명해보겠다.✅ Redux란?Redux는 앱의 상태(state)를 중앙에서 예측 가능하게 관리하는 라이브러리다.컴포넌트마다 useState를 쓰다 보면 상태가 꼬이고 공유가 어려워진다. Redux는 이를 해결하기 위해 모든 상태를 하나의 중앙 저장소(Store)에 모으고, 상태 변경도 명확한 흐름을 통해서만 가능하도록 만든 구조다.🔧 Redux 기본 구성 요소Redux는 다음과 같은 4가지 핵심 개념으로 구성된다.구성 요소.. 2025. 3. 12. 이전 1 다음