172만명의 커뮤니티!! 함께 토론해봐요.
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
포트폴리오 리뷰 강의는 먼저 혼자 포트폴리오를 만들고 보는게 좋나요? 아니면 git clone으로 다운받고 어떻게 만들었는지 보고 그냥 넘어가도 되나요?? 리뷰 강의에서 clone으로 설명하는 이유가 궁금해서 여쭤봅니다!
해결됨
Next + React Query로 SNS 서비스 만들기
React Query가 사실 데이터를 불러오고 캐싱하는 이유가 가장 큰 것으로 알고있습니다. 하지만, Next14부터는 fatch에 store 기능이 생기면서 캐싱이 되는걸로 알고 있는데, 그러면 데이터 캐싱만을 사용하며 굳이 React Query를 사용하지 않아도 되는건가요?
미해결
Next + React Query로 SNS 서비스 만들기
안녕하세요 제로초님, 강의 잘 보던 중 궁금한 점이 생겨 질문 올립니다. 구글링해보면 서버 컴포넌트에 msw를 적용하는 방법으로 msw/node의 setupServer를 많이 사용하는 것 같습니다. msw/node의 setupServer을 사용해도 이슈가 없을지 궁금합니다!
미해결
readable_code:: 따라하면 끝나있는 C++ 개발환경 설정 A to Z
안녕하세요. 과정을 진행하는 중 질문이 생겨 남겨봅니다. VSCode Extension에서 CMake Tools를 설치하였지만 설명하신대로 Clang 설정 화면이 나오지 않아 VSCode 설정에서 설정해보려고 하는데 어떤 설정을 지정해야 하는지 잘 모르겠습니다.
미해결
포트폴리오 초간단 배포하기
백엔드 서버에는 nginx를 설치하지 않았는데, 도메인 등록시 :8080 포트는 어떻게 처리해야 하는지 궁금합니다. 도메인 등록후에 'www.도메인:8080' 으로 접속해야 접속이 되어서 질문드립니다. nginx 설치하고, 거기서 jar 파일을 업로드 하면 해결 될까요?
미해결
Next + React Query로 SNS 서비스 만들기
/src/middleware.ts import { auth } from './auth'; import { NextResponse, NextRequest } from 'next/server'; export async function middleware(request: NextRequest) { const session = await auth(); if (request.nextUrl.pathname.startsWith('/login')) { if (session) { return NextResponse.redirect(new URL('/', request.url)); } } if (request.nextUrl.pathname.startsWith('/mypage')) { if (!session) { return NextResponse.redirect(new URL('/login', request.url)); } } if (request.nextUrl.pathname.startsWith('/admin')) { if (session?.user?.name !== 'admin') { return NextResponse.redirect(new URL('/', request.url)); } } } export const config = { matcher: ['/mypage/:path*', '/admin/:path*', '/login'], }; /src/auth.ts import NextAuth from 'next-auth'; import KakaoProvider from 'next-auth/providers/kakao'; export const { handlers: { GET, POST }, auth, } = NextAuth({ pages: { signIn: '/login', }, providers: [ KakaoProvider({ clientId: process.env.KAKAO_CLIENT_ID!, clientSecret: process.env.KAKAO_CLIENT_SECRET!, }), ], secret: process.env.NEXTAUTH_SECRET, }); /src/app/api/auth/[...nextauth]/route.ts export { GET, POST } from '@/auth'; 로컬에서는 되는데 vercel 로 배포 하니까 안되네요.. api/auth/error 로 가지고 Failed to load resource: the server responded with a status of 500 () /api/auth/session 이렇게 오류가 나네요 "next-auth": "^5.0.0-beta.19", 입니다
해결됨
Next + React Query로 SNS 서비스 만들기
안녕하세요! 클론하다가 React에서 Framer로 레이아웃을 이전 이후로 나누어서 페이지 전환을 스무스하게 animation을 줬던 기억이 있어서 반영해봤는데요. 위의 페이지 전환 효과를 next 프로젝트에도 반영해보려고 하는데 App Router의 특성? 때문인지 {children} 으로 라우팅을 전달 받기 때문에 이전, 이후가 아닌 공통적인 레이아웃으로 취급되고 명확한 구분(id)가 없기 때문에 부드러운 전환이 잘 안되는 걸까요.. 유추한 내용이 맞을까요..? 타 라이브러리 질문 안받으신다면 죄송함다 ㅠ const Framer = ({ children }: { children: ReactNode }) => { const pathName = usePathname(); return ( <> <AnimatePresence mode="wait" initial={false}> <motion.div key={pathName} initial={{ opacity: 0, x: 20 }} animate={{ opacity: 1, x: 0 }} exit={{ opacity: 0, x: -20 }} transition={{ duration: 0.5 }} > {children} </motion.div>{" "} </AnimatePresence> </> ); };
해결됨
Next.js 시작하기
안녕하세요 강의 잘 보고 있습니다. Layout.jsx 에서는 대문자를 사용하고, pages 안에 파일들은 carts.jsx 소문자로 사용하는것 같은데 관례상 그런건지 규칙이 있는건지 궁금합니다. 감사합니다.
미해결
Next + React Query로 SNS 서비스 만들기
안녕하세요 섹션 2 > 레이아웃 클론 강의를 수강 중에 로고에 inline-block 을 사용하신 부분이 있어서요 block 으로 해도 비슷한 노출이 되는 듯해서, 어떤 의도가 있으셨을지 또는 다른 효과가 있는지 궁금합니다 :) .logo { display: inline-block; height: 56px; margin-top: 2px; }
미해결
Next + React Query로 SNS 서비스 만들기
안녕하세요 강의 잘 듣고있습니다. 강의를 듣다가 궁금한 점이, browser.ts와 http.ts 두개를 만든 점 입니다. next는 CSR과 SSR을 둘다 사용하기에, 서버에서도 데이터 처리를 하려고 http.ts를 통해 서버 데이터 처리를 하는 게 맞나요? 아래 코드는 브라우저 환경일 때만 brower.ts를 실행시키고 http.ts를 브라우저 환경이든 아니든 항상 켜져있는건가요? if (typeof window !== 'undefined') { if (process.env.NEXT_PUBLIC_API_MOCKING === 'enabled') { // eslint-disable-next-line global-require require('@/mocks/browser') } } 그렇다면 만약 react에서 사용하게 되면 CSR만 한다는 가정하에 http.ts는 필요 없게 되는건가요?
미해결
포트폴리오 초간단 배포하기
개인 프로젝트를 build 하고 생성된 jar파일을 깃허브의 private 리포지토리에 업로드 하려하니 25MB 를 초과하는 파일을 업로드 할 수 없다는 github 메시지가 뜹니다. 이건 어떻게 해결해야 할까요? 배포를 할때는 jar파일을 wget 하기위한 github 저장소가 항상 필요한 걸까요? jar 파일을 서버로 전송하는 다른 방법도 있는지 궁금합니다.
미해결
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
이 부분에서 wrapper__left__body가 튀어나온 이유가, wrapper__left가 정렬되지 않아서라고 하셨고, 그래서 자동으로 div가 block단위이고 한 줄 띄어진 것처럼 된 거다 라고 하셨습니다. 근데 div가 block단위이고 한 줄 띄어진 것처럼 되는 게 이해되지 않습니다.. 한 줄 띄어진거면 바로 밑으로 붙여져서 안 튀어나가야하지 않나요? wrapper__left__body크기가 어차피 부모 height에서 wrapper__left__header부분을 뺀 크기의 100%라면요! 아니면 혹시 정렬을 해야지만 부모 height에서 wrapper__left__header부분을 뺀 크기의 100%라고 이해할 수 있는 걸까요? 정렬을 따로 설정하지 않으면 그냥 부모 height의 100%를 가져와서 튀어나가는 걸까요?
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
[싸이월드만들기1탄]에서 wrapper 사이즈가 어떻게 된 건지 궁금합니다. 부모-속성을 보면 background -> outerbox -> wrapper -> wrapper__left, wrapper__right입니다! 이때, background와 outerbox는 따로 크기를 지정해주었는데, wrapper는 따로 크기를 지정하지 않았더라고요! 그러면 wrapper크기는 자동으로 지정되나요? 부모클래스인 outerbox의 width와는 동일한데 height는 달라서요! 혹시 어떻게 지정되는 건지 알 수 있을까요?
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
게시글 등록 화면에서 작성자, 비밀번호, 제목, 내용 값이 입력되면 등록하기 버튼의 색을 변경해주시고 반대로 값이 입력되지 않았다면 다시 원래 색인 회식으로 되돌리기 freeboard_frontend 게시글 목록 화면을 구현해주세요. 게시글 상세 화면에서 삭제하기 기능을 구현해주세요. 이게 포폴과제인데, section11의 포폴리뷰 영상에는 오직 2번에 대한 내용만 있는듯하고 1,3번에 대한 내용은 아예 빠져있네요. github에 삭제쿼리 한줄조차 없네요. 너무 부실한거 아닌가 싶습니다.
미해결
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
freeboard_frontend 이미지 업로드 부분 진행중인데 upload 버튼 클릭해서 이미지를 선택하면 Cannot destructure property 'url' of 'undefined' as it is undefined. 이라는 안내창이 뜨면서 정상적으로 실행이 되지 않습니다.. 원인을 알 수 있을까요? 다른 분 문의 글을 보고 혹시 apollo셋팅 문제인가 싶어 yarn add apollo-upload-client 와 yarn add -D @types/apollo-upload-client 를 추가로 설치 해봤는데도 문제 해결이 안됩니다..
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
위 사진과 같이 search에 'Terra'를 검색했는데 "usedItem":null 인 정보까지 받아와지는데 왜 이런가요?
미해결
따라하며 배우는 도커와 CI환경 [2023.11 업데이트]
파일이 없거나 권한이 없다고 뜨는데 어떻게 해결해야할까요?
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
브라우저에 내용은 모두 잘 입력이 되고 console창에서도 _id가 잘 나왔는데 graphql로 넘어가서 등록된 부분을 확인하려 하니 등록된 게시물이 없다고 나옵니다. 어떤 부분이 문제인걸까요?
해결됨
Next + React Query로 SNS 서비스 만들기
"use client"; 하위의 컴포넌트는 Client로 랜더링 된다고 하신거 같은데, QueryClientProvider가 client에서 랜더링 되는건 아닌가요? 해당 파일을 가보니 'use client'를 사용하고 있어서요. <QueryClientProvider></QueryClientProvider>로 감싸도 그 하위에 컴포넌트들이 SSR가 되는지 궁금합니다. 'use client' import * as React from 'react' import type { QueryClient } from '@tanstack/query-core' export const QueryClientContext = React.createContext<QueryClient | undefined>( undefined, ) export const useQueryClient = (queryClient?: QueryClient) => { const client = React.useContext(QueryClientContext) if (queryClient) { return queryClient } if (!client) { throw new Error('No QueryClient set, use QueryClientProvider to set one') } return client } export type QueryClientProviderProps = { client: QueryClient children?: React.ReactNode } export const QueryClientProvider = ({ client, children, }: QueryClientProviderProps): React.JSX.Element => { React.useEffect(() => { client.mount() return () => { client.unmount() } }, [client]) return ( <QueryClientContext.Provider value={client}> {children} </QueryClientContext.Provider> ) }
해결됨
[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
안녕하세요 ~ 해당 강의 8:26 즘에 http://localhost:3000/users 검색했을때 저는 타입에러가 뜨면서 강좌에서 처럼 결과가 검색이 안되는데 어떻게 해야 할까요 ?
