묻고 답해요
148만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
쿠키에 대해서
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.로그인시 아이디와 비밀번호 → 서버(유저의 정보가 맞는지 확인 후 토큰 발급 → 쿠키에 저장 : 하지만 도메인 주소가 다르면 쿠키가 전송이안됨왜 쿠키는 도메인주소가 다르면 쿠키가 전송이 안될까요?과거 강의인 "노드 리액트 기초강의" 에서 Express에서 제공하는 cookie-parser을 이용해서 서버에서 토큰을 쿠키에 저장했었는데 이 방법도 사용해도 될까요?? - 이는 여기 강의에서 설치한 cookie모듈과 비슷한 건가요??토큰발급 후 클라이언트에 보내주고 클라이언트에서 쿠키에 저장하는 방법은?
-
해결됨따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
next.js 버전이 12인건가요?
강의에서 사용하고 있는 next 버전이 궁금합니다.12버전인가요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
API-Gateway2 섹션 Apollo 서버 구동 에러
Auth와 Resource App 시작 시 아래 사진과 같은 에러가 발생합니다. 강의와 노션에 있는 코드를 그대로 작성했다고 생각하여 패키지 버전 문제로 추정됩니다.현재 제가 사용중인 패키지입니다.강의 중 사용중인 패키지 버전을 공유받고 싶습니다. 해당 오류에 대한 구글링에 실패해서 추가적으로 혹시 알고계신 레퍼런스 있으시면 알려주시면 감사드리겠습니다.
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
findOneBy
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. findOneBy 명령어 혹시 자세하게 설명해주실 수 있을까요??User.ts를 이용해서 중복된 아이디와 이름을 찾는 원리가 어떻게 되는건가요??
-
미해결파이썬/장고 웹서비스 개발 완벽 가이드 with 리액트
ipython, jupyter notebook 오류 질문 드립니다 ㅠㅠ
안녕하세요수업을 진행 하던 중 ipython과 jupyter notebook에서 오류가 발생하고 있습니다.이유가 무엇일까요? django를 설치 했는데도 오류가 발생합니다 도와주세요~~
-
해결됨파이썬/장고 웹서비스 개발 완벽 가이드 with 리액트
로그인 폼을 만들고 로컬 스토리지에 jwt저장하기 강의에서 질문입니다!
import React, { useState } from "react"; import { Card, Button, Form, Input, notification } from "antd"; import { useHistory } from "react-router-dom"; import Axios from "axios"; import { SmileOutlined, FrownOutlined } from "@ant-design/icons"; import useLocalStorage from "utils/useLocalStorage"; export default function Login() { const history = useHistory(); const [jwtAccessToken, setJwtAccessToken] = useLocalStorage( "jwtAccessToken", "" ); console.log("loaded Token: ", jwtAccessToken); // 왜 이게 두번이나 출력되는 것이지? const onFinish = (values) => { async function fn() { const { username, password } = values; const data = { username, password }; try { //응답을 꼭 받아야 한다. 토큰을 받아야 하니까 const response = await Axios.post( "http://127.0.0.1:8000/accounts/token/", data, { headers: { "Content-Type": "application/json" } } ); // const { data: token } = response; 이런 방식은 아래랑 다르다 response에서 data을 꺼내서 이름을 token이라 짓는 것 // const token = response.data 와 일치하며 밑에 녀석은 // const jwtAccessToken = response.data.access 과 일치한다 const { data: { access: jwtAccessToken }, } = response; setJwtAccessToken(jwtAccessToken); notification.open({ message: "로그인 성공!", icon: <SmileOutlined style={{ color: "#108ee9" }} />, }); // history.push("/accounts/login"); //TODO: 이동주소 } catch (error) { console.log(error); if (error.response) { notification.open({ message: "로그인 실패!", icon: <FrownOutlined style={{ color: "#ff3333" }} />, description: "아이디/암호를 확인해 주세요.", onClick: () => { console.log("Notification Clicked!"); }, }); } } } fn(); }; return ( <Card title="login"> <Form labelCol={{ span: 8 }} //부트스트랩은 한 행이 12 컬럼인데 antd는 24컬럼임 wrapperCol={{ span: 16 }} style={{ maxWidth: 600 }} onFinish={onFinish} autoComplete="off" > <Form.Item label="Username" name="username" rules={[{ required: true, message: "Please input your username!" }]} //rules을 통해 유효성검사로직이 들어가 잇다 > <Input /> </Form.Item> <Form.Item label="Password" name="password" rules={[ { required: true, message: "Please input your password!" }, { min: 5, message: "5자리 이상 해주세요" }, // 한글자 한글자 들어갈때마다 검사해준다. ]} > <Input.Password /> </Form.Item> {/* //8칸 이동하고 16칸을 쓰겠다 */} <Form.Item wrapperCol={{ offset: 8, span: 16 }}> <Button type="primary" htmlType="submit"> Submit </Button> </Form.Item> </Form> </Card> ); } 안녕하세요 강사님!! 위에서 15번째 줄에 있는 console.log("loaded Token: ", jwtAccessToken);이 부분이 페이지의 콘솔창에서 두번이나 나타납니다... 왜 그런지 알 수 있을까요?? 새로고침을 했을때도 두번 나타나고 submit을 했을 때도 2번 출력됩니다.아 ! 그리고 simplejwt토큰을 사용중 입니다!
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
@types/cors설치
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 22:03 초 부분 에 cors 설치하시는데 요거는 안하셨는데 해야되는거 맞나요??저는 안하니까 오류나서 설치하라고 뜨더라구요..영상에서는 설치안했는데도 오류 안뜨는 거같아서..아님 제가 잘 못본걸 수도 있어서 알려주시면 감사드립니다!
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
React.FC 사용
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. Rect.FC의 사용하지않고 아래와 같이해도 무방할까요???
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
암호화/인증 & 인가 과제 중 질문
updateUserPwd 구현 중에, 파라미터로 업데이트할 패스워드를 받도록 했습니다. 이 때, API 호출 시, 해당 파라미터의 최소 길이를 8 이상으로 하고 싶은데 따로 방법이 있을까요?
-
미해결Jenkins를 이용한 CI/CD Pipeline 구축
Docker 개념 문의
학습중에 궁금한부분이 생겨서 문의드립니다제가 알기로는 docker 컨테이너를 실행해도리눅스의 경우 커널같은 코어한 부분은 쉐어한다고 알고있는데요낮은 버전의 우분투에서 도커오 높은 버전의 우분투 이미지를 돌려도 정상적으로 돌아갈까요?
-
미해결대세는 쿠버네티스 [초급~중급]
쿠버네티스 초기화 에러
init을 시도하는데 에러가 뜹니다.[init] Using Kubernetes version: v1.26.1[preflight] Running pre-flight checkserror execution phase preflight: [preflight] Some fatal errors occurred:[ERROR CRI]: container runtime is not running: output: time="2023-02-24T23:20:09+09:00" level=fatal msg="validate service connection: CRI v1 runtime API is not implemented for endpoint \"unix:///var/run/containerd/containerd.sock\": rpc error: code = Unimplemented desc = unknown service runtime.v1.RuntimeService", error: exit status 1[preflight] If you know what you are doing, you can make a check non-fatal with --ignore-preflight-errors=...To see the stack trace of this error execute with --v=5 or higher 어떻게 해결해야하나요??
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
액세스토큰을 변수로 저장하면 생기는 문제점
안녕하세요. 강의중에 액세스토큰을 변수로 req.header에 저장하면 아래와 같이 3가지 문제점이 있다는 것을 구글링을 통해서 확인했습니다.1.보안: 액세스토큰을 req.header에 변수로서의 토큰은 공격자에 의해 가로채기에 취약합니다.2.확장성: 애플리케이션에 많은 수의 요청이 있는 경우 req.header의 변수는 크기가 커지고 성능 문제가 발생할 수 있습니다.3.지속성: req.header에 액세스 토큰을 저장하는 것은 영구적이지 않습니다. 사용자가 페이지를 새로 고치거나 브라우저를 닫으면 액세스 토큰이 손실됩니다. 이로 인해 사용자가 보호된 리소스에 액세스하기 위해 다시 로그인해야 할 수 있습니다. 질문1)3번 지속성문제의 경우, 브라우저를 새로고침하게 되면, 액세스 토큰이 사라지게 되니 오히려 보안이 좋다고 생각해야 할까요? accessToken이 수업에서는 10분으 로 만료기간을 설정했는데, restoreAccessToken API가 있기 때문에 acessToken을 req.header에 변수로 저장해도 문제가 되지 않을까요? 질문2)액세스토큰 만료시간을 10분 ~30분 으로 짧게 잡으신 이유가 1번 문제점 보안의 이유라고 생각하면 될까요? 질문3)선생님, 좋은 강의 해주셔서 진심으로 감사합니다. 저는 선생님의 백엔드와 프론트 강의를 수강후 실제 웹 서비스를 런칭하기위해서 수업을 듣고 있습니다. 현재는 백엔드 강의를 수강중입니다.실제 웹 서비스런칭시 accessToken을 req.header에 변수로서 저장하고, refreshToken은 쿠키에 저장하는 게 올바른 방법인가요?refreshToken을 수업에서 가르쳐주신 대로 secure : true, httponly: true와 같이 배포환경으로 바꿔서 배포하게 된다면 보안상 안전할까요? 질문4)구글링을 해보니, 리프레시 토큰을 Redis에 저장하고, 액세스토큰은 쿠키에 저장하는 방법도 있는 것을 확인했습니다. 액세스토큰의 만료기간을 10분으로 잡고, 리프레시토큰의 만료기간을 2주로 잡을 경우, restoreRefreshToken API 때문에 Redis DB에 자주 접속하게 되어서 DB 사용료가 많이 청구 되지는 않을까요? 서버를 stateless 상태로 웹 서비스를 런칭하기 위해서는 액세스토큰과 리프레시 토큰을 어떻게 저장해야 할까요? 가장 안전한 방법이라고 할 수 있을까요? 감사합니다.
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
[커뮤니티 페이지 생성하기 강의부분] authRoute 논리연산자를 추가하면 error가 뜹니다.
_app.tsxexport default function App({ Component, pageProps }: AppProps) { axios.defaults.baseURL = process.env.NEXT_PUBLIC_SERVER_BASE_URL + '/api'; axios.defaults.withCredentials = true; const { pathname } = useRouter(); const authRoutes = ['/register', '/login']; const authRoute = authRoutes.includes(pathname); return ( <AuthProvider> {!authRoute && <NavBar />} <div className={authRoute ? '' : 'pt-12'}> <Component {...pageProps} /> </div> </AuthProvider> ); } 해당 부분에서 !authRoute 논리연산자를 추가하면Error: Hydration failed because the initial UI does not match what was rendered on the server.에러가 나옵니다.강사님 파일을 클론 해서 빌드 확인해보니 이런 에러가 안나오길래, 이 강의까지의 나머지 파일도 클론한 것과 모두 같은 것을 확인했는데 왜 저만 이런 에러가 나오는걸까요?해당 에러를 구글링해서 해결책으로 나오는 것들을 적용해봤는데 어느것도 에러를 해결해주지 못했습니다ㅠ어떤 부분을 확인해보면 좋을까요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
GqlExecutionContext가 없다고 나옵니다.
import { GqlExecutionContext } from '@nestjs/graphql';@nestjs/graphql 모둘에 내보낸 맴버 GqlExecutionContext가 없다고 에러가 뜹니다
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
JWT 토큰이 어디 저장되어 있는 건가요?
인증을 하면 JWT 액세스 토큰을 전달 받고, fetchUser의 header에 전달 받은 토큰을 넘겨 인가를 받는다는 것을 알았습니다.이 때, JWT 토큰에 대해 서버가 알고 있어야 하는데 이것이 어디에 저장되어 있는 건가요?
-
해결됨따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
import express 하는 부분에서
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 혹시 아래와 같이 자동완성 사용하는 거랑 같을까요??
-
해결됨따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
nextJS 설치 시 설정하는게 생겼는데
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. Eslint는 뭔지 알겠는데 밑에 3개는 처음보네요.. 업데이트 되면서 생긴건가요??마지막은 @components/* 이렇게 설정하라고 하던데 맞나요?? 무슨뜻인가요?? 구글링했습니다
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
안녕하세요 강사님 오류문의드립니다.
lllll@172 server % npm run dev> server@1.0.0 dev> env-cmd -f .env.development nodemon --exec ts-node ./src/server.ts[nodemon] 2.0.20[nodemon] to restart at any time, enter rs[nodemon] watching path(s): .[nodemon] watching extensions: ts,json[nodemon] starting ts-node ./src/server.ts/Users/lllll/study/reddit-clone-app/server/node_modules/ts-node/src/index.ts:859return new TSError(diagnosticText, diagnosticCodes, diagnostics);^TSError: ⨯ Unable to compile TypeScript:src/routes/subs.ts:139:16 - error TS2339: Property 'file' does not exist on type 'Request<ParamsDictionary, any, any, ParsedQs, Record<string, any>>'.139 if (!req.file?.path) {~~~~src/routes/subs.ts:144:22 - error TS2339: Property 'file' does not exist on type 'Request<ParamsDictionary, any, any, ParsedQs, Record<string, any>>'.144 unlinkSync(req.file.path);~~~~src/routes/subs.ts:154:26 - error TS2339: Property 'file' does not exist on type 'Request<ParamsDictionary, any, any, ParsedQs, Record<string, any>>'.154 sub.imageUrn = req.file?.filename || "";~~~~src/routes/subs.ts:157:27 - error TS2339: Property 'file' does not exist on type 'Request<ParamsDictionary, any, any, ParsedQs, Record<string, any>>'.157 sub.bannerUrn = req.file?.filename || "";~~~~at createTSError (/Users/lllll/study/reddit-clone-app/server/node_modules/ts-node/src/index.ts:859:12)at reportTSError (/Users/lllll/study/reddit-clone-app/server/node_modules/ts-node/src/index.ts:863:19)at getOutput (/Users/lllll/study/reddit-clone-app/server/node_modules/ts-node/src/index.ts:1077:36)at Object.compile (/Users/lllll/study/reddit-clone-app/server/node_modules/ts-node/src/index.ts:1433:41)at Module.m._compile (/Users/lllll/study/reddit-clone-app/server/node_modules/ts-node/src/index.ts:1617:30)at Module._extensions..js (node:internal/modules/cjs/loader:1308:10)at Object.require.extensions.<computed> [as .ts] (/Users/lllll/study/reddit-clone-app/server/node_modules/ts-node/src/index.ts:1621:12)at Module.load (node:internal/modules/cjs/loader:1117:32)at Function.Module._load (node:internal/modules/cjs/loader:958:12)at Module.require (node:internal/modules/cjs/loader:1141:19) {diagnosticCodes: [ 2339, 2339, 2339, 2339 ]}[nodemon] app crashed - waiting for file changes before starting... client에서는 rpm run dev가 정상적으로 실행되는데 server에서는 npm run dev를 실행하면 상기와 같은 오류가 발생하네요.구글링해보니 server 디렉토리 내의 tsconfig.json 파일이 문제인 것 같은데 여러 세팅을 바꾸어보아도 해결되지않아 문의드립니다.(tsconfig.json 파일은 강사님이 올려주신 소스코드 파일과 같은 파일 사용중입니다)
-
해결됨파이썬/장고 웹서비스 개발 완벽 가이드 with 리액트
jsconfig 오류 질문입니다!
{ "compilerOptions": {"baseUrl": "src" },"include": ["src"]} keonhongkoo@keonhongui-MacBookAir frontend % yarn startyarn run v1.22.19$ react-scripts startnode:internal/modules/cjs/loader:1325 throw err; ^SyntaxError: /Users/keonhongkoo/Desktop/instagram/frontend/jsconfig.json: Unexpected token / in JSON at position 75 at parse (<anonymous>) at Module._extensions..json (node:internal/modules/cjs/loader:1322:39) at Module.load (node:internal/modules/cjs/loader:1117:32) at Module._load (node:internal/modules/cjs/loader:958:12) at Module.require (node:internal/modules/cjs/loader:1141:19) at require (node:internal/modules/cjs/helpers:110:18) at getModules (/Users/keonhongkoo/Desktop/instagram/frontend/node_modules/react-scripts/config/modules.js:126:14) at Object.<anonymous> (/Users/keonhongkoo/Desktop/instagram/frontend/node_modules/react-scripts/config/modules.js:142:18) at Module._compile (node:internal/modules/cjs/loader:1254:14) at Module._extensions..js (node:internal/modules/cjs/loader:1308:10)Node.js v18.14.1error Command failed with exit code 1.info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command. 이렇게 결과가 출력되는데 해결책이 안보이네요... vscode도 재시작해봤습니다ㅠ
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
강의별 전체 코드 git으로 받아볼 수 있을까요?
안녕하세요선생님께서 강의하시는 강의별 전체 코드를 받아볼 수 있는 git 주소가 있을까요?전체 정답 코드를 보지 못하고 따라하다보니 에러가 많이 나서 선생님 것으로 확인해보고자 합니다. 그럼 답변 기다리겠습니다. 감사합니다.