inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

173만명의 커뮤니티!! 함께 토론해봐요.

context provider에 관한 질문

미해결

Next + React Query로 SNS 서비스 만들기

Tab.tsx에서 "추천"과 "팔로우 중"을 클릭하면 상태가 "rec", "fol"로 변경되는 것을 확인했습니다. 이후 TabProvider.tsx 파일을 만들고 <TabProvider>로 상태를 공유할 하위 컴포넌트를 감싸는 것 까지 되었습니다. TabProvider.tsx에 있는 state를 하위 컴포넌트가 구독하여 상태 공유를 할 수 있는 것으로 알고있습니다. 여기서 질문입니다. TabProvider.tsx로 감싼 하위 컴포넌트인 Tab.tsx에서 상태가 변경되었을 때, TabProvider에 변경된 상태를 공유할 수 있는지 궁금합니다. (자식 컴포넌트에서 상태가 변경되면, Provider 상태도 변경할 수 있는지) Post.tsx에서 상태공유 확인하는데, Tab.tsx에서 상태가 변경되어도 Provider에서는 변경되지 않아 질문 올립니다.. import { TabContext } from "../home/_component/TabProvider"; const Post = () => { const { tab } = useContext(TabContext); return ( <> <div>TabContext Value = {tab}</div> </> ); };

  • react
  • next.js
  • react-query
  • next-auth
  • msw
hwuiinn 댓글 1 좋아요 0 조회수 334

Hot reload 오류 문의 드립니다.

해결됨

기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)

안녕하세요 강사님은 코드 수정 후 브라우저에서 바로바로 확인이 되는 것 같은데 저는 코드를 수정할 때 마다 아래의 오류가 발생해서 매번 다시 yarn dev를 해줘야 수정한 내역이 확인이 되다 보니 강의를 따라 진행 하는대 집중이 되질 않네요. 혹시 아래의 에러가 발생 되지 않게 하는 방법이 있는 것인지 문의 드립니다. 감사합니다. 수고하세요. =================================================================== ⨯ [Error: UNKNOWN: unknown error, open 'D:\study\react\workspace\yt-music-clone-next\.next\static\chunks\app\layout.js'] { errno: -4094, code: 'UNKNOWN', syscall: 'open', path: 'D:\\study\\react\\workspace\\yt-music-clone-next\\.next\\static\\chunks\\app\\layout.js' ===================================================================

  • react
  • 인터랙티브-웹
  • 클론코딩
  • next.js
  • tailwind-css
  • zustand
itdeveloper 댓글 2 좋아요 1 조회수 697

프라이빗 폴더에 관한 질문입니다.

미해결

Next + React Query로 SNS 서비스 만들기

강의를 듣던 중에 프라이빗 폴더에 관한 궁금증이 생겼습니다. 단순 중복 제거 컴포넌트를 모아두는 폴더로 사용한다. 클라이언트 컴포넌트만 넣어두는 폴더로 사용한다. 1번과 2번의 용도로만 사용하면 되는 것인가요?? 그리고 View마다 프라이빗 폴더를 생성해서 파일을 정리해도 괜찮을까요??

  • react
  • next.js
hwuiinn 댓글 1 좋아요 0 조회수 220

안녕하세요 선생님

미해결

모두의 한국어 텍스트 분석과 자연어처리 with 파이썬

안녕하세요 선생님 대학교에서 캡스톤디자인을 수행하고 있는 학생입니다. 판결문에서 사건의 원인,판결 결과,가중·감소 처벌 요소,키워드를 추출하고 싶은데 어떤 기술을 사용해야할지 막막하여 질문올리게 되었습니다. 거대언어모델은 지양하라고 교수님께서 말씀하셨습니다..ㅜ 조언을 주신다면 감사하겠습니다.

  • python
  • 머신러닝
  • 빅데이터
  • NLP
  • 텍스트마이닝
  • data-clustering
  • 데이터-리터러시
큐펀치 댓글 1 좋아요 0 조회수 332

leftSectionWrapper와 rightSectionWrapper 중앙 정렬 방법에 관하여

미해결

Next + React Query로 SNS 서비스 만들기

양 사이드에 flex-grow : 1; 씩 주는 방법을 처음 알게되었습니다. 이전에는 현재 구현하고자 하는 레이아웃처럼 중앙정렬 할 때, 아래 코드처럼 요소 전체를 감싸는 컨테이너에 justify-content : center;를 지정해서 정렬했었습니다. (아래 코드 첨부) 레이아웃을 정확하게 중앙에 놔둘 때에는 flex-grow 및 justify-content를 선택해서 사용할 수 있을 것 같고, flex-grow는 비대칭적인 레이아웃을 구성할 때, 더 유용할 수 있겠다. 라고 생각하는데 올바른 접근일까요?? .container { display: flex; align-items: stretch; background-color: #fff; justify-content: center; }

  • react
  • next.js
  • react-query
  • next-auth
  • msw
hwuiinn 댓글 2 좋아요 0 조회수 235

Graphql-codegen 설치중에 에러

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

Graphql-codegen 설치중에 에러가 계속 나서 node-module 과 yarn.lock 을 삭제 한후 다시 yarn install 실행 후 yarn add --dev typescript @graphql-codegen/cli 에러가 났습니다 내친구 쳇에게 물어봤더니 제가 한거처럼 하라고 하네요 매번 환경설정시 긴장의 연속!!! 왜이러는 걸까요?? 혹시 yarn add -D typescript ts-node @graphql-codegen/cli @graphql-codegen/client-preset @parcel/watcher 요걸 해줘야되는지 ?? :~/codecamp/class$ yarn add --dev typescript @graphql-codegen/cli yarn add v1.22.22 [1/4] Resolving packages... error AggregateError at internalConnectMultiple (node:net:1102:18) at internalConnectMultiple (node:net:1160:5) at internalConnectMultiple (node:net:1160:5) at internalConnectMultiple (node:net:1160:5) at internalConnectMultiple (node:net:1160:5) at internalConnectMultiple (node:net:1160:5) at internalConnectMultiple (node:net:1160:5) at internalConnectMultiple (node:net:1160:5) at internalConnectMultiple (node:net:1160:5) info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.

  • react
  • node.js
  • seo
  • graphql
  • next.js
S S 댓글 0 좋아요 0 조회수 202

다들 마우스 hover시에 포인터가 제대로 변경되시나요?

미해결

Next + React Query로 SNS 서비스 만들기

private 폴더까지 강의를 보면서 진행하다가 문득 로그인이나 계정 만들기, 모달 close button에 마우스를 가져다 대니 커서 변경이 되지 않네요. 속성이 없는건가? 싶어서 보니 cursor : pointer; 는 제대로 들어가있는 것 같은데 마우스 포인터가 잘 변경되지 않아서 다른 분들은 잘 변경되시는지 궁금하네요

  • react
  • next.js
  • react-query
  • next-auth
  • msw
hwuiinn 댓글 1 좋아요 0 조회수 358

show_templates() 함수의 키워드 아규먼트 질문

해결됨

Airflow 마스터 클래스

안녕하세요 강사님! dags_python_with_ templates.py 파일에서 show_templates 함수를 아무 인자도 넣지 않고 실행을 시키는데요, dag 실행시 출력되는 키워드 인자들은 에어플로우 태스크 객체에 기본으로 입력되는 값들인가요? 정확한 원리가 궁금하여 여쭤봅니다

  • python
  • 데이터-엔지니어링
  • airflow
방효석 댓글 2 좋아요 0 조회수 336

오픈그래프 태그

미해결

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

배포 후 링크 공유하는데 오픈 그래프 태그가 나타나지 않습니다.ㅜㅜ

  • javascript
  • react
  • node.js
우다슬 댓글 5 좋아요 0 조회수 957

Apollo-Client 설치 에러

미해결

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

안녕하세요, 섹션 7 듣고 있습니다. Apollo-Client를 설치하고 yarn dev 실행하니 저렇게 뜨네요. 해당 파일을 지우거나 해도 이번엔 그 파일이 없다는 이유로 에러가 뜹니다. Node.modules랑 package.lock.json 삭제 후 재설치해도 똑같고요. 조속한 해결 부탁 드리겠습니다.

  • react
  • node.js
  • seo
  • graphql
  • next.js
edo020424 댓글 1 좋아요 0 조회수 228

404에러

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

//section05/05-05-dynamic-routing-board-mutaton import { gql, useMutation } from "@apollo/client"; import { useRouter } from "next/router"; const 나의그래프큐엘셋팅 = gql` mutation createBoard($writer: String, $title: String, $contents: String) { createBoard(writer: $writer, title: $title, contents: $contents) { _id number message } } `; export default function GraphqlMutationPage() { const router = useRouter(); const [myFunction] = useMutation(나의그래프큐엘셋팅); const onClickSubmit = async () => { try { // 코드 시도하다 실패하면 catch로 넘어감 const result = await myFunction({ variables: { //variables === $ 역할을 함. 그렇다고 여기선 $를 쓰면 안됨 writer: "훈이", title: "안녕하세요", contents: "반갑습니다.", }, }); console.log(result); console.log(result.data.createBoard.number); router.push( `/section05/05-05-dynamic-routing-board-mutation-moved/${result.data.createBoard.number}` ); } catch (error) { alert(error.message); } }; //한줄일땐 괄호 생략 가능 return ( <> <button onClick={onClickSubmit}>GRAPHQL-API 요청하기</button> </> ); } //section05/05-05-dynamic-routing-board-mutation-moved/[number] import { useQuery, gql } from "@apollo/client"; import { useRouter } from "next/router"; // 폴더 [qqq] 대괄호로 감 싸놓으면 폴더가 변수가됨 const FETCH_BOARD = gql` query fetchBoard($number: Int) { fetchBoard(number: $number) { number writer title contents } } `; export default function StaticRoutingMovedPage() { const router = useRouter(); console.log( router); const { data } = useQuery(FETCH_BOARD, { variables: { number: Number(router.query.number) }, //graphql fetchBoard에 자료가 없거나 null이면 오류가 뜸 }); console.log(data); return ( <> <div> {router.query.number}번 게시글 </div> <div>작성자 : {data?.fetchBoard?.writer}</div> <div>제목 : {data?.fetchBoard?.title}</div> <div>내용 : {data?.fetchBoard?.contents}</div> {/* 자료가 없거나 null이 뜨면 fetchBoard에 옵셔널체이닝('?' 자료가 오면 다시 리 렌더링 해줌) 붙이기 */} </> ); } 게시물을 정상적으로 잘 등록이 됩니다 플레이그라운드에서 fetchboard 조회를 해봐도 잘 나옵니다. 네트워크 탭에 들어가도 아무것도 안나오고 콘솔에는 그저 on-demand-entries-client.js:86 GET http://localhost:3000/section05/05-05-dynamic-routing-board-mutation-moved/23131 404 (Not Found) 뭐가 문제일까요?

  • react
  • node.js
  • seo
  • graphql
  • next.js
157350 댓글 2 좋아요 0 조회수 274

타입스크립트 설치 강의를 듣고 있는데 자꾸 에러가 납니다.

미해결

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

해당 영역 을 17.0.2로 바꾸는데도 "@types/node": "^17.0.2", "@types/react": "^17.0.02", 이렇게 뜨더니 18.2.79로 바뀌고 에러가 뜹니다

  • react
  • node.js
  • seo
  • graphql
  • next.js
박수민 댓글 1 좋아요 0 조회수 242

도메인을 연결하고 프론트 도메인으로 접속 로딩시간이 엄청 오래걸립니다.

미해결

[리뉴얼] React로 NodeBird SNS 만들기

도메인을 연결하고 프론트 도메인으로 접속 로딩시간이 엄청 오래걸립니다. 이런경우는 도대체 뭐때문에 그럴까요? 용량이 커서 그럴까요? 백 서버 도메인은 접속이 잘됩니다.. vscode에서도 front터미널만 자꾸 렉걸리는 현상이 생겨요 ㅠㅠ

  • react
  • redux
  • node.js
  • express
  • next.js
hyuri 댓글 1 좋아요 0 조회수 260

관련 책이 언제 나올까요?

미해결

파이썬/장고 웹서비스 개발 완벽 가이드 with 리액트 (장고 4.2 기준)

관련 도서 출간은 언제쯤 예상하시나요? 건강하시길 바라요~

  • react
  • python
  • django
  • web-api
  • htmx
bigseoul 댓글 1 좋아요 0 조회수 220

jwt관련 질문드립니다.

미해결

Next + React Query로 SNS 서비스 만들기

안녕하세요 제로초님. 강의 잘보고있습니다 강의와 관련된 질문이 아니라 죄송합니다.. 여러군데에서 찾아봐도 명쾌한 내용이 보이지 않아서 질문드립니다. 백엔드서버(spring)에서 jwt를 발급하는데, axios 인터셉터 처럼 401에러시 백엔드 jwt재발급요청을 하는방법이 Next에서 fetch함수에서는 할수가없는거 같더라고요. 저가 생각한 해결법은 2가지인데 어떤게 좋을까요..? next-auth 미사용, axios사용하기 fetch를 둘러싸는 customFetch()함수 정의하여 모든곳에서 사용하기

  • react
  • next.js
  • react-query
  • next-auth
  • msw
홍석 손 댓글 1 좋아요 1 조회수 229

강의자료 부탁드립니다

미해결

프로그래밍 시작하기 : 파이썬 입문 (Inflearn Original)

안녕하세요 강의 자료 부탁드립니다 감사합니다

  • python
jiho 댓글 1 좋아요 0 조회수 162

강의 중간중간에 1일차 2일차 몇교시 알려주시는거

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

지켜보고 싶습니다 제가 분량조절이 잘 안될것같아서요 혹시 일정표같은게 있을까요?

  • react
  • node.js
  • seo
  • graphql
  • next.js
김트랙 댓글 1 좋아요 0 조회수 316

제로초님 안녕하세요 ㅎㅎ

미해결

Next + React Query로 SNS 서비스 만들기

@vanilla-extract/css에서 혹시 스타일드 컴포넌트와 같이 값을 넘겨서 처리 해주는 건 없나요?! pr &.group-item { display: grid; grid-template-columns: repeat(${pr => pr.columns}, 1fr); column-gap: 30px; padding-right: ${props => (props.category === 'POSITION' ? '0px' : '30px')}; } &.group-item-half { display: grid; grid-template-columns: repeat(${pr => pr.columns}, 1fr); column-gap: 30px; padding: 0px 0px 30px 30px; &:first-of-type { padding-top: 30px; } }

  • react
  • next.js
  • react-query
  • next-auth
  • msw
김로인 댓글 1 좋아요 0 조회수 258

NextJs 빌드이후 실행관련 질문입니다!

미해결

Next + React Query로 SNS 서비스 만들기

NextJs를 빌드하면 .next라고 빌드 파일이 나오는 것까지 확인했는데, 강의에서는 빌드 산출물을 실행시키는게 아니라 git으로 전체 프로젝트를 클론받아서 실행시키는거 같더라구요 Export를 해서 out 파일이 나오는 static 실행방법은 아니에요 혹시 NextJS 빌드 산출물을 실행시키는 방법이 있을까요??

  • next.js
  • react-query
  • next-auth
  • msw
sanguu516 댓글 1 좋아요 0 조회수 347

제로초님 안녕하세요 ㅎㅎ

미해결

Next + React Query로 SNS 서비스 만들기

저스탠드 관련해서 하다가 안풀려서 여쭤 봅니다 백엔드와 통신을 하여 값을 받아 온 객체의 값을 저스탠드에 set으로 저장 하려고 하는데 이렇게 계속 나오더라구여 .. 제가 지금 하려고 했던건 인터페이스를 만들어주고 각 타입을 주려고 했는데 안되더라구여 ㅠㅠ 어떤 걸 수정을 해야 될까요 ㅠㅠ 타입을 any로 하니 되긴 하던데 any는 사용 하지 말라고 하셔서 되도록 ㅠㅠ

  • react
  • next.js
  • react-query
  • next-auth
  • msw
김로인 댓글 1 좋아요 0 조회수 259

인기 태그

인프런 TOP Writers

주간 인기글