묻고 답해요
158만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨(2025) MBTI 테스트 기반 수익형 웹사이트 만들기 - <코딩 배워 사업하자>
CloudFlare 설정 질문
안녕하세요 잘 보고 있습니다.사이트 어느정도 만들긴 했는데요.가비아를 통해 도메인 만들고 클라우드 플레어에 연결해서 쓰고 있는데 https://www.사이트명은 되는데 https://사이트명 은 안되더라고요.문제가 구글 애드센스에서는 사이트명만 적도록 되어 있어서 어떻게 설정해야 하는지 알려주실 수 있으신가요?
-
해결됨한 입 크기로 잘라먹는 Next.js(v15)
강의 수강중 궁금한점이 생겨서 질문드립니다
제공해주신 백엔드 서버는 어떤 기술 스택으로 백엔드가 구성이 되었는지 궁금합니다.
-
해결됨한 입 크기로 잘라먹는 Next.js(v15)
프리페칭에 대한 질문
안녕하세요. 강의를 듣고 정리하면서 제가 이해한 게 맞는지 확인하고 싶어 질문드리게 되었습니다!클라이언트 컴포넌트를 포함하고 있는 서버 컴포넌트의 경우, 프리페칭 시 RSC payroad만 미리 가져오고 이후 해당 서버 컴포넌트에 접근하게 되면 클라이언트 컴포넌트를 실행하기 위해 JS Bundle을 불러오는 건가요?페이지를 캐시 및 하드 새로고침으로 진행했을 때 아래처럼 인덱스 페이지에서 이동할 수 있는 페이지인 search페이지와 book/1페이지의 RSC payroad만 프리페칭 되어있는 걸 볼 수 있었습니다.이후 위의 Link 태그를 통해 search 페이지로 이동했을 때 아래처럼 새롭게 search 페이지의 RSC payroad가 나타나는 이유가 뭔가요? book 페이지도 똑같이 RSC payroad가 새롭게 추가되는데 이미 인덱스 페이지에서 프리페칭을 통해 RSC payroad를 불러왔는데 추가되는 이유가 궁금합니다! 2번과 연관되어 있는데 search 페이지로 이동했을 때 인덱스 페이지의 RSC payroad가 네트워크에 나타나지 않는 건 인덱스 페이지에서 이동한 것이기 때문에 프리페칭이 일어나지 않기 때문인가요? 이것도 2번과 연관된 질문입니다! search 페이지나 book/1페이지에서 새로고침을 진행하고 인덱스 페이지로 넘어갈 때는 새롭게 인덱스 페이지에 대한 RSC payroad가 나타나지는 않는데 그 이유가 궁금합니다URL에 직접적으로 book/5로 이동하게 만들었는데, 프리페칭으로 네트워크상에 인덱스와 search, book/1의 RSC 페이로드뿐만 아니라 clinet-component 파일과 searchbar 파일에 대한 JS Bundle도 함께 들어와있는데 search 페이지가 동적인 페이지여도 같은 레이아웃을 사용하고 있는 인덱스 페이지가 정적인 페이지이기 때문에 clinet-component와 searchbar의 JS Bundle이 같이 프리페칭 된 건가요?
-
미해결제로베이스부터 배우는 웹개발의 개념과 바이브 코딩
커서에서 깃을 커맨드 프롬프트창에서 커밋하는 방법은 없나요? 마우스 클릭 말고요.
커서에서 깃을 커맨드 프롬프트창에서 커밋하는 방법은 없나요? 마우스 클릭 말고요.
-
미해결Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
캐시 관련 질문사항이 있습니다!
안녕하세요! 캐시관련 질문 사항이 있습니다! 현재, 강의 내용에선, react query를 사용한 클라이언트측 캐시와, unstable_cached 를 사용한 서버 캐시를 둘다 같은 하나의 데이터에 적용하신 모습을 확인하였습니다. 궁금증은, 현재 블로그 목록 조회는 두개 캐시 기법이 모두 적용되어 있는데, 둘 중 하나만 캐시를 해 놓아도 될 것 같다 라는 생각이 드는데, 이게 맞는지 궁금합니다. 혹시, 하나만 선택해야 된다면 이번 블로그 목록 케이스에서는 어떤 방식의 캐시를 적용하시는걸 추천하시나요?
-
해결됨(2025) MBTI 테스트 기반 수익형 웹사이트 만들기 - <코딩 배워 사업하자>
SNS 공유버튼 그룹 만들기 6:30~7:30 질문있습니다.
해쉬태그를 만들기 위해TestResult.jsx에서 아래 useState를 작성하셨는데,useEffect(() => { const testInfo = TESTS?.find((test) => test.info.mainUrl === testParam); if (!testInfo) { alert('존재하지 않는 테스트입니다.'); navigate('/'); } setRenderTestInfo(testInfo); const resultInfo = testInfo?.results?.find( (result) => result.query === resultParam ); if (!resultInfo) { alert('존재하지 않는 결과값입니다.'); navigate(`/${testInfo?.info?.mainUrl}`); } setRenderResultInfo(resultInfo); }, [testParam, resultParam, navigate]); 처음에 testParam, resultParam을 가지고 와리렌더링이 되면, useEffect 내 코드가 실행되고testInfo 변수에 값이 저장되겠죠 그리고 setRenderTestInfo(testInfo)를 통해 renderTestInfo에 저장되는 것까지 알겠습니다. <ShareButtonGroup testParam={testParam} resultParam={resultParam} renderTestInfo={renderTestInfo} />props로 넘기고const ShareButtonGroup = ({ testParam, resultParam, renderTestInfo }) => { // console.log('renderTestInfo', renderTestInfo.info.mainUrl); return ( <div> <h3>친구에게 공유하기</h3> <div> <FacebookShareButton url={`${baseUrl}/${testParam}/result/${resultParam}`} hashtag={`#${renderTestInfo?.info.mainTitle}`} > <FacebookIcon round={true} size={48} /> </FacebookShareButton> </div> </div> ); }; export default ShareButtonGroup; 해쉬태그에서 받아오면 undefined 오류로 넘어가지 않습니다. 강사님 영상은 별다른 오류가 없는데, 저는 계속 빈객체로 넘어가서 흐름을 생각해본건데, 제가 잘못 생각하고 있는 부분이 있는지 궁금합니다.
-
미해결실무에 바로 적용하는 프런트엔드 테스트 - 1부. 테스트 기초: 단위・통합 테스트
grid 양옆에 margin은 어디서 설정되어있는건가요 ?
찾아보니 잘안보여서 네비게이션 밑에 필터부터 전체 마진 양옆으로 먹어진거 ...로우당 그리드 개수 설정이랑 ..
-
미해결React 완벽 마스터: 기초 개념부터 린캔버스 프로젝트까지
데이터 캐싱 부분에 대해 질문있습니다.
안녕하세요 현재 고급- 데이터캐싱 부분의 강의를 보고 있는데 Fresh 상태에서는 데이터를 가져온 후 저장되어 있어 이 저장된 데이터를 사용하다 Stale상태가 되면 자동으로 다시 데이터가 요청되어 가져온다 라고 이해하고 있는데 맞는걸까요?
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
tailwind.config.ts 파일 설치가 안되는 문제
next js 14버전, tailwind도 3.4.17로 설치하였는데, @apply 가 먹히지 않네요. 어떻게 하나요?globals.css에도 @tailwind base;@tailwind components;@tailwind utilities;입력 시, 'Unkown at rule @tailwind' 라는 메시지가 송출됩니다. tailwind.config.ts (js->ts 변경) 파일에도module.exports = { content: [ "./pages/**/*.{js,ts,jsx,tsx}", "./components/**/*.{js,ts,jsx,tsx}", "./app/**/*.{js,ts,jsx,tsx}", "./src/**/*.{js,ts,jsx,tsx}", ], theme: { extend: { colors: { background: "var(--background)", foreground: "var(--foreground)", 철수가좋아하는색깔: "blue", 영희가좋아하는색깔: "green", }, }, }, plugins: [], }; 입력했습니다.
-
미해결React Native with Expo: 제로초에게 제대로 배우기
수강노트는 어디에서 볼수있나요?
수강노트는 어디에서 볼수있나요?깃에는 최종코드만 있어서 에러가 발생해가지구요실행시키기 위해 npx expo를 많이했는데도 에러가 발생하더라구요 ERROR Error: Cannot find native module 'ExpoLocation', js engine: hermes ERROR Error: Cannot find native module 'ExponentImagePicker', js engine: hermes
-
해결됨(2025) MBTI 테스트 기반 수익형 웹사이트 만들기 - <코딩 배워 사업하자>
React Build 문제
선생님 안녕하세요! 질문을 자주 남겨서 죄송합니다.방법을 찾으려고 애써봤지만 해결이 되지 않아 질문을 남기네요...우선 페이지 별 meta 태그를 넣어주기 위해 vite.config.js 파일에서 index.html이 필요한 라우팅 경로를 모두 넣어줬습니다. 대략 53개의 경로가 나오더군요.(루트 페이지,16가지 MBTI 결과*3, intro 페이지 *3, 블로그 페이지)이렇게 되니 빌드 시간 3분이 넘어가면서 빌드 중 다음과 같은 오류가 발생합니다.error during build: [Prerender Plugin] [plugin Prerender Plugin] Runtime.callFunctionOn timed out. Increase the 'protocolTimeout' setting in launch/connect calls for a higher timeout if needed. 우선 index.html 생성을 원하는 페이지를 강의에서 보여주는 예시를 넣었을때는 아무 이상없이 잘 됩니다. 제 생각에는 생성해야 할 index.html 파일의 수가 많아서 발생하는 에러같습니다.
-
미해결따라하며 배우는 리액트 A-Z[19버전 반영]
안녕하세요 개발과 상관없는 질문입니다만
안녕하세요 강사님 좋은 강의 감사드립니다vscode 테마 정보좀 알수있을까요?
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
완성 전에 배포
완성전에 확인차 배포를 했는데 완성 후 그냥 vercel만 입력하면 빌드까지 되는건가요?
-
미해결코딩 몰라도 OK! CursorAI로 시작하는 개발 생활 (웹/초급)
codebase 안뜨는 경우
실습과정 따라하는 중에 codebase가 안뜨더라구요.해결 방법을 찾으려해도 잘 안찾아져요..
-
해결됨한 입 크기로 잘라먹는 Next.js(v15)
404.tsx
🚨긴급 공지04.30 ~ 05.07 휴가 기간으로 인해 효빈님께서 답변을 대신 해 주실 예정입니다.불편함을 드려 죄송합니다. 금방 복귀하겠습니다 🫡 🚨 필독) 질문하시기 전에 꼭 읽어주세요 (10초 소요)제목을 구체적으로 작성해 주세요✅ 좋은 예 : 감정일기장 Home 구현중 xx 이슈가 발생합니다.⛔️ 나쁜 예 : 이거 왜 안되나요?, 오류나요 도와주세요 등비슷한 궁금함을 갖고 계신 분들께 도움이 될 수 있어요! 코드의 이슈는 전체 프로젝트를 "링크 형태"로 올려주셔야 원인을 파악할 수 있습니다.깃허브, 구글드라이브 등의 수단을 통해 링크 형태로 전달해주세요직접 실행해보며 원인을 파악해야 하기 때문에 텍스트 형태로 붙여넣는건 삼가해주세요 🥲 답변이 도움이 되셨다면 답글 or 해결완료 버튼을 클릭해주세요비슷한 궁금함을 갖고 계신 분들께 도움이 될 수 있어요!제 답변이 여러분께 도움이 되었는지 저도 알고 싶어요 🥲 강의 내용에 궁금한 점이 있다면 몇 챕터의 몇 분 몇 초인지 알려주시면 더 좋아요더 빠른 답변이 가능합니다!강의랑 동일하게 [[...id]].tsx랑 404.tsx 만들었는데 url을 http://localhost:3000/book/123-123123로 해도 왜 잘 표현 될까요?http://localhost:3000/adfafdas 이런식으로 하면 404페이지로 잘 이동 됩니다.
-
미해결Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
제 에디터에선 notepad가 안나와요
저는 왜 notepad가 안뜰까요?
-
미해결Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
서버/클라이언트 컴포넌트를 나누는 기준이 궁금합니다.
안녕하세요! 학습 중, 궁금한게 있어 질문 드립니다!이번 무한 스크롤 과정에서는 클라이언트 컴포넌트가 사용되었는데, 순수 서버 컴포넌트로는 개발하기는 거의 불가능에 가깝다고 느껴졌습니다. 가정을 하면, "사용자의 동작 혹은 이벤트에 따라서 랜더링 요소가 변경되어야 한다" 면, 클라이언트 컴포넌트를 거의 사용해야 될 것 같다라고 생각이 됩니다. 이러한 케이스가 아니라면, 대부분 서버 컴포넌트로 하는것이 좋다(?) 라고 느껴집니다.보안성...? 응답 성능적으로도, SEO 관점으로도...혹시 위의 내용이 틀리거나, 또 다르게 판단을 해야될 기준? 같은게 있을까요?
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
섹션 5. React.js 개론 - 구동원리에서 강의와 제 코드가 다릅니다
안녕하세요 강의 잘 듣고 있습니다현재 섹션 5. React.js 개론 - 구동원리를 듣고 있는데 import { StrictMode } from 'react' import { createRoot } from 'react-dom/client' import './index.css' import App from './App.jsx' createRoot(document.getElementById('root')).render( <StrictMode> <App /> </StrictMode>, )강의에 있는 코드와 제 main.jsx의 코드가 달라서요.. 전부 똑같이 설치했는데 달라도 괜찮은건가요?
-
해결됨아바타 커뮤니티앱 만들기 (React Native Expo)
저장 버튼이 생기지 않습니다.
저장 버튼을 동일하게 작성했는데 화면상에 그려지지 않더라구요. 공식문서도 확인해보고 찾아보는데, isFocused나 useLayoutEffect등을 통해 실험해봐도 저장 버튼이 보이지 않습니다.무엇을 잘못 작성했나 싶어 자료를 다운로드 받아 post 의 _layout.tsx 와 write.tsx도 복사, 붙여넣기 하여 확인했는데도 저장버튼이 보이지 않았습니다. 그런데, post의 _layout에서 headerRight을 작성하니 보입니다. setOptions가 동작하지 않는 것 같이 보이는데, 원인을 잘 모르겠습니다.어떻게 해결하면 될까요? import CustomButton from "@/components/CustomButton"; import DescriptionInput from "@/components/DescriptionInput"; import TitleInput from "@/components/TitleInput"; import useCreatePost from "@/hooks/queries/useCreatePost"; import { ImageUri } from "@/types"; import { useNavigation } from "expo-router"; import { useEffect } from "react"; import { FormProvider, useForm } from "react-hook-form"; import { StyleSheet } from "react-native"; import { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view"; type FormValues = { title: string; description: string; imageUris: ImageUri[]; }; export default function PostWriteScreen() { const navigation = useNavigation(); const createPost = useCreatePost(); const postForm = useForm<FormValues>({ defaultValues: { title: "", description: "", imageUris: [], }, }); const onSubmit = (formValues: FormValues) => { createPost.mutate(formValues); }; useEffect(() => { navigation.setOptions({ headerRight: () => ( <CustomButton label="저장" size="medium" variant="standard" onPress={postForm.handleSubmit(onSubmit)} /> ), }); }, []); return ( <FormProvider {...postForm}> <KeyboardAwareScrollView contentContainerStyle={styles.container}> <TitleInput /> <DescriptionInput /> </KeyboardAwareScrollView> </FormProvider> ); } const styles = StyleSheet.create({ container: { margin: 16, gap: 16, }, }); import { colors } from "@/constants"; import { Feather } from "@expo/vector-icons"; import { Link, Stack } from "expo-router"; export default function PostLayout() { return ( <Stack screenOptions={{ headerTintColor: colors.BLACK, contentStyle: { backgroundColor: colors.WHITE, }, }} > <Stack.Screen name="write" options={{ title: "글쓰기", headerShown: true, headerLeft: () => ( <Link href={"/"} replace> <Feather name="arrow-left" size={28} color={"black"} /> </Link> ), }} /> </Stack> ); } +추가로 확인한 부분.app의 _layout.tsx에서 <Stack.Screen name="post" options={{ headerShown: false }} />이 친구를 주석하면 헤더가 두 개 나오게 되는데, 숨겨놨던 루트에 저장 버튼이 떠 있더라구요.이걸 어떻게 수정하면 되는건지.. 어렵네요
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
[30-01] 웹 에디터와 폼 라이브러리
안녕하세요해당수업중 강의 내용대로 했는데 실행시 아래와 같이 에러 뜨고 정상 실행이 안됩니다. TypeError: react_dom_1.default.findDOMNode is not a functionat ReactQuill.getEditingArea (http://localhost:3000/_next/static/chunks/node_modules_5754136c._.js:16760:43)at ReactQuill.instantiateEditor (http://localhost:3000/_next/static/chunks/node_modules_5754136c._.js:16631:50)at ReactQuill.componentDidMount (http://localhost:3000/_next/static/chunks/node_modules_5754136c._.js:16590:14)at LoadableComponent (http://localhost:3000/_next/static/chunks/_2df4111c._.js:296:57)at WebEditorPage (http://localhost:3000/_next/static/chunks/_2df4111c._.js:81:215)at ClientPageRoot (http://localhost:3000/_next/static/chunks/node_modules_next_dist_1a6ee436._.js:2053:50)