그랩 선생님, 좋은 강의 만들어 주셔서 잘 듣고 있습니다. 그런데 아무리 해도 에러가 나는 것을 해결하지 못하고 있어 2주 이상 진도를 나가지 못하고 있어 부득이하게 질문을 여러번 올리게 됩니다. 현재 [그랩마켓] React로 웹 개발하기 -2 듣고 있는데요 , 1. 그랩 선생님 소스 코드와 동일 하게 아래 작성한 index.js 소스 첨부 하는데요, 실행 하면 , 1초 동안 잠깐 판매되는 상품들 이미지 없이 전체 페이지 뜨다 바로 아래 첨부한 그림과 같이 에러가 발생 합니다. 이 에러는 어떻게 해결 할 수 있을까요? -------- 2. index.js 소스 아래에 작성 첨부 합니다. import './index.css'; import axios from "axios"; import React from 'react'; function MainPage(){ const [products, setProducts]=React.useState([]); React.useEffect( function(){ axios.get("이곳에는 제 mock 목 서버 주소를 넣었습니다/products") .then(function(result){ const products=result.data.products; setProducts(products); }).catch(function(error){ console.error("에러 발생:",error); }); },[]); return ( <div> <div id="header"> <div id="header-area"> <img src="../images/icons/logo.png" /> </div> </div> <div id="body"> <div id="banner"> <img src="../images/banners/banner1.png" /> </div> <h1>판매되는 상품들</h1> <div id="product-list"> { products.map(function(product, index){ return ( <div className="product-card"> <div> <img className="product-img" src={product.imageUrl} /> </div> <div className="product-contents"> <span className="product-name">{product.name} </span> <span className="product-price">{product.price}원 </span> <span className="product-seller"> <img className="product-avatar" src="../images/icons/avatar.png" /> <span>{product.seller}</span> </span> </div> </div> ); }) } </div> </div> <div id="footer"></div> </div> ); } export default MainPage; 그리고, 추가적으로 아래 그랩님 답변 본 뒤 다시 시도해 본 후 질문이 있어 추가적으로 글을 적습니다. 현재 postman을 실행하고요, 제 해당 목 mock 서버 주소를 입력 후 끝에 /products까지 하면요, 아래와 첨부한 사진과 같이 잘 데이터를 받아오는 것 같은데요, 위에 에러 화면이 그대로 표시되어 어떻게 해결해야 하는지 방법을 모르겠습니다. 조금 구체적으로 어떻게 해결해야 하는지 단계별로 친절한 설명 부탁 드립니다 위에는 mock 서버인 postman(포스트맨) 화면이고요, 아래는 크롬 브라우저 에러 메시지를 첨부합니다. 참고> app.js 소스 첨부합니다. import logo from './logo.svg'; import './App.css'; import MainPage from "./main/index.js" function App() { return ( <div> <MainPage /> </div> ); } export default App; 또한 만약 그랩님께서 제 소스를 보시고 수정하여 에러가 해결된 완성된 index.js 소스가 있다면요, 최종 완성 된 수십 줄의 소스 코드 를 아래 답변 댓글에 길더라도 다 첨부해주시면 완성된 소스 코드를 그대로 복사하여 vs code에 붙여 넣기 하고 싶은데요 , 아래 답변 글에 남겨주시면 감사하겠습니다. ------------------------------------------------------------------------------------------------- 그리고, 아래 글에 나와 있는 답변데로, TypeError: Cannot read properties of undefined (reading ‘map’) 해결 방법 서버 데이터 문제로 인한 map 함수 에러 고치기 React 데이터 바인딩과 undefined 에러 처리 위 해결책의 코멘트와 답변 대로 수정해 보아도 에러가 해결 되지 않았습니다. 어떻게 해결 해야 하는지요? 빠른 답변 부탁 드립니다.
안녕하세요. 강의 잘 듣고 있습니다. context 를 사용하기 전 코드에서 export default memo(Editor); Editor 컴포넌트에도 memo 를 사용해서 TodoItem 의 수정/삭제로 인해 계속 리렌더링되는 것을 막는 최적화를 했었는데요. context를 사용하고 나니까 Editor 컴포넌트의 최적화가 풀리는 이유가 궁금합니다. useCallback 과 useMemo 를 사용해서 함수를 App 컴포넌트가 마운트 될 때 한번만 생성하고 3개의 함수를 묶은 객체도 다시 생성되지 않도록 만들었는데, Editor 컴포넌트는 컨텍스트에서 onCreate 함수만 받아서 사용하고 있는데, 왜 리렌더링이 발생하나요? 챗지피티에 질문을 했더니, " props 가 없는 상태에서 useContext 만 쓰고 있으면 memo 는 props 비교를 하지 못해서 무조건 리렌더링 발생한다" 라고 하는데 맞는 말인가요? 맞는 말이라면 설명 좀 부탁드립니다.ㅠㅠ
윈도우에서 react expo로 앱을 만든 후 애뮬에 배포하는거말고 윈도우 하드디스크에 apk를 받고싶어서 npx eas build -p android --profile preview --local 이라고 명령어 실행하면 Unsupported platform, macOS or Linux is required to build apps for Android Error: build command failed. 이렇게 뜨는데 제가 잘못한게 있을까요? 아니면 맥북에서만 로컬 빌드가 가능한건가요?? eas 온라인 빌드는 한달 30회 제한도 있고 큐에 쌓이고 기다리는 시간이 너무 길어서 apk 추출해서 실기기에 넣고싶은데 윈도우에서는 방법이 없을까요?
✘ chaejinjeong😝 ~/Desktop/lukas/Study/reactnative/zerocho/threads ↱ main ± eas build --profile development --platform android ★ eas-cli@16.17.0 is now available. To upgrade, run: npm install -g eas-cli Proceeding with outdated version. Failed to read the app config from the project using "npx expo config" command: npx expo config --json exited with non-zero code: 1. Falling back to the version of "@expo/config" shipped with the EAS CLI. [@react-native-kakao/core] 'nativeAppKey' missing in expo config plugin value Error: build command failed. 현재 강의 따라하다가 app.config.js 로 app.json이 바뀌어있는 상태인데 config.js 에서는 환경변수로 값이 인식이 안되나요 ? Expo 프로젝트에 환경변수는 등록이 되어있는 상태입니다.
https://github.com/ZeroCho/threads-clone/tree/9313da137d2520c8a336e9add8ec61a776bca4e4/app 위 링크에서 modal.tsx 만 다음 코드로 바꾼 후 실습 진행하시면 됩니다. 이렇게 되어 있을 때, 해당 링크에 있는 파일을 다운로드 할 수 있나요? 아니면 해당 링크에 들어가서, 파일 하나하나 접근해서 파일 하나씩 다운로드를 하는건가요? 죄송합니다. 무슨 말인지 모르겠어요.
안녕하세요! pandas 연산기능 강의에서 이해가 가지 않는 부분이 있어 질문 드립니다. df.divide(df.sum(axis=1), axis=0) 위 코드에서 열 축을 따라 왼쪽에서 오른쪽으로 나눗셈이 이루어지는데, 왜 axis=0 인가요? sum과 동일한 방향이면 똑같이 axis=1 이어야 할 것 같은데.. 헷갈립니다.
안녕하세요 리액트 설치 에러에 대해 질문이 있습니다. 원래 vite로 리액트를 설치해서 잘 사용하고 있었는데 어제 새로운 프로젝트를 할려고 vite로 리액트를 설치했고 npm i 명령어로 node_modules를 받은 후 npm run dev로 실행을 하니 이미지처럼 오류가 계속 나더라구요. 그래서 저 에러에 대해 이것저것 찾아보니 node버전 문제라고 나오는데 현재 버전은 v20.11.1 인데 뭐가 문제인건지 모르겠습니다.
안녕하세요 강의 실습중 문의드립니다. 강의랑 똑같이 하던중에 저에게만 에러가 나는부분이 있어 문의드립니다. @Override public Long register(TodoDTO todoDTO) { Todo todo = dtoToEntity(todoDTO); dtoToEntity에서 에러가 발생합니다. Cannot invoke "java.lang.Long.longValue()" because the return value of "com.project.reactserver.dto.TodoDTO.getTno()" is null 에러가 발생하는데 당연히 tno값을 안넣었으니 null인데 강사님 강의에서는 잘 진행이 되는데 뭐가 문제인지.. 물론 TodoDTO에는 @Data 어노테이션도 작성했고 Setting에서 어노테이션 활성도 확인했습니다.
'c:/Users/swu/threads-clone/node_modules/@faker-js/faker/tsconfig.json' 구성 파일에서 입력을 찾을 수 없습니다. 지정된 '포함' 경로는 '["src/**/*"]'이고 '제외' 경로는 '["node_modules"]'이었습니다. 처음에 오류가 발생해서 npm uninstall @faker-js/faker 로 한 번 지웠다가 다시 npm i @faker-js/faker 로 설치했는데 이런 오류가 발생합니다 ㅜㅜ 지웠다가 설치해서 이런 오류가 발생하는 걸까요?
LOG key: Xo8WBi6jzSxKDVR4drqm84yr9iU= ERROR [Error: invalid android_key_hash or ios_bundle_id or web_site_url] key는 잘 받아오는데 로그인이 안됩니다.. const onKakaoLogin = async () => { try { console.log("key: ", await getKeyHashAndroid()); const result = await kakaoLogin(); console.log(result); const user = await me(); console.log(user); // TODO: save the token to server } catch (error) { console.error(error); } }; 현재 사용 중인 코드입니다.
reactive kakao login docs를 보고 설치하고 강의따라 kakako core,user 설치했는데, 아래와같은 에러가 계속 발생합니다 > Configure project :react-native-reanimated Android gradle plugin: 8.8.2 Gradle: 8.13 [Incubating] Problems report is available at: file:///Users/chaejinjeong/Desktop/lukas/Study/reactnative/zerocho/threads/android/build/reports/problems/problems-report.html FAILURE: Build failed with an exception. * What went wrong: Could not determine the dependencies of task ':app:processDebugResources'. > Could not resolve all dependencies for configuration ':app:debugRuntimeClasspath'. > Could not find com.kakao.sdk:v2-common:2.20.1. Searched in the following locations: - file:/Users/chaejinjeong/Desktop/lukas/Study/reactnative/zerocho/threads/node_modules/react-native/android/com/kakao/sdk/v2-common/2.20.1/v2-common-2.20.1.pom - https://dl.google.com/dl/android/maven2/com/kakao/sdk/v2-common/2.20.1/v2-common-2.20.1.pom - https://repo.maven.apache.org/maven2/com/kakao/sdk/v2-common/2.20.1/v2-common-2.20.1.pom - https://www.jitpack.io/com/kakao/sdk/v2-common/2.20.1/v2-common-2.20.1.pom - https://central.sonatype.com/repository/maven-snapshots/com/kakao/sdk/v2-common/2.20.1/v2-common-2.20.1.pom Required by: project :app > project :react-native-kakao_core > Could not find com.kakao.sdk:v2-user:2.20.1. Searched in the following locations: - file:/Users/chaejinjeong/Desktop/lukas/Study/reactnative/zerocho/threads/node_modules/react-native/android/com/kakao/sdk/v2-user/2.20.1/v2-user-2.20.1.pom - https://dl.google.com/dl/android/maven2/com/kakao/sdk/v2-user/2.20.1/v2-user-2.20.1.pom - https://repo.maven.apache.org/maven2/com/kakao/sdk/v2-user/2.20.1/v2-user-2.20.1.pom - https://www.jitpack.io/com/kakao/sdk/v2-user/2.20.1/v2-user-2.20.1.pom - https://central.sonatype.com/repository/maven-snapshots/com/kakao/sdk/v2-user/2.20.1/v2-user-2.20.1.pom Required by: project :app > project :react-native-kakao_user * Try: > Run with --stacktrace option to get the stack trace. > Run with --info or --debug option to get more log output. > Run with --scan to get full insights. > Get more help at https://help.gradle.org. Deprecated Gradle features were used in this build, making it incompatible with Gradle 9.0. You can use '--warning-mode all' to show the individual deprecation warnings and determine if they come from your own scripts or plugins. For more on this, please refer to https://docs.gradle.org/8.13/userguide/command_line_interface.html#sec:command_line_warnings in the Gradle documentation. BUILD FAILED in 6s 33 actionable tasks: 5 executed, 28 up-to-date Error: /Users/chaejinjeong/Desktop/lukas/Study/reactnative/zerocho/threads/android/gradlew app:assembleDebug -x lint -x test --configure-on-demand --build-cache -PreactNativeDevServerPort=8081 -PreactNativeArchitectures=arm64-v8a exited with non-zero code: 1 Error: /Users/chaejinjeong/Desktop/lukas/Study/reactnative/zerocho/threads/android/gradlew app:assembleDebug -x lint -x test --configure-on-demand --build-cache -PreactNativeDevServerPort=8081 -PreactNativeArchitectures=arm64-v8a exited with non-zero code: 1 at ChildProcess.completionListener (/Users/chaejinjeong/Desktop/lukas/Study/reactnative/zerocho/threads/node_modules/@expo/spawn-async/src/spawnAsync.ts:67:13) at Object.onceWrapper (node:events:622:26) at ChildProcess.emit (node:events:507:28) at maybeClose (node:internal/child_process:1101:16) at Process.ChildProcess._handle.onexit (node:internal/child_process:305:5) ... at spawnAsync (/Users/chaejinjeong/Desktop/lukas/Study/reactnative/zerocho/threads/node_modules/@expo/spawn-async/src/spawnAsync.ts:28:21) at spawnGradleAsync (/Users/chaejinjeong/Desktop/lukas/Study/reactnative/zerocho/threads/node_modules/@expo/cli/src/start/platforms/android/gradle.ts:134:28) at assembleAsync (/Users/chaejinjeong/Desktop/lukas/Study/reactnative/zerocho/threads/node_modules/@expo/cli/src/start/platforms/android/gradle.ts:83:16) at runAndroidAsync (/Users/chaejinjeong/Desktop/lukas/Study/reactnative/zerocho/threads/node_modules/@expo/cli/src/run/android/runAndroidAsync.ts:62:24) node_modules 모두 삭제하고 설치해도 똑같습니다 npx expo install --fix 로도 호환이 안맞춰지는 것 같습니다. 패키지는 설치되어있는 것 확인했습니다. 제 진행중인 코드 입니다.
