inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

[Next.js] 데이터 스트리밍에 대한 문의드립니다.

해결됨

한 입 크기로 잘라먹는 Next.js

페이지단위, 컴포넌트 단위로 스트리밍은 이해되는데, 만약 테이블에 데이터를 불러오는데, 데이터가 100만개 이럴때 테이블의 첫 페이지에 20개만 불러오고 이런 식으로 동작하게 할 수 있는 스트리밍 방식이 있을까요?

  • react
  • typescript
  • next.js
Ethan 댓글 2 좋아요 0 조회수 80

day17과제중 Context 객체생성 오류발생했습니다.

해결됨

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

day17과제하던중에, Context 객체 생성하는데 오류가 발생했습니다. export를 붙여서 진행하면 화면과 같이 오류가 발생하고, export를 제외하면 랜더링할때 빈화면이 나옵니다. 다른컴퍼넌트에는 useContext이용해서 함수 공급받는거 작성했습니다. import "./App.css" import Header from "./components/Header" import ContactEditor from "./components/ContactEditor" import List from "./components/List" import {useState, useRef, useCallback, createContext, useMemo} from 'react' const mockData = [ //임시데이터라는 뜻(mockData) { id: 0, name: "이정환", email: "king32@gmail.com" }, { id: 1, name: "김정환", email: "queen25@gmail.com" }, { id: 2, name: "하정환", email: "prince13@gmail.com" }, ] export const ContactStateContext = createContext(); export const ContactDispatchContext = createContext(); function App() { const [contact, setContact] = useState(mockData); const idRef = useRef(3) const onCreate = useCallback((name,email)=>{ const newContact = { id: idRef.current++, name: name, email: email, }; setContact([newContact, ...contact ]); },[]); const onDelete = useCallback((targetId) => { setContact(contact.filter((it) => it.id!== targetId)); },[]) const memoizedDispatch = useMemo( ()=>({onCreate, onDelete}),[] ); return( <div className="App"> <Header /> <ContactStateContext.Provider value={contact}> <ContactDispatchContext.Provider value={memoizedDispatch}> <ContactEditor /> <List /> </ContactDispatchContext.Provider> </ContactStateContext.Provider> </div> ) } export default App;

  • react
  • day17
ddorri83 댓글 1 좋아요 0 조회수 65

tailwinde-css

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

궁금한 점 : @apply 핑크로 변하지 않아도 실행은 됩니다! 상관 없는걸까요?? styles.module.css tailwind.config

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
skykwj0422 댓글 2 좋아요 0 조회수 80

강의노트가 자료에 있는건가요..? (답변이 늦어져도 괜찮습니다)

해결됨

이거 하나로 종결-고품질 리액트와 스프링부트 65시간 풀스택 개발 강의(도커, AWS, GITHUB-ACTIONS)

https://webzz.tistory.com 링크를 강의노트에 넣어놓을테니 꼭 확인 부탁드린다고 하셨는데 1. 자료안에 강의 노트가 안보입니다 2. https://webzz.tistory.com 이 사이트는 쿠팡 파트너스 사이트 같습니다ㅠㅠ

  • react
  • aws
  • docker
  • spring-boot
  • github-actions
emma0987 댓글 2 좋아요 1 조회수 205

.

미해결

React Native with Expo: 제로초에게 제대로 배우기

.

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
댓글 2 좋아요 0 조회수 157

로그인 성공시

미해결

스프링 부트와 리액트로 구현하는 소셜 로그인

로그인 성 공시 defaultSuccessUrl 에서는 "/todos" 로 설정하고 successHandler의 CustomLoginSuccessHandler 에서는 "/" 로 되어 있을때 어디로 리다이렉트 되어야하나요? 설명에는 defaultSuccessUrl 가 우선순위라고 하셨는데, 실행해보면 / 로 갑니다.

  • react
  • java
  • spring-boot
  • jpa
  • spring-security
thbnsig 댓글 2 좋아요 0 조회수 98

강의 자료 다운

미해결

따라하며 배우는 리액트 네이티브 기초

안녕하세요 강의때 사용하시는 강의 노트 자료는 어디서 다운 받으면 되나요? (설명하실 때 사용하시는 자료 문의드립니다. ) 소스코드는 다운 받기가 가능한데 강의때 사용하시는 pdf 인지는 모르겠지만 어디서 다운받을 수 있나요? 만약에 없으면 강의때 링크 클릭해서 들어가시던데 그 링크는 따로 강의마다 딸려 있을까요? 답변 부탁드립니다.

  • react
  • react-native
  • expo
kimdk1406 댓글 1 좋아요 0 조회수 118

SocialLoginWeb1303 소스 제공해 주시면 안되나요?

미해결

스프링 부트와 리액트로 구현하는 소셜 로그인

SocialLoginWeb1303 소스 제공해 주시면 안되나요?

  • react
  • java
  • spring-boot
  • jpa
  • spring-security
유종훈 댓글 1 좋아요 0 조회수 116

수업 관련 질문

미해결

React Native with Expo: 제로초에게 제대로 배우기

안녕하세요 제가 지금 토이프로젝트로 8월 말까지 앱의 mvp 기능을 만들고 싶어서 expo 강좌를 수강 신청 및 수강하게 되었습니다 제가 웹, 앱에 대한 지식이 전혀 없어서 gpt한테 물어보면서 진행을 해도 잘 이해하면서 하고 있지는 않은 것 같습니다 핵심개념들이 없는 것 같습니다 react, ts를 공부해야 이해가 될까요 ..?

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
seokjun4321 댓글 2 좋아요 0 조회수 88

"인터넷 연결을 해주세요!" 라는 메세지가 순간적으로 보이는 문제

해결됨

웹 개발자의 연봉을 올려주는 하이브리드앱 with Expo 프레임워크

작성하시 코드는 인터넷 연결이 정상적으로 되는 환경에서도 "인터넷 연결을 해주세요!" 라는 메세지가 보이게 되는 문제가 있는데, 실무에서는 어떻게 해결을 하시는지 궁금합니다.

  • react
  • react-native
  • next.js
  • expo
ibtg 댓글 1 좋아요 0 조회수 87

배포 후 모바일에서 접속하면 게시판 게시글이 안보이는 문제

해결됨

React, Node.js, MongoDB로 만드는 나만의 회사 웹사이트: 완벽 가이드

안녕하세요. 먼저 강의 잘 들었습니다. 다름이 아니라 배포 후 웹으로는 업무게시판의 게시글이 잘 보이는데 모바일로 접속 시에는 게시글이 없는 것으로 나옵니다. 웹 (개발자 도구로 모바일 디바이스 버전으로 봐도 잘 보입니다) 모바일 이유가 뭔지 궁금합니다~

  • HTML/CSS
  • javascript
  • react
  • node.js
  • mongodb
ys5133 댓글 2 좋아요 0 조회수 143

.

미해결

React Native with Expo: 제로초에게 제대로 배우기

.

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
댓글 2 좋아요 0 조회수 131

next.js 서버fetch 에러 fallback ui 구현 방법

미해결

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

next 공식문서를 살펴보면 단순 서버 fetch (서버액션x) 관련 에러 핸들링 방법은 딱히 안나와 있는 것 같아 질문드립니다. 만약 SectionA, SectionB, SectionC 서버 컴포넌트 내에서 각각 서버 fetch가 일어난다 가정했을 때 SectionB에서만 요청이 실패했다면 SectionB 영역만 fallback ui를 띄우고 나머지 SectionA, SectionC는 정상적으로 데이터를 렌더링하도록 구현하는 방법이 없을까요? error-boundary 라이브러리는 클라이언트 환경에서만 사용가능해 서버 컴포넌트에선 사용할 수 없고 next 내부적으로 설계되어있는 에러 바운더리(error.js 등)는 전역에러를 캐치하는 걸로 알고있습니다. 때문에 페이지 내 특정 영역만 fallback ui를 띄우는 용도는 아닌 것 같더라구요. 혹시 다른 방법이 있나 궁금합니다 감사합니다!!

  • react
  • next.js
  • react-query
  • next-auth
  • msw
변재정 댓글 2 좋아요 0 조회수 198

next.js 서버fetch 에러 fallback ui 구현 방법

해결됨

Next.js 까보기: "쓸 줄 아는 개발자"에서 "알고 쓰는 개발자"로

next 공식문서를 살펴보면 단순 서버 fetch (서버액션x) 관련 에러 핸들링 방법은 딱히 안나와 있는 것 같아 질문드립니다. 만약 SectionA, SectionB, SectionC 서버 컴포넌트 내에서 각각 서버 fetch가 일어난다 가정했을 때 SectionB에서만 요청이 실패했다면 SectionB 영역만 fallback ui를 띄우고 나머지 SectionA, SectionC는 정상적으로 데이터를 렌더링하도록 구현하는 방법이 없을까요? error-boundary 라이브러리는 클라이언트 환경에서만 사용가능해 서버 컴포넌트에선 사용할 수 없고 next 내부적으로 설계되어있는 에러 바운더리(error.js 등)는 전역에러를 캐치하는 걸로 알고있습니다. 때문에 페이지 내 특정 영역만 fallback ui를 띄우는 용도는 아닌 것 같더라구요. 혹시 다른 방법이 있나 궁금합니다 감사합니다!!

  • react
  • typescript
  • next.js
변재정 댓글 2 좋아요 0 조회수 232

rimraf 이후 npm i 진행 하니 앱이 구동이 안됩니다.

해결됨

React Native with Expo: 제로초에게 제대로 배우기

재설치, eas build 를 다시해도 아래와 같은 에러 문구가 계속 나오네요..

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
정채진 댓글 2 좋아요 0 조회수 97

git checkout 되돌리기

미해결

Git & GitHub, 원리부터 차근차근 - 근본깃 [AI 더빙]

추가 질문이 있는데요, git checkout [commit ID] 명령어는 현재 working directory의 tracked 파일들과 staging area 의 파일들을 해당 commit 의 상태로 되돌린다고 배웠는데요. 만약... 최종 커밋 이후 working directory에서 작업을 수행하다가, 실수로 git checkout 을 입력해버리면, 다시 기존의 (커밋되지 않은) working directory는 복구할 수 없는 것일까요?

  • git
  • github
yuntae.kang 댓글 2 좋아요 0 조회수 258

파일별 git checkout

해결됨

Git & GitHub, 원리부터 차근차근 - 근본깃 [AI 더빙]

안녕하세요. git checkout [commit ID] 를 통해 예전의 커밋으로 되돌릴 수 있다고 배웠는데요. 현재 working directory에 rectangle 및 circle 이 있고, 현재 커밋 버전이 3일 때, - rectangle 파일은 커밋 2로 되돌리고, - circle 파일은 커밋 1로 되돌리고 싶을 경우 각각의 파일에 대하여 다른 버전의 커밋으로 되돌리는 것이 가능한지 궁금합니다. 실무에서는 이런 일이 빈번하게 일어날 것으로 예상이 되어서요. 이를테면 a 파일에 버그가 난 걸 모른 채로 b 파일을 작업해서 커밋을 완료했는데, a 파일의 버그를 뒤늦게 발견하여 되돌리고자 하는데 이때 b 파일의 작업 내역은 되돌리고 싶지 않을 수 있으니까요. 감사합니다.

  • git
  • github
yuntae.kang 댓글 1 좋아요 0 조회수 92

counterReducer.ts

미해결

타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게

counterReducer.ts 파일은 왜 tsx파일이 아닌 ts인가요??

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
himy1114 댓글 2 좋아요 0 조회수 86

04-02 Next 페이지 이동

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

useState(0) 부분에서 오류가 나 실행이 안됩니다. 오류를 못찾겠어요ㅠㅠ 알려주세요

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
skykwj0422 댓글 2 좋아요 0 조회수 103

리퀘스트 메모이제이션은 클라이언트 컴포넌트에서도 동작하나요?

해결됨

한 입 크기로 잘라먹는 Next.js

안녕하세요. 정말 바보같은 질문이라고 생각하고 있는데요. 이런 질문 정말 죄송합니다. 리퀘스트 메모이제이션은 서버 측에서 렌더링하는 과정에서 일어난다고 하셨는데 클라이언트 컴포넌트도 서버 측에서 렌더링이 되긴 하니까 리퀘스트 메모이제이션이 가능하지 않을까 생각했습니다. 근데 useEffect에서 GET 요청으로 보낼 경우 서버측에서는 렌더링되지 않으니까 메모이제이션이 안 될 것으로 생각이 되었습니다. 클라이언트 컴포넌트에 리퀘스트 메모이제이션이 적용되지 않는다고 이해하면 될까요? 이런 리퀘스트 메모이제이션은 서버에서 일어나는거니까 당연히 Network 탭에서 확인이 불가능하겠죠? 그리고 병렬 라우트에서도 리퀘스트 메모이제이션이 동작하나요?

  • react
  • typescript
  • next.js
SUPER 댓글 1 좋아요 0 조회수 154

인기 태그

인프런 TOP Writers

주간 인기글