안녕하세요! next.js 설치 완료후 package.json을 확인해보니 테일윈드가 3.4.1 버전이 아닌 4.0.14 버전이 설치 되어있음을 확인했습니다. 강의 내용과 다른점이 있어 node_modules , yarn lock 삭제후 버전 다운그레이드를 시도해보았지만 자꾸 에러가나서.. 테일윈드 독스를 찾아 새로운 버전을 적용시켰어요 https://tailwindcss.com/docs/installation/framework-guides/nextjs 다만 기존 강의에서는 tailwind.config.js 에서 변수를 설정하는 법을 알려주셨는데.. 그 방법에 대해서는 해결방법을 찾지 못하였습니다. 나만의 변수를 만들어 다양한 컴포넌트에서 재사용하는 방법이 테일윈드의 강의의 쟁점이라고 생각해서. global.css에 변수를 만들어 컴포넌트 스타일에 적용시키는 방법으로 비슷하게는 진행해 보았는데 이렇게 해도 되는 사항 일까요? 또한 강의 후반부에 @layer로 utilities를 만들어 스타일을 적용시키는 부분에서 스타일 자체는 먹지만, 테일윈드 자체에서 제공해주는 반응형 명령어에는 적용이 안돼요 ㅠㅠ 좋은 방법이 있을까요.....
문제 발생 : npm run start:dev 시 위와 같은 에러 발생 Error: connect ECONNREFUSED ::1:6379 at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1615:16) { errno: -4078, code: 'ECONNREFUSED', syscall: 'connect', address: '::1', port: 6379 } 문제 원인: Redis 연결 실패 → 애플리케이션이 Redis 서버(포트 6379 )에 연결하려 했지만 거부됨. ECONNREFUSED 오류는 Redis가 실행되지 않거나, 접근할 수 없는 상태 일 때 발생. 문제 해결 : Redis 기본 설정은 IPv6 ( ::1 )을 사용함. IPv4( 127.0.0.1 )로 강제 변경해 해결 localhost 가 아닌 127.0.0.1 로 변경 // .env 기존 코드 REDIS_URL=redis://localhost:6379 // .env 변경 코드 REDIS_URL=redis://127.0.0.1:6379 위 에러 만나고 애쓴 부분 공유합니다. 혹시 잘못된 해결 방법이라면 알려주시면 감사하겠습니다!
const contact = Contact.create({ name, email, phone, }); 테이블 이름은 모델에 정의된 contactModel.js에서 정의 되는데 contact라는 변수에 할당 받는 이유가 무엇일까요? javascript에서는 변수에 함수로 초기화를 할 수 있기 때문에 그냥 함수의 역할을 하는 변수인가요?
콘솔창에 Lottie 관련으로 경고 메시지 같은게 뜨는데 해당 내용은 어떻게 해야 해결할 수 있나요? 혹시페이지에 문제가 생기지는 않는건가요? 문서를 봐도 무슨 말인지 모르겠네요. componentWillUpdate has been renamed, and is not recommended for use. See https://react.dev/link/unsafe-component-lifecycles for details. * Move data fetching code or side effects to componentDidUpdate. * Rename componentWillUpdate to UNSAFE_componentWillUpdate to suppress this warning in non-strict mode. In React 18.x, only the UNSAFE_ name will work. To rename all deprecated lifecycles to their new names, you can run npx react-codemod rename-unsafe-lifecycles in your project source folder. Please update the following components: Lottie2
왜인지 모르게 npm install로 npm install --save @react-native-vector-icons/fontawesome5이런식으로 설치를 해주고 나서 import FontAwesome5 from '@react-native-vector-icons/fontawesome5'; 을 하면 icon을 가지고 오지 못해서 [runtime not ready]: Invariant Violation: TurboModuleRegistry.getEnforcing(...): 'VectorIcons' could not be found. Verify that a module by this name is registered in the native binary., js engine: hermes, stack: invariant@2200:25~ 위에와 같은 오류가 발생합니다,,, font가 제대로 카피되지 않아서 벌어지는 일 같아용,,, 그래서 여러가지 시도해본 결과 다른거 할 필요없이 import FontAwesome5 from '@react-native-vector-icons/fontawesome5'; 이런식으로 Icon이 아니라 FontAwesome5를 해주니까 되더라구요,,? 그런 후에 다시 import Icon from '@react-native-vector-icons/fontawesome5'; 이렇게 Icon으로 해주니까 font들이 제대로 카피가 되더라구요,,? 위에 사진처럼 복사되면 제대로 된거죠? (Icon 잘 나옵니다,,) 혹시 바로 import Icon했을때는 왜 안된건지 아실까요?
git에 있는 chapter 03에 있는 거 그대로 copy 하고 index.js 수행 해도 아래와 같은 오류가 떠요.. 버전은 16이구요.. 어디가 잘 못 된걸까요? Cannot read properties of undefined (reading 'S') TypeError: Cannot read properties of undefined (reading 'S') at http://localhost:3001/static/js/bundle.js:19184:56 at ./node_modules/react-dom/cjs/react-dom-client.development.js ( http://localhost:3001/static/js/bundle.js:20831:2 ) at options.factory ( http://localhost:3001/static/js/bundle.js:29391:31 ) at __webpack_require__ ( http://localhost:3001/static/js/bundle.js:28833:32 ) at fn ( http://localhost:3001/static/js/bundle.js:29050:21 ) at ./node_modules/react-dom/client.js ( http://localhost:3001/static/js/bundle.js:21060:20 ) at options.factory ( http://localhost:3001/static/js/bundle.js:29391:31 ) at __webpack_require__ ( http://localhost:3001/static/js/bundle.js:28833:32 ) at fn ( http://localhost:3001/static/js/bundle.js:29050:21 ) at ./src/index.js ( http://localhost:3001/static/js/bundle.js:28617:74 )
강의 설명에서는 아래 사진처럼 되어져 있는데 -> false의 위치가 틀렸어요 이게 맞습니다(아래 사진) 아마 1번 사진처럼 하면, Info.plist오류라고 뜨면서 앱이 실행이 안됩니다! 2번 사진처럼 붙여넣어주셔야 합니다,, 제대로 설정되면 Info.plist를 Property List로 열었을때 오류 없이 잘 열릴꺼에요(1번 처럼하면 PropertyList 안열림) 열려서 Fonts provided by application에 추가한 폰트들이 잘 들어가져있다면 잘 설치된거에요~ cf1) 이렇게 했는데 갑자기 잘 안된다면 podfile제거하고 다시 설치해보세용 cd ios pod deintegrate pod install 이렇게 하시면 되용 cf2) 만약에 No script URL provided. Make sure the packager is running or you have embedded a JS bundle in your application bundle. unsanitizedScriptURLString = (null) 이런 에러가 뜨면 터미널로 가서 npm start해주면 됩니다.. 저처럼 헷갈리시는 분들이 있을까봐 남겨용 학습에 관련된 질문만 해주세요. 질문은 상세하게 무엇이 궁금한지 작성해주세요. 질문은 '마크다운'을 사용하여 할 수 있습니다. 유사한 질문이 있었는지 살펴보고 질문 해주세요. 부담갖지 말고 강의에서 궁금하신 점 전부 질문해주세요 :)
해당 강좌 default.tsx에서 기본 페이지로 사용시킬때 default.tsx를 처리해두고 빈페이지를 구성하는 형태를 사용하는 예제를 따라서 진행해보았는데요. 여기서 궁금한점이 page.tsx를 @modal에 하나더 유지시키고 return null 처리를 하는 컴포넌트를 두어도 똑같이 동작은 되는데, default.tsx 를 좀 더 권장하는 이유가 있을까요?
아래가 제가 이해한 내용인데 맞을까요? 요청 메모화 ssr 요청 사이클 내 에서만 페치 결과를 캐싱하여 중복 요청 방지 (한 서버 요청 사이클 끝나면 초기화) 예를들어 Home컴포넌트와 자식 컴포넌트인 Header 컴포넌트에서 렌더링 시 에 동일한 요청을 날렸다면 Home컴포넌트의 요청이 캐싱되고 Header 컴포넌트의 요청은 캐싱된 값 사용 데이터 캐시 한 ssr 요청 사이클 내 뿐만 아니라 서버에 전역적으로 유지되는 캐시 요청 메모화와 다르게 서버 요청 끝나도 초기화되지 않고 지속됨 즉, 여러 클라이언트 요청 간에도 유지됨 A가 먼저 페이지 요청 → 백엔드에 요청 후 넥스트 서버에 데이터 캐싱 B가 같은 페이지 요청 → 백엔드 요청 없이 넥스트 서버 캐시에서 데이터 반환 결론 즉, 요청 메모화는 렌더링 최적화 , 데이터 캐시는 네트워크 요청 절약 을 위한 것
