
Tokens 과제 JWT 생성 및 검증을 도와주는 헬퍼 require('dotenv').config(); //dotenv 패키지를 사용하여 환경 변수를 로드 const { sign, verify } = require('jsonwebtoken'); //Node.js 서버에서 JWT(Json Web Token)을 생성하고 검증하는 기능을 구현한 모듈 module.exports = { generateToken: (user, checkedKeepLogin) => { const payload = { id: user.id, email: user.email, }; let result = { accessToken: sign(payload, process.env.ACCESS_SECRET, { expiresIn: '1d'..

cookie 튜토리얼 CORS 설정 CORS 설정은 이러한 Same-Origin Policy를 우회하기 위해 서버에서 브라우저에게 특정 출처에서 자원에 대한 액세스를 허용하도록 허용하는 메커니즘입니다. 이를 통해, 다른 출처의 자원을 안전하게 사용 const corsOptions = { // client는 http://localhost:3000 을 이용 origin: "http://localhost:3000", // cookie는 인증 정보를 포함하는 경우가 많으므로 credentials도 설정 //credentials 속성은 자격 증명 정보를 포함하는 요청을 허용할지 여부를 결정 credentials: true, // 허용할 메소드를 배열에 담아서 작성 methods: ['GET', 'POST', 'O..
chrome에 Screen Reader를 설치 page02 1. 인라인 안에 블록 X 인라인 - a ,em ,strong 블록 div p h1 2. 의미있는 요소 사용하기 b대신 콘텐츠에 의미를 부여하는 strong을 사용하기 i대신 콘텐츠에 의미를 부여하는 em을 사용하기 3. hgrop 마구잡이 X import styled form "styled-cpmponents" const FontSizingDiv = styled.div ` font-size: ${props => props/fontSizing || '1rem'}; font-weight : bold; ` fontSize='1.8rem'>xxxxx 4. const MarginButtonList = styled.div ` margin-bottom : ..
function power(base, exponent) { if (exponent === 0) return 1; const half = parseInt(exponent / 2); const temp = power(base, half); const result = (temp * temp) % 94906249; if (exponent % 2 === 1) return (base * result) % 94906249; else return result; } power(2,9) 함수를 호출하면 다음과 같이 작동한다. power(2, 9) 함수가 호출되면, exponent 값인 9가 0이 아니므로 2단계로 이동한다. exponent를 2로 나눈 몫인 4이 half 변수에 저장된다. 그리고 power(2, 4) 함수..
action -> dispatch -> reducers -> store 순으로 간다. actions폴더 .index.js export const removeFromCart = (itemId) => { return { //TODO type: REMOVE_FROM_CART, payload: { itemId, }, } } //removeFromCart 함수는 itemId를 인자로 받아 액션 객체를 반환 //반환된 액션 객체는 type 속성이 REMOVE_FROM_CART로 설정 //payload 속성은 { itemId }로 설정 export const setQuantity = (itemId, quantity) => { return { //TODO type: SET_QUANTITY, payload: { item..

Redux 컴포넌트와 상태를 분리하여 전역에서 상태 관리를 해줄 수 있게 해주는 상태 관리 라이브러리 상태는 동적으로 표현되는 데이터이다. Side Effect 함수의 입력 외에도 함수의 결과에 영향을 미치는 요인 ex) 네트워크 요청, API 호출 Presentation 컴포넌트 어떤 데이터가 들어오는지 상관하지 않고, 설사 데이터가 가짜 데이터라 할지라도 컴포넌트는 표현(presentation) 그 자체에 집중 상태를 구분 로컬 상태, 전역 상태 로컬 상태는 특정 컴포넌트 안에서만 관리되는 상태이며, 전역 상태는 프로덕트 전체 혹은 여러 가지 컴포넌트가 동시에 관리하는 상태 다른 컴포넌트와 데이터를 공유하지 않는 폼(form) 데이터는 대부분 로컬 상태입 ex)input box, select box ..