얼음콜라

안녕하세요. 오늘은 저번 포스팅에 이어서 TypeScript 환경에서의 Express-session의 cookie를 이용하여, 자동 로그인을 진행하는 파트를 포스팅 해보겠습니다. 작업환경 로그인 기억하기 1. 작업환경 운영체제 Windows 10 Pro 사용 툴 VSCode 1.59 node v14.17.3 npm 6.14.13 2. 로그인 기억하기 작업 전 cookie의 Expires / Max-Age 먼저 알아 보고 가겠습니다. 각각 만료 / 최대 연령(수명주기) 라고 직역이 가능 할 듯 합니다. cookie가 사라지는 시점이죠. express-session에서는 cookie의 MaxAge를 따로 설정해주지 않으면 seesion 상태가 됩니다. 세션이 사라지면 쿠키도 같이 사라지죠. 로그인 기억하기 ..

안녕하세요. 오늘은 저번 포스팅에 이어서 TypeScript 환경에서의 Express-session 로그인 처리 포스팅을 진행하겠습니다. 작업환경 express-session, SessionData 수정 로그인처리 1. 작업환경 운영체제 Windows 10 Pro 사용 툴 VSCode 1.59 node v14.17.3 npm 6.14.13 2. express-session, SessionData 수정 대부분의 이 포스팅을 찾아오신 분들이 막혀서 진행 못했던 부분이라고 판단되는 부분입니다. 저도 이걸로 고생을 많이 했었습니다. import 한 부분에서 "express-session" 부분에서 마우스 커서를 올리고 [F12]를 눌러 express-session 자체를 봅니다. interface Session..

안녕하세요. 오늘은 페이지마다 로그인 유무를 확인하고, 로그인 정보를 기억하는 등 활용성이 좋은 Express-session을 이용한 방법을 포스팅하겠습니다. 작업 환경 개념 설치 및 세팅 1. 작업환경 운영체제 Windows 10 Pro 사용 툴 VSCode 1.59 node v14.17.3 npm 6.14.13 2. 개념 Java로 Sping 공부하신 분들은, request.getSession().setAttribute("user", user); 대략 이런 식으로 session에 로그인된 user 정보를 저장해 두신다는 걸 알 겁니다. 왜 이렇게 해야 할까요? 브라우저에도 Session Storage가 있던데 그걸 이용하면 안 되는 걸까요? Session Storage에 저장해두면, 세션 종료될 때 ..

안녕하세요. Express 서버 세팅을 완료 하고, 해당 프로젝트에 React를 올리는 작업을 포스팅진해도록 하겠습니다. TypeScript를 사용하여 Express 세팅하기 TypeSrcript를 사용하여 Express 세팅 안녕하세요. 사이드 프로젝트를 시작하며, TypeScript를 사용하여 Express 서버를 세팅해봤는데, 생각보다 찾아보고 설정해야할 항목이 많아서, 같은 상황에 도움이 될까하여 포스팅을 진행해봅니다 icecokel.tistory.com 설치환경 react 설치 및 확인 concurrently 설치 및 scripts 세팅 1. 설치환경 운영체제 Windows 10 Pro 사용 툴 VSCode 1.59 node v14.17.3 npm 6.14.13 2. react 설치 및 확인 r..

안녕하세요. 사이드 프로젝트를 시작하며, TypeScript를 사용하여 Express 서버를 세팅해봤는데, 생각보다 찾아보고 설정해야할 항목이 많아서, 같은 상황에 도움이 될까하여 포스팅을 진행해봅니다. 설치 환경 npm init 및 nodemon 설치 typescript 및 ts-node 설치 및 세팅 express 설치 및 세팅 1. 설치 환경 운영체제 Windows 10 Pro 사용 툴 VSCode 1.59 node v14.17.3 npm 6.14.13 2. npm init 및 nodemon 설치 프로젝트를 진행 할 디렉토리를 생성해주고, npm init을 하여 package.json 파일을 생성해 줍니다. npm init 저는 github에서 클론 생성한 디렉토리라 README.md 가 있습니다...