강의 난이도에대해서
미해결
[React / VanillaJS] UI 요소 직접 만들기 Part 1
혹시 강의 난이도에 대해서 문의드리고싶은데... 저만 어렵게 느껴지는건...아니겠죠..?
- react
- typescript
- dom
- ui
- vanilla-js
프론트엔드마스터
댓글 1
좋아요 0
조회수 146
묻고 답해요
173만명의 커뮤니티!! 함께 토론해봐요.
.
미해결
React Native with Expo: 제로초에게 제대로 배우기
.
- react
- react-native
- 하이브리드-앱
- typescript
- expo
이영훈
댓글 1
좋아요 0
조회수 82
React.lazy()
미해결
타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게
서비스를 보다보면 상품 리스트의 "더보기"나 상품 상세 설명에서의 "더보기" 와 같은 기능이 있는데, 이럴 때 React.lazy() 가 사용되는 건가요?
- react
- react-router
- redux-toolkit
- zustand
- react.js
챙준
댓글 2
좋아요 0
조회수 67
섹션5부터...
미해결
코드로 배우는 React 19 with 스프링부트 API서버
섹션5부터 자바 프로젝트가 완전 바뀌어 있는데 만들어야될 db정보도 없고... 어찌해야 할지 모르겠네요...
- react
- typescript
- spring-boot
- jpa
- jwt
feelsagood
댓글 1
좋아요 0
조회수 98
[소셜 로그인 16강] 로그인 실패 시 리다이렉트 관련 질문
미해결
스프링 부트와 리액트로 구현하는 소셜 로그인
16강을 수강하고 있습니다. CustomLoginFailureHandler 사용자가 로그인에 실패했을 때 호출되는 메서드에 대한 질문입니다. if(savedRequest != null) { String targetUrl = savedRequest.getRedirectUrl(); //사용자가 접근하려던 URL // 즉, 로그인에 실패했지만 사용자를 원래 있던 페이지로 보내줌 // 실패 시 사용자가 접근하려던 URL 로그 출력 log.info("[핸들러 - 사용자가 접근 시도한 URL]\n-> " + targetUrl); // 사용자가 접근하려던 URL로 리다이렉트 (로그인 실패 후에도 이동) response.sendRedirect(targetUrl); } 그런데 if문의 마지막 줄을 보면 로그인 실패 후에도 targetUrl 즉, 사용자가 접근하려했던 페이지로 이동시킨다고 작성 되어 있는데 ... 로그인 실패 시에도 targetUrl로 리다이렉트시키는 이유가 뭔가요?? 로그인에 실패하면 로그인 페이지에 남아있어야 하는 것 아닌가요 ...?
- react
- java
- spring-boot
- jpa
- spring-security
정수현
댓글 2
좋아요 0
조회수 103
Map 강의 누락된 것 같습니다.
해결됨
프론트엔드 마스터클래스
안녕하세요! 강의가 누락된 것 같아 글 작성합니다. 확인부탁드릴게요! 30강 Map 강의로부터 31강까진 문제없이 연결되는데, 32. WeakRef + FinalizationRegisty 강의시작부터 연결이 매끄럽지 못합니다. 뜬금없이 대안?에 대해서 나오는데 Map 예제부분과 WeakMap 부분이 누락된것같습니다.
- javascript
- react
- 함수형-프로그래밍
- 객체지향
- next.js
모던
댓글 2
좋아요 0
조회수 187
브라우저의 렌더링 과정 질문
미해결
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
좋은 강의 감사합니다. React.js 소개 부분을 보며 궁금한점이 있어 문의드립니다. 화면 업데이트 관련 브라우저 렌더링 과정은 React.js뿐 아니라 Vue.js에서도 동일하게 적용되나요? 예를들면, Virtual Dom에서 한번에 모아 Actual DOM에 적용되는 방식등이요
- javascript
- react
- node.js
- 카카오공채-개발
kmh880507
댓글 2
좋아요 0
조회수 85
Context API 리랜더링 방지를 위한 Memoization에 대한 질문
미해결
타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게
계속해서 학습을 진행중인데, 함수값을 넘길때에는 useCallback을 사용해야한다는 것으로 알고있었는데, >>밑에는 실제 강의 중 공유해 주신 ContextProvider 안에 함수들 const increment = () => { setCount((count) => count + 1); }; const decrement = () => { setCount((count) => count - 1); }; const reset = () => { setCount(0); }; const memoization = useMemo(()=>({ increment, decrement, reset }),[]); >>제가 생각했던 방식 const increment = useCallback(() => { setCount((count) => count + 1); },[]); const decrement = useCallback(() => { setCount((count) => count - 1); },[]); const reset = useCallback(() => { setCount(0); },[]); const memoization = useMemo(()=>({ increment, decrement, reset }),[increment, decrement, reset]); 저는 밑에 memoization 변수를 빼고 바로 useCallback을 이용해서 객체값으로 넘겨주는 식으로 작성해야 한다고 생각을 했었습니다. 코드를 작성하는 방법에는 정답은 없지만, 당장은 기본에 입각한 학습을 해야하기에 어떤 방법이 조금 더 효율적인지 여쭤보고 싶습니다.
- react
- react-router
- redux-toolkit
- zustand
- react.js
유키
댓글 2
좋아요 0
조회수 73
저도 피그마 강의 자료 이미지 누락 문제 관련 문의드립니다.
해결됨
[VOD] 6주 완성! 개발 실무를 위한 고농축 바이브코딩 (Cursor AI, Figma)
안녕하세요! 저도 동일한 현상을 겪고 있습니다. 레이아웃은 그대로 복제되는데, 이미지가 모두 누락되어 있습니다. 제 생각에는 수강생들에게 보기 권한만 부여되어 있어서 해당 리소스에 접근할 수 없고, 그로 인해 파일 복제 시 이미지가 빠지는 것 같습니다. 혹시 가능하시다면, 모든 수강생이 문제없이 접근할 수 있도록 이미지를 파일 내에 직접 포함한 버전으로 자료를 수정해 다시 업로드해 주실 수 있을까요? 그렇게 해주신다면 저를 포함한 다른 수강생들도 문제없이 실습을 진행할 수 있을 것 같습니다. 바쁘시겠지만 확인 부탁드립니다. 좋은 강의 감사드립니다!
- react
- next.js
- cursor
- 프롬프트엔지니어링
- 바이브코딩
- figma
조내일
댓글 2
좋아요 0
조회수 225
.
미해결
React Native with Expo: 제로초에게 제대로 배우기
.
- react
- react-native
- 하이브리드-앱
- typescript
- expo
이영훈
댓글 2
좋아요 0
조회수 113
안녕하세요
미해결
[25.10.02] 코드캠프 라이브 테스트
모야모야 이거 모야
- react
- python
- java
성실한 도마뱀
댓글 1
좋아요 0
조회수 42
궁금한 점 5가지 있습니다.
미해결
[25.10.02] 코드캠프 라이브 테스트
하루에 4번 사랑을 말하기 8번 웃기
- react
- python
- java
썸머
댓글 1
좋아요 1
조회수 56
여기에 쓰면 무슨 질문이지
미해결
[25.10.02] 코드캠프 라이브 테스트
하이
- react
- python
- java
인프런 애시
댓글 1
좋아요 1
조회수 51
.
미해결
React Native with Expo: 제로초에게 제대로 배우기
.
- react
- react-native
- 하이브리드-앱
- typescript
- expo
이영훈
댓글 2
좋아요 0
조회수 182
동적페이지 풀라우트 캐시 질문 있습니다.
미해결
한 입 크기로 잘라먹는 Next.js
강의에서 book/4는 동적 페이지인데 첫 접속 후 Full Route Cache에 저장되어 두 번째 접속이 빨라진다고 했습니다. 동적 페이지는 Full Route Cache에 저장되지 않는다고 배웠는데 왜 적용되나요? .next 폴더에 해당 페이지가 남아있는 것을 확인했는데, 이것이 Full Route Cache 적용을 의미하나요? npm run start로 프로덕션 모드에서 테스트했는데 첫 접속과 두 번째 접속 모두 170ms로 동일합니다. 왜 속도 차이가 없나요? import { notFound } from "next/navigation"; import style from "./page.module.css"; import { BookData } from "@/types"; // export const dynamicParams = false; export function generateStaticParams() { return [{ id: "1" }, { id: "2" }, { id: "3" }]; } export default async function Page({ params, }: { params: Promise<{ id: string | string[] }>; }) { const { id } = await params; const response = await fetch( `${process.env.NEXT_PUBLIC_API_SERVER_URL}/book/${id}` ); if (!response.ok) { if (response.status === 404) { notFound(); } return <div>오류가 발생했습니다...</div>; } const book: BookData = await response.json(); const { coverImgUrl, title, subTitle, author, publisher, description } = book; return ( <div className={style.container}> <div className={style.cover_img_container} style={{ backgroundImage: `url('${coverImgUrl}')` }} > <img src={coverImgUrl} /> </div> <div className={style.title}>{title}</div> <div className={style.subTitle}>{subTitle}</div> <div className={style.author}> {author} | {publisher} </div> <div className={style.description}>{description}</div> </div> ); } 🚨 필독) 질문하시기 전에 꼭 읽어주세요 (10초 소요) 제목을 구체적으로 작성해 주세요 ✅ 좋은 예 : 감정일기장 Home 구현중 xx 이슈가 발생합니다. ⛔ ️ 나쁜 예 : 이거 왜 안되나요?, 오류나요 도와주세요 등 비슷한 궁금함을 갖고 계신 분들께 도움이 될 수 있어요! 코드의 이슈는 전체 프로젝트를 "링크 형태"로 올려주셔야 원인을 파악할 수 있습니다. 깃허브, 구글드라이브 등의 수단을 통해 링크 형태로 전달해주세요 직접 실행해보며 원인을 파악해야 하기 때문에 텍스트 형태로 붙여넣는건 삼가해주세요 🥲 답변이 도움이 되셨다면 답글 or 해결완료 버튼을 클릭해주세요 비슷한 궁금함을 갖고 계신 분들께 도움이 될 수 있어요! 제 답변이 여러분께 도움이 되었는지 저도 알고 싶어요 🥲 강의 내용에 궁금한 점이 있다면 몇 챕터의 몇 분 몇 초인지 알려주시면 더 좋아요 더 빠른 답변이 가능합니다!
- react
- typescript
- next.js
- 카카오공채-개발
hinpuo
댓글 2
좋아요 0
조회수 110
제가 신청한강좌들 무제한으로 변경즘부탁드릴게요
해결됨
[자바스크립트부터 리액트까지] 포기없는 React로 가는 길 [Full vers.]
[자바스크립트부터 리액트까지] 포기없는 React로 가는 길 [Full vers.] 122 / 122강(100%) 2027. 01. 01. 23:59 만료 모던 웹 인터렉티브 CSS3 부트캠프 [Full vers.] 78 / 78강(100%) 2027. 01. 01. 23:59 만료 쌩초보, 비전공자를 위한 [HTML 스타터] 부트캠프 이3강좌가 수강기간이 제한이있어서 무제한으로 변경즘부탁드립니다.
- javascript
- react
- jquery
- typescript
- es6
pcdo.omco
댓글 2
좋아요 0
조회수 113
퀴즈 질문 풀이 오류
미해결
Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
저는 아무래도 정답이 C 같은데.. 질문에서 /docs 도 포함되어야 한다고 했으므로, 옵셔널 캐치올만이 루트 경로( /docs )까지 모두 처리할 수 있는거 아닌가요? 다 학습하고 혼란이 오네요..
- react
- 블로그
- next.js
- cursor
- cursorai
Junho
댓글 2
좋아요 0
조회수 122
팔로우 추천 목록이 빈 배열로 들어옵니다.
해결됨
Next + React Query로 SNS 서비스 만들기
안녕하세요. 팔로우 추천 API는 팔로워 수가 많은 순으로 최대 3명을 가져오도록 되어 있는 것으로 알고 있습니다. 현재 발생하는 현상으로는 회원가입한 유저가 없는 경우에 기존 유저에게 추천 목록이 빈 배열로 나타납니다. 그런데 회원가입 후 로그인하면 추천 목록에 로그인한 본인 아이디가 뜨고, 로그아웃 후 기존 유저 A로 로그인하면 이전에 회원가입한 유저 아이디가 추천 목록에 나타납니다. 기존 유저 A가 그 회원가입 한 유저를 팔로우한 상태에서, 다른 기존 유저 B로 로그인하면 A가 팔로우했던 아이디가 추천 목록에서 사라져 있습니다. 팔로우나 언팔로우 기능을 사용할 때 데이터는 정상적으로 들어오는 것으로 확인되고, 팔로워가 있는 아이디가 추천 목록에 나타나야 하는데 빈 배열로 표시됩니다. 어느 부분을 점검해야 문제를 정확히 파악할 수 있을지 감이 잡히지 않아 질문 남겨봅니다..! import { MouseEventHandler } from "react"; import { User } from "@/model/User"; import { useMutation, useQueryClient } from "@tanstack/react-query"; import { useSession } from "next-auth/react"; type Props = { user: User; }; export default function FollowRecommend({ user }: Props) { const queryClient = useQueryClient(); const { data: session } = useSession(); const followed = !!user.Followers?.find((v) => v.id === session?.user?.id); // 팔로우 const follow = useMutation({ // 호출 시마다 userId를 전달 mutationFn: (userId: string) => { return fetch( `${process.env.NEXT_PUBLIC_BASE_URL}/api/users/${userId}/follow`, { method: "POST", credentials: "include", }, ); }, onMutate: (userId: string) => { const data: User[] | undefined = queryClient.getQueryData([ "users", "followRecommends", ]); if (data) { // 내가 팔로우 하는 대상 // User 배열 중에 팔로우 버튼을 누른 대상의 userId를 찾아서 그 유저의 Followers 수정 const index = data.findIndex((users) => users.id === userId); const shallow = [...data]; shallow[index] = { ...shallow[index], Followers: [{ id: session?.user?.id as string }], _count: { ...shallow[index]._count, Followers: shallow[index]._count.Followers + 1, }, }; queryClient.setQueryData(["users", "followRecommends"], shallow); } }, onError: (error, userId: string) => { console.error("팔로우/언팔로우 에러:", error); console.log("실패한 userId:", userId); const data: User[] | undefined = queryClient.getQueryData([ "users", "followRecommends", ]); if (data) { const index = data.findIndex((users) => users.id === userId); const shallow = [...data]; shallow[index] = { ...shallow[index], // 내 아이디가 대상 유저의 팔로워 목록에서 빠져야함 Followers: shallow[index].Followers.filter( (f) => f.id !== (session?.user?.id as string), ), _count: { ...shallow[index]._count, Followers: shallow[index]._count.Followers - 1, }, }; queryClient.setQueryData(["users", "followRecommends"], shallow); } }, }); // 팔로우 끊기 const unfollow = useMutation({ mutationFn: (userId: string) => { return fetch( `${process.env.NEXT_PUBLIC_BASE_URL}/api/users/${userId}/follow`, { method: "DELETE", credentials: "include", }, ); }, onMutate: (userId: string) => { const data: User[] | undefined = queryClient.getQueryData([ "users", "followRecommends", ]); if (data) { const index = data.findIndex((users) => users.id === userId); const shallow = [...data]; shallow[index] = { ...shallow[index], Followers: shallow[index].Followers.filter( (f) => f.id !== (session?.user?.id as string), ), _count: { ...shallow[index]._count, Followers: shallow[index]._count.Followers - 1, }, }; queryClient.setQueryData(["users", "followRecommends"], shallow); } }, onError: (error, userId: string) => { const data: User[] | undefined = queryClient.getQueryData([ "users", "followRecommends", ]); if (data) { const index = data.findIndex((users) => users.id === userId); const shallow = [...data]; shallow[index] = { ...shallow[index], Followers: [{ id: session?.user?.id as string }], _count: { ...shallow[index]._count, Followers: shallow[index]._count.Followers + 1, }, }; queryClient.setQueryData(["users", "followRecommends"], shallow); } }, }); const onFollow: MouseEventHandler<HTMLButtonElement> = (e) => { e.stopPropagation(); e.preventDefault(); if (followed) { console.log("언팔로우"); unfollow.mutate(user.id); } else { console.log("팔로우"); follow.mutate(user.id); } };
- react
- next.js
- react-query
- next-auth
- msw
개미
댓글 1
좋아요 0
조회수 167
강의자료 관련 질문
미해결
[React / VanillaJS] UI 요소 직접 만들기 Part 1
안녕하세요 오늘 강의를 구매했는데, 깃헙클론 부터 초기셋팅 하는법이 어딨는지 몰라서... 혹시 캡처로 첨부드린 내용이 어딨는지 알 수 있을까요?? 감사합니다
- react
- typescript
- dom
- ui
- vanilla-js
댓글 2
좋아요 0
조회수 108
filter함수, map함수 등 중괄호를 썼을때의 문제점
해결됨
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
이런식으로 함수 표시 방식인 ()=>{} 이렇게 사용을 하면 삭제 버튼을 눌렀을 때 모든 리스트가 사라집니다. 또한 앞에서 사용했던 map함수 같은 경우에도 강의와는 다르게 중괄호를 쓰면 문제가 생겼어서 소괄호로 바꿨더니 정상적으로 돌아갔었습니다. 현재 위 함수들에는 중괄호를 쓰면 안되는걸까요?? 참고로 map함수는 한 줄이 아니라 여러줄이었는데도 중괄호를 쓰면 에러, 소괄호를 써야 정상작동했었습니다. 정환님 책에는 별다른 말이 없고 강의에도 별다른 얘기가 없어서 미치겠습니다ㅜㅜㅜㅜㅜ
- javascript
- react
- node.js
- 카카오공채-개발
gogomini
댓글 2
좋아요 0
조회수 102
인기 태그
인프런 TOP Writers
- 정현섭 7
- eggmun(문성진) 4
- hush park 4
- 꿈이 있는 자유 4
- 박효정 3
- morneau 3
- Like me black 3
주간 인기글
- 🚀 IT 공부는 했는데 왜 아직도 안 될까요? | AI와 함께 실무 중심 IT 모임 🤖 NOESIS
- 🚀 끝까지 만들어 본 적 있나요? | 실서비스 완성 + 수익 창출 모임 💰 catalyst collectiv
- 🚀 끝까지 만들어 본 적 있나요? | 실서비스 완성 + 수익 창출 모임 💰 catalyst collectiv
- 🚀 끝까지 만들어 본 적 있나요? | 실서비스 완성 + 수익 창출 모임 💰 catalyst collectiv
- 🚀 IT 공부는 했는데 왜 아직도 안 될까요? | AI와 함께 실무 중심 IT 모임 🤖 NOESIS