기주

JWT -JSON WEB TOKEN-Token 기법의 한 종류(웹표준) -JSON형태로 되어있어서. 값의 관리가 쉬움 -조작여부 판단이 간단해서 웹 표준으로 삼고있음   구조-Token이라는 것 자체가 그냥 특정한 폼을 가진 String  1. headertoken의 설정 정보(발행자, 만료시간, 종류 등)  2. payload개발자가 Token에 넣고 싶은 값  3. signature 비밀키로 암호화된 header + payload이렇게 3가지의 Key를 String으로 변환해서 저장한게 Token      jwt가 어떻게 FE 조작을 막는가?1. header와 payload를 각각 String으로 만듬 2. A.B 의 형태로 저장 3. A.B를 비밀키로 암호화해서 C라고 저장 4. 최종적으로 A.B...

winston: 로그 파일 및 로그레벨 관리모듈 winston-daily-rotate-file : 매일 날짜별로 로그 파일 생성 및 관리 모듈 winston 모듈을 쓰는이유) ㄴwinston은 개발환경보다 배포환경에서 로그를 남기기위해 사용한다. ㄴ배포환경은 개발환경과 달리 콘솔창을 확인하기 어렵고, 서버가 재부팅되면 기록이 초기화돼서 보기어렵다 ㄴ그래서 로그나 에러가 발생했을때, 외부파일에 로그기록을 보관하기 위해 사용한다. mongoDB 연결) const mongoose = require("mongoose"); const uri = "mongodb://localhost:포트번호/db명"; mongoose.connect(uri, { useUnifiedTopology: true } ) const mong..

element.style 속성과 getComputedStyle() 메소드의 차이** html, css로 네비게이션을 만들던 도중, 네비게이션이 한번에 동작하지않고 처음 동작할때는 2번을 클릭해야만 동작했다 이 문제를 해결하기위해서는 element.style와 getComputedStyle의 차이를 알아야했다 getComputedStyle() 메소드는 읽기전용* 인 반면, element.style 속성은 새로운 스타일 설정* 하는데에 사용한다 그래서 데이터의 속성을 읽어 확인할때 element.style로 확인을 할경우 문제가 발생했다 잘못된 방법) function menuBarEvent(){ if(nav.style.right == "-300px"){ // element.style 속성은 읽기용이아닌, 새..

dotenv) 환경변수를 .env 파일에 저장하고 process.env로 로드하는 모듈이다 process.env는 환경변수를 불러오는 객체 .env 파일은 루트경로에 배치한다 dotenv를 쓰는이유) 포트번호와 session의 secret 비밀키는 외부에 노출되면 보안적으로 위험하다 클라이언트가 볼 수 없다고해도 github와 같은 오픈소스에 공개될 수 있다 그래서 별도의 .env 외부파일에 정보를 환경변수로 다룰 수 있게 하기 위해서 사용하였다. 그리고 .gitignore에 .env파일을 추가해서 git에 올라가지 않게 해야한다 .env파일) ㄴ 키=밸류 형식으로 나열 ㄴ.env에서는 문장끝에 ";"를 쓰지않는다 secretCode = "secret" port = 8000 .gitignore) # en..

JS object와 JSON 차이점) 기본적으로 JS object와 JSON은 형태가 유사하다 **서버와 클라이언트가 데이터를 주고받을때는 JSON을 이용한다 JS object : 데이터 구조 JSON : 객체의 내용을 기술하기위한 텍스트 "파일". 그래서 .JSON이라는 확장자가 존재. const str=`{"data":[{"name":"yongseong","info":["student","27"]}]}`; const object = {data:[{name:'yongseong',info:['student','27']}]}; 차이점) JSON에서는 키값을 모두 큰따옴표""로 묶어줘야한다 JS object에서는 키값을 큰따옴표로 묶을 필요가 없다 JSON의 타입은 string JS object의 타입은 o..

쿼리스트링) url 끝에 데이터 값을 전달. 쓰는이유 : 같은 path에 다른 데이터값을 줘서 페이지가 동적으로 작동할 수 있게, 상황에따라 다른 정보를 보여줄수 있게 하기 위함이다 사용방법) path뒤에 ?data1="값1"&data2="값2" 와 같은 방 식으로 전해준다 http://index.html/idx=9 밑줄친 부분이 쿼리스트링 api 에서 그 전달 받은 값을 받아서 쓰는법) http://index.html/article?articleIdx=10 를 전달받았다면) app.get("/article", (req, res) => { const articleIdx = req.query.articleIdx; // 변수에 10 할당 }) ㄴ쿼리스트링(articleIdx=10)을 프로퍼티로 갖는다. 그래..