IT/React21 JWT JWT : JSON Web Token의 약자로 데이터가 JSON으로 이루어진 토큰을 의미 세션 기반 인증 : 사용자가 로그인하면 서버는 세션 저장소에 사용자의 정보를 조회하고 세션 id를 발급하며 발급된 id를 주로 브라우저의 쿠키에 저장하며 사용자가 요청을 보낼때 마다 서버는 세션 저장소에서 세션을 조회한 후 로그인 여부를 결정하여 작업을 처리하고 응답한다. 저장소로는 주로 메모리, 디스크, 데이터베이스를 사용한다. 세션 기반 인증의 단점은 서버를 확장하기가 번거로워질 수 있다는 점이다. 만약 서버의 인스턴스가 여러개라면 모든 서버끼리 같은 세션을 공유해한다. 토큰 기반 인증 : 토큰은 로그인 이후 서버가 만들어주는 문자열이며 해당 문자열안에는 사용자의 로그인 정보가 들어있고, 해당 정보가 서버에서 발.. 2019. 12. 2. Koa yarn init -y 이후 yarn add koa Koa 웹 프레임 워크 설치한 뒤에 cat package.json 을 사용하면 의존성이 추가된것을 확인 할 수 있다. Koa 어플리케이션은 미들웨어의 배열로 구성되어있다. use() 함수를 통해 미들웨어 함수를 어플리케이션에 등록한다. 미들웨어 함수는 아래와 같은 구조로 이루어져있다. (ctx, next) => { } Koa의 미들웨어 함수는 두 개의 파라미터를 받는다. 첫번째 파라미터는 Context로 웹 요청과 응답에 관한 정보를 지니고 있다. next는 현재 처리중인 미들에어의 다음 미들웨어를 호출하는 함수이며 미들웨어를 등록하고 next함수를 호출하지 않으면 그 다음 미들웨어를 처리하지 않는다. 미들웨어는 use함수를 사용하여 등록되는 순서대로 .. 2019. 11. 27. 서버 사이드 렌더링 서버 사이드 렌더링을 구현하면서 사용자가 웹 서비스에 방문햇을 때 서버쪽에서 초기 렌더링을 대신해준다. 그리고 사용자가 html을 전달받을 때 그 내부에서 렌더링된 결과물이 보인다. 서버사이드 렌더링 장점 리액트로 만든 SPA(single page application)은 검색 엔진 클롤러 봇 처럼 자바스크립트가 실행되지 않는 환경에서는 페이지가 제대로 나타나지 않아 서버에서 클라이언트 대신 렌더링을 해 주면 검색 엔진이 페이지의 내요응ㄹ 제대로 수집해 갈 수 있다. 구글 검색 엔진은 다른 검색 엔진과 달리 검색 엔진에서 자바스크립트를 실행하는 기능이 탑재되어 있으므로 제대로 페이지를 크롤링해 갈 때도 있지만, 모든 페이지에 대해 자바스크립트를 실행하 주지 않는다. 그렇기에 웹서비스의 검색엔진 최적화를 .. 2019. 11. 25. 코드 스플리팅 윕팩 : 리액프 프로젝트를 사용자에게 제공하기 위해서는 빌드 작업을 통해서 주석, 경고 메세지, 공백등을 제거하여 파일 크기를 최소화 하기도 하며, 브라우저에서 JSX문법이나 다른 최신 자바스크립트 문법이 원할하에 실행되도록 코드의 트랜스파일 작업도 실행하는 작업을 담당함다. 웹팩에서 별도의 설정을 하지 않는 경우 프로젝트에서 사용중인 모든 자바스크립트 파일과 모든 CSS 파일이 각각 하나로 합쳐진다. 이러한 경우 당장 필요하지 않은 컴포넌트 정보도 불러오며 로딩시간이 길어지기에 코드 스플리팅중 하나인 비동기 로딩을 통하여 필요한 시점에 불러와서 사용할 수 있다. import를 함수로 사용하면 Promise를 반환하는데 이를 이용하여 코드 스플리팅을 할 수 있다. React.lazy와 Suspense R.. 2019. 11. 22. 이전 1 2 3 4 ··· 6 다음