해당 강의 프론트앤드 빌드 방법 정리합니다. 강의 그대로 따라할 시에 제가 구성한 환경에서는 에러가 지속적으로 발생했습니다. 에러 정보: Error: error:0308010C:digital envelope routines::unsupported 환경 정보 OS: MacOS Ventura 13.3 베타 npm, npx version: 9.5.0 node version: v18.14.2 이에 따른 해결 방법 정리해봅니다. :) 강의에 있는 git 프로젝트를 clone 한다. frontenddev 폴더 접근 package.json 파일을 아래와 같이 작성 (dependencies 에서 antd 는 4.24.0 버전, 그 외는 2023.03.04 기준으로 최신 버전입니다. ) frontenddev 폴더에서 sudo npx @next/codemod new-link . 을 실행한다. components/layouts/AccountForm.tsx 파일에서 <Link href="/signup"> 을 <Link href="/signup" legacyBehavior> 으로 변경 Error: Invalid <Link> with <a> child. Please remove <a> or use <Link legacyBehavior>. 해결하기 위함입니다. 참고 블로그: https://steady-learner.tistory.com/entry/Nextjs-Error-Invalid-Link-with-a-child-Please-remove-a-or-use-Link-legacyBehavior-%EC%98%A4%EB%A5%98 npm i 후 npm run dev 하면 실행 됨을 확인할 수 있습니다.
원하는 키워드의 값을 담은 상수를 console.log(key,value) 하면 줄바꿈되면서 안에 있는 전체 값들이 나오더라구요 ( const key = $(el).attr("property").split(":")[1]; const value = $(el).attr("content"); 부분입니다) 근데 이 값들을 db에 저장하려 for문을 이용해 배열에 넣어봤더니 console.log(key,value)해서 나온 값들이 아닌 마지막 값만 들어갑니다 key와 value에 어떤 형태로 값이 스크랩핑되어 들어가있는건가요..? 상수에 배열형태로 들어간 것도 아니고 한줄로 값이 들어간 것도 아니고 .. console.log하면 전체가 나오기는 하나 줄바꿈이 되어 나와서 갈피를 못잡겠습니다.. 스크래핑한 값을 어떻게 저장을하고 넘겨야할지 db로 넘겨야할지 전혀 모르겠습니다................................. 이틀동안 찾아봐도 해결이 안되어서 질문 남깁니다..
처음에 .env파일을 깃허브에 올리시길래 띠용했지만 곧바로 수정하시는군요. 지금은 연습 중이라서 올라가도 크게 문제가 없을 것 같고, 또한, 강사님께서 .env가 깃허브에 올라갔을 때 어떻게 대처하는지 알려주시기 때문에 연습 용도로도 좋아보입니다. .env파일을 올리는게 찜찜하신 분들은 인스턴스 환경변수 분리까지 보신 뒤에 하시는게 좋을 것 같고, 나는 .env가 노출 된 상황을 한 번 연습해보고 싶다. 하시는 분들은 차례대로 진행하는 것도 좋을 것 같습니다!
typescript 기초 강의에서 nest를 처음 실행했는데 실행 시 너무 오래 걸립니다..(약 20~30분 정도) windows os에서 실행 햇는데 이유가 있을까요? 현재 컴퓨터 사양은 Memory 32G 에 RAM 16 Core 입니다. 매번 이렇게 시간이 걸리면 현실적으로 test가 불가능해서 방법을 구하고자 합니다. +추가 yarn으로 실행해봐도 비슷하네요.. Windows OS에서 WSL 통해서 Ubuntu 환경에서 실행하고 있습니다.
제가 백엔드 공부도 처음이고 언어 공부에서도 c 이후로 는 거의 하지 않았습니다. 프로젝트 단계로 넘어가기 전 언어 공부를 해야 더 도움이 될거같은데 typescript 나 자바스크립트를 선행 언어 공부를 한 후에 들어야 도움이 더 잘 될까요? 아니면 공부 없이도 듣기 괜찮을 까요?
Auth와 Resource App 시작 시 아래 사진과 같은 에러가 발생합니다. 강의와 노션에 있는 코드를 그대로 작성했다고 생각하여 패키지 버전 문제로 추정됩니다. 현재 제가 사용중인 패키지입니다. 강의 중 사용중인 패키지 버전을 공유받고 싶습니다. 해당 오류에 대한 구글링에 실패해서 추가적으로 혹시 알고계신 레퍼런스 있으시면 알려주시면 감사드리겠습니다.
안녕하세요. 강의중에 액세스토큰을 변수로 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 상태로 웹 서비스를 런칭하기 위해서는 액세스토큰과 리프레시 토큰을 어떻게 저장해야 할까요? 가장 안전한 방법이라고 할 수 있을까요? 감사합니다.
socket.io가 프론트하고 백엔드하고 연결이 되었는지 궁금합니다. 각각의 서버 구동은 프론트는 inflearn/project/sleact/front 에서 npm run dev 로 실행하고 있고, 백엔드는 개인적인 폴더를 하나 파서 아래와 같이 서버를 npm run start:dev 로구동하고 있습니다. 프론트 서버 : 3090 백엔드서버 : 3095 socket.io를 이용해서 채팅을 구현해보려 하는 도중 테스트 해보는데 채팅이 안보내집니다. 아래의 사진과 같이 '123' 이라는 채팅을 치고 엔터를 누르면 그대로 있습니다. 개발자 도구를 키고 Network탭 부분에 나온 스샷 개발자도구 console.log 창 스샷 백엔드 websocket.io 설치버전 프론트 웹소켓 설치버전
