173만명의 커뮤니티!! 함께 토론해봐요.
미해결
Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
안녕하세요, cursor에서 설정 > rules & memories 선택 > Project Rules에서 +Add Rule 선택 > project-structure.mdc 생성하면 강사님 화면처럼 rule type 선택할 수 있는 창이 안 뜹니다. 이유가 뭔지 잘 모르겠습니다 ㅜ
미해결
Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
클라이언트 컴포넌트는 서버에서 사전렌더링이 된다고 했는데 이 의미가 하이드레이션 하는부분만 제외하고 html로 렌더링해준다는 말인가요? 서버는 <div data-nextjs-client-component="..."></div> 같은 placeholder 만 내려주고 서버에서 HTML로 렌더링되지 않는다는 말도 있어서 헷갈립니다ㅠㅠ!!
미해결
Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
아무리 해도 안되서, 기존 코드를 복붙하고 사용하고, 공식문서를 봐도 페이지 properties의 Author.people[0] 내부에는 { id: "0219380..." , object: "user" } 만 있습니다. 이마저도 문자열이라 name프로퍼티가 없습니다. 노션 템플릿도 author가 적용이 되어있는 걸 확인했는데요. 혹시 api가 변경이 된 것일까요?
미해결
Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
안
미해결
비전공자도 가능한 초간단 단톡방 만들기 (바이브코딩, Cursor AI)
저는 답변이 한글로 나오지 않는데요. 선생님의 경우, 한글로 나오네요. 그리고 피그마의 경우, 동일하게 하는데 MCP화면설정이 다르고 내용을 넣어도 다르게 진행되어서요, pro를 사용하셔서 그런걸까요?
해결됨
Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
안녕하세요. 지금까지 알려주신 내용에서 Notion 통해 글을 추가/삭제했을 때, 그에 대한 반영이 이루어지기 위해 unstable_cache 적용 시 revalidate 옵션(단위: s(초))을 줘야 하는 것을 확인했습니다. (getPublishedPosts 구현부분에서 언급되지 않은부분이라 강의내용과 공식문서 토대로 동작 확인했습니다.) Notion이 아닌 실제 페이지에서 글쓰기를 했을 때는 revalidateTag 함수를 호출하여 캐시를 무효화시켰었습니다. 문제는 목록 가져올때도 매번 revalidateTag 함수를 사용하게 된다면 캐시 사용하는게 무의미해질거라 생각합니다. 즉시 반영을 위해서는 Webhook 연동이 필요해보이나, 생각보다 구현 난이도가 복잡해서 revalidate를 적절하게 주는게 좋을거라 생각했습니다. 그렇다면 효율적인 revalidate 값은 어느정도로 지정하는게 좋을까요?? TanStack Query ClientProvider에서 지정한 것처럼 1분 정도가 적절하려나요?? 그리고 실제 구현 이루어지는 프로그램(ex. 쇼핑몰)에 따라 기준이 달라질 것 같은데요. 이에 대한 강사님 의견 듣고싶습니다.
미해결
비전공자도 가능한 초간단 단톡방 만들기 (바이브코딩, Cursor AI)
firebase 프로젝트 생성하고 설정하고 있는데 Authentication > 로그인방법 설정중에 어느 방법을 선택해도 아래 이미지와 같이 업데이트 오류라는 문구가 뜨고 저장이 안됩니다. 데이터베이스 만들기 과정에서도 '위치'란에 아무 select박스가 안뜹니다. 프로젝트 생성은 영상과 동일하게 하였는데 프로젝트가 제대로 생성이 안된건지 문제가 뭔지 모르겠습니다.
미해결
Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
루트 page.tsx에서 사용하는 컴포넌트는 pages/_components/ 여기에 바로 넣으셨는데 그럼 about 페이지에서만 사용하는 컴포넌트는 pages/_components/about/ 이 경로에 배치하면될까요?
해결됨
Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
안녕하세요. 강의 내용과 다르게 author 데이터가 안나와서 콘솔로그 찍어서 확인해보니, properties.Author.people 항목에 name이 없네요. 다른 데이터는 조회되고 있는데 왜 안나오는지 도저히 답을 찾을 수 없네요. 공식문서 봐도 응답형식 같은게 바뀐건 아닌것 같아보입니다. AI Assistant에 여러번 질문해봐도 명확한 해결책을 찾지 못했습니다. 이 부분때문에 진도를 나가기 쉽지 않은 상황인데 빠른 답변 부탁드립니다.
미해결
Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
강의 영상에서 getPostMetadata 메서드 내부에서 getCoverImage 메서드를 선언하여 커버 이미지를 다루고 있는데, 저는 이 함수가 내부에 선언된 이유를 두 가지로 이해했습니다. 캡슐화 및 스코프 제한 : 외부에서 사용할 필요가 없는 함수이므로 내부에 선언해 함수의 범위를 명확히 제한 가독성 향상 : 커버 처리 로직을 분리하여 주 함수의 가독성을 개선 그런데 영상을 보면서 든 궁금증이 한 가지 있습니다. 현재 코드에서는 getCoverImage 에 page.cover 를 매개변수로 전달하고 있는데, getPostMetadata 내부에서만 사용되는 함수라면, 클로저를 이용해 page 에 직접 접근하는 방식이 더 자연스럽지 않나요? function getPostMetadata(page: PageObjectResponse): Post { const getCoverImage = () => { if (!page.cover) return ''; switch (page.cover.type) { case 'external': return page.cover.external.url; case 'file': return page.cover.file.url; default: return ''; } }; return { coverImage: getCoverImage(), // ... }; } 이렇게 하면 page.cover 를 매개변수로 전달하지 않아도 되어 더 간결하고, 함수 내부에서도 page 에 자유롭게 접근하여 처리할 수 있다고 생각합니다. 물론 정답은 없겠지만 클로저를 활용하여 외부 스코프에 직접 접근하는 방식 명확하게 매개변수를 전달하여 의도를 분리하는 방식 이 두 가지 방식 중 위 상황에서는 어떤 방식이 더 바람직한지, 혹은 상황에 따라 어떤 기준으로 선택해야 하는지 궁금합니다!
미해결
Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
안녕하세요 강사님의 강의 항상 정말 잘 듣고있습니다! 프로젝트 세팅 관련 질문이 있습니다! 강의 자료의 Project Rules 추가 부분은 커서ai 업데이트로 살짝 달라진 부분이 있는데요 추가로 주신 rules 강의 자료 봤는데 잘 모르겠어서 질문드립니다! 이런식으로 하는거 맞나요? 그리고 Notepads 역할 설정도 rules manual로 대체 가능하다고 하신거 같은데 이 경우 파일 확장자가 .mdc로 되는데 이렇게 해도 되는건가요?
미해결
Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
최신 cursor에는 project rules 작성 시에 타입을 정할 수 있는데 4가지 중에 어떤 타입으로 하면 되는지, 패턴 "app/**/*.{ts,tsx}"은 어디에 넣어야할지도 같이 업데이트 해주시면 좋을 것 같습니다 !
해결됨
Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
안녕하세요~ 강의 잘 보고 있습니다! 현재 cursor 0.49.6 버전을 사용중입니다. 영상에서 사용중인 버전은 Rule Type을 설정할 수 없는데 현재 제가 사용중인 버전에서는 아래와 같이 여러 옵션을 선택할 수 있습니다 여기서 궁금한게 Notepad로 만들지 않고 Project Rules로 설정한 후 Manual 로 설정하면 제가 원할때마다 직접 참고할 수 있도록 할 수 있는 것 같더라구요. 뭔가 notepad 기능들이 project rules로 흡수된 것 같은데 project rules로 등록해서 사용해도 문제 없을까요..??
미해결
Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
노션 글에 코드블록을 포함시키고 코드가 한 줄로 긴 경우에 width가 부모보다 커져서 스타일이 깨지게 됩니다. global.css에 스타일을 적용해봐도 해결이 안됩니다 ㅠㅠ
해결됨
Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
에러화면 /mdx-page 렌더링이 안됩니다... 작업 순서 패키지 설치 npm install @next/mdx @mdx-js/loader @mdx-js/react @types/mdx next.config.ts import type { NextConfig } from 'next'; import createMDX from '@next/mdx'; const nextConfig: NextConfig = { /* config options here */ // experimental: { // typedRoutes: true, // }, images: { remotePatterns: [ { hostname: 'picsum.photos', }, { hostname: 'images.unsplash.com', }, { hostname: 'www.notion.so', }, { hostname: 'prod-files-secure.s3.us-west-2.amazonaws.com', }, ], }, pageExtensions: ['js', 'jsx', 'md', 'mdx', 'ts', 'tsx'], }; const withMDX = createMDX({ // Add markdown plugins here, as desired }); // Merge MDX config with Next.js config export default withMDX(nextConfig); mdx-components.tsx import type { MDXComponents } from 'mdx/types'; export function useMDXComponents(components: MDXComponents): MDXComponents { return { ...components, }; } app/mdx-page/page.mdx # Welcome to my MDX page! This is some **bold** and _italics_ text. This is a list in markdown: - One - Two - Three Checkout my React component: package.json { "name": "notion-blog-nextjs", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev --turbopack", "build": "next build", "start": "next start", "lint": "next lint", "lint:fix": "next lint --fix", "format": "prettier --write ." }, "dependencies": { "@mdx-js/loader": "^3.1.0", "@mdx-js/react": "^3.1.0", "@next/mdx": "^15.3.2", "@notionhq/client": "^3.0.1", "@radix-ui/react-select": "^2.2.4", "@radix-ui/react-separator": "^1.1.6", "@radix-ui/react-slot": "^1.2.2", "@types/mdx": "^2.0.13", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "date-fns": "^4.1.0", "lucide-react": "^0.507.0", "next": "15.2.5", "postcss": "^8.5.3", "react": "^19.0.0", "react-dom": "^19.0.0", "react-icons": "^5.5.0", "tailwind-merge": "^3.2.0" }, "devDependencies": { "@eslint/eslintrc": "^3", "@eslint/js": "^9.26.0", "@tailwindcss/postcss": "^4.1.5", "@types/node": "^20", "@types/react": "^19", "@types/react-dom": "^19", "eslint": "^9", "eslint-config-next": "15.2.5", "eslint-config-prettier": "^10.1.2", "globals": "^16.0.0", "prettier": "^3.5.3", "prettier-plugin-tailwindcss": "^0.6.11", "tailwindcss": "^4.1.5", "tw-animate-css": "^1.2.9", "typescript": "^5" } }
미해결
Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
안녕하세요! 캐시관련 질문 사항이 있습니다! 현재, 강의 내용에선, react query 를 사용한 클라이언트측 캐시와, unstable_cached 를 사용한 서버 캐시를 둘다 같은 하나의 데이터에 적용하신 모습을 확인하였습니다. 궁금증은, 현재 블로그 목록 조회는 두개 캐시 기법이 모두 적용되어 있는데, 둘 중 하나만 캐시를 해 놓아도 될 것 같다 라는 생각이 드는데, 이게 맞는지 궁금합니다. 혹시, 하나만 선택해야 된다면 이번 블로그 목록 케이스에서는 어떤 방식의 캐시를 적용하시는걸 추천하시나요?
미해결
Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
저는 왜 notepad가 안뜰까요?
미해결
Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
안녕하세요! 학습 중, 궁금한게 있어 질문 드립니다! 이번 무한 스크롤 과정에서는 클라이언트 컴포넌트가 사용되었는데, 순수 서버 컴포넌트로는 개발하기는 거의 불가능에 가깝다고 느껴졌습니다. 가정을 하면, "사용자의 동작 혹은 이벤트에 따라서 랜더링 요소가 변경되어야 한다" 면, 클라이언트 컴포넌트를 거의 사용해야 될 것 같다라고 생각이 됩니다. 이러한 케이스가 아니라면, 대부분 서버 컴포넌트로 하는것이 좋다(?) 라고 느껴집니다. 보안성...? 응답 성능적으로도, SEO 관점으로도... 혹시 위의 내용이 틀리거나, 또 다르게 판단을 해야될 기준? 같은게 있을까요?
미해결
Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)
안녕하세요! 먼저 좋은 강의 감사합니다. 중간쯤, 전체 데이터를 조회해서 Client 측에서 필터링 해서 사용하는게 아닌, 서버로부터 이미 필터링 된 데이터를 받아오도록 검색 api 를 수정한 내용입니다. 이 부분이 클라이언트 사이드 -> 서버 사이드로 변경하였다, 라는 내용을 설명주셨는데, 랜더링과는 전혀 관계 없는 데이터 필터링 주체를 말씀 하시 내용이라고 생각되는데 맞게 이해했는지 궁금합니다. 즉, Notion = 서버, Next.js=클라이언트 관점으로 애기 하신게 맞는지 궁금합니다.
해결됨
Cursor AI로 만들면서 배우는 Web & Javascript
안녕하세요 강사님 강의가 거의 대부분 이해가 될 듯 말듯합니다. 강의코드를 다 잘 아시니까, 이게 이런거고 저게저런거다라고 쭈욱 빠르게 얘기해주시는데, 이해시키기보단 강사님이 아시는걸 설명하시는 느낌이에요. 근데, 반쯤 이해되는 상태이고, 코드 따라 안써봐도 되겠죠? 커서로 짜주는 코드를 해석하는 능력을 기르는게 중요하다고 하셨으니까요..!! 일단 정주행해도 될지, 아니면 제가 방향을 잘못잡고있는지 궁금해서 질문남겼습니다!! 열의있게 강의해주셔서 감사합니다.
