코드스테이츠 (11) 썸네일형 리스트형 Final project - 배포시 쿠키가 안보여요 코드스테이츠 urlclass에서 S3로 배포 하고 Ec2에 node 서버로 된 경우 라고 생각합니다. 쿠키가 안보이는 문제 1. 자신이 소유한 도메인이 없으면 쿠키가 안보이는 것이 당연합니다. --> 도메인 사러 가세요 2. 배포단계에서 set-cookie로 클라이언트에서 쿠키가 저장되지 않는 이유는 sameSite = Lax로 기본 설정되어 있기 때문입니다. (크롬80버전) 3. https로 변경해야 하나요? X route53에서 구매한 도메인에 S3을 추가해 주면 됩니다. node쪽은 어떻게 해야 하나요? 마찬가지로 서브도메인으로 하나 만들어 줍니다 서브도메인 왜 만들어야 하나요? --> react에서 axios로 요청을 하고 받을때 크롬의 보안 정책때문에 samesite:'lax' 때문에 다른 도메.. 코드스테이츠 - im-sprint-auth-token 전날한 session과 비슷합니다. session으로 사용자 인증하냐 , token으로 사용자 인증하냐 차이입니다. 그 차이는 제가 생각 했을때 정보의 중요도 인 것 같습니다. JS에서는 token을 생성하기 위해서 JWT라이브러리을 사용해서 JWT 생성합니다. payload : jwt의 바디에 있는 데이터 값 process.env.ACCESS_SECRET : 키 option : 토큰 만료일, 이러한 옵션 callback_function : 콜백함수 1. 클라이언트가 서버한테 POST로 값을 전달합니다. 서버는 그에게 값에 대한 유무 판단 한 후 클라이언트에게 token을 발급해 줍니다 . 2. 토큰을 발급 된 클라이언트가 서버에 요청합니다. 서버는 토큰에 대한 참, 거짓인지 판단 후 클라이언트에게 값을.. 코드스테이츠 - im-sprint-auth-session 1. Client --> Server한테 data을 보내야합니다. Client --> Server한테 데이터을 보내기 위해서는 http 통신을 사용해서 POST을 사용해서 데이터을 보냅니다. JS에서 데이터 보내는 방식 fetch, axios가 있습니다. 2. 이번 스프린트는 로그인 기능이라서 ORM을 이용해서 DB에 ID, password을 저장하지 않습니다. 로그인 기능에서 중요한 것은 DB에 ID, password 의 유무 입니다 . 그래서 ORM을 사용해서 DB에 해당하는 ID의 유무을 판단합니다. 3. 클라이언트에서 요청에 대한 res가 있어야합니다. 로그인 유무에 따라서 세션ID을 생성 후 req에 값을 전달합니다.(서버에 저장하기위해서) https://github.com/expressjs/s.. codestate - 섹션 2 - Frontend & Web Architecture 저는 컴퓨터 보안쪽을 하다가 개발자가 되고 싶다는 생각으로 코드스테이츠에 수업을 들었기 때문에 섹션1의 HA test는 쉽게 통과 했고 섹션2의 HA test에 한 번 떨어지고 두번째 섹션2의 HA test에 통과햇습니다. 첫번째 떨어질때 왜 떨어 졌을까? 고민햇습니다. 스프린트도 다 제출했고, HA2 test도 정답률 90퍼센트 였습니다. 불합격 통보메일 본 저는 온 생각이 다 들었습니다. 그래도 나는 전공자인데 한번에 붙어야지, 비록 JS, 프론트 라이브러리등 처음 접하지만 그래도 다른 언어랑 비슷한 기능을 하는 놈들이 때문에 쉽게 이해도 했는데, 왜 떨어 졌을까? 찾아보니 토이 미제출 5회 및 출석관리가 엉망이었습니다. 1. 토이 미제출 한 이유 토이 문제들이 너무 어려웠습니다. 마치 레고 밟고 사.. 코드스테이츠 - DOM DOM의 개념을 이해할 수 있다. Document Object Model --> 웹 페이지에 대한 인터페이스 DOM의 구조를 파악하고, HTML과 DOM이 어떻게 닮아있는지 알 수 있다. HTML에서 Javascript 파일을 불러올 때 주의점에 대해서 이해할 수 있다. 태그가 적용되는 위치에 따라서 실행 결과가 달라질 수 있음을 이해할 수 있다. parentElement or parentNode 특정 엘리먼트의 부모 엘리먼트를 가지고 있는 속성값이다. 이 속성값은 엘리먼트 마다 할당되어 있다. parentElement와 parentNode는 같은 기능을 하지만, 리턴값에서 약간 다르다. parentElement는 부모 노드가 없을 때 null 을 리턴하지만, parentNode는 Document nod.. 코드스테이츠 - koans 01_Introduction.js 02_Types-part1.js -- 문자와 숫자 차이점 -- ==, === 차이점 04_ArrowFunction.js 화살표 함수 문법 클로저 문법 05_Scope.js 지역 변수와 전역변수 차이점 06_Types-part2.js 원시 자료형 vs 참조 자료형 08_Object.js 객체는 length을 사용 못한다. 09_SpreadSyntax.js ...object --> 객체, 배열을 포함한다 arguments vs array vs Array.from 10_Destructuring.js 객체 키 분리 및 키 값 업데이트 되는 시점 코드스테이츠 [JS/Node] 핵심 개념과 주요 문법 원시 자료형과 참조 자료형 원시 자료형(primitive type)과 참조 자료형(reference type)의 구분이 왜 필요한지에 대해서 영상을 보고 이해할 수 있다. 원시 자료형과 참조 자료형의 차이를 이해하고, 각자 맞는 상황에서 사용할 수 있다. 원시 자료형이 할당될 때에는 변수에 값(value) 자체가 담기고, 참조 자료형이 할당될 때는 보관함의 주소(reference)가 담긴다는 개념을 코드로 설명할 수 있다. 참조 자료형은 기존에 고정된 크기의 보관함이 아니라, 동적으로 크기가 변하는 특별한 보관함을 사용한다는 것을 이해할 수 있다. Scope 스코프의 의미와 적용 범위를 이해할 수 있다 스코프의 주요 규칙을 이해할 수 있다 중첩 규칙 block scope와 function scope 전역.. 코드스테이츠 css 중급코드스테이츠 css 중급 p 엘리먼트의 형제 엘리먼트 중 첫 번째 p 엘리먼트를 선택합니다. (first-child와는 다르게 첫 번째 자식 엘리먼트가 아닌, 처음 등장하는 p를 선택합니다) 코드스테이츠 - 배열 Array.isArray 배열인지 아닌지 판별할 수 있습니다. console.table(array) 배열을 테이블형식으로 만들어서 보기 쉽게 볼 수 있습니다. let arr = [1,2] arr.shift() // 엘리먼트 0째꺼 출력 arr.unshift() // 엘리먼트 0째꺼 문자 삽입 arr.push // 배열 뒤로 데이터 삽입 arr.pop // 배열 뒤로 데이터 출력 concat 1) slice 함수 slice 함수는 배열 인덱스구간을 (얕게 복사한) 배열객체를 반환합니다. (조각) 원소가 String, Number 객체가 아닌 문자열과 숫자의 경우 새 배열에 복사되어 원본에 영향을 주지 않습니다. (단, 딕셔너리, 배열인 경우 영향을 받습니다. 이런 것을 얕은 복사라고 부릅니다.) arr.. 코드스테이츠 git git add : 수정된 파일을 추가할때 git commit -m : 파일에 대해서 설명하기 git push : 로컬에 있는 파일을 git로 보내기 git pull : github에 있는 리파지토리에 있는 파일 가져오기 ( 파일 다운 받고 , 병합까지) git 충돌하는 경우 : 서로 같은 파일의 같은 줄에서 작성줄 일때 소스 코드 작성한 것을 수정한 후 다시 git add --> git commit -m --> git push git petch : 다운만 받습니다.(리파지토리의 변경사항을 알려고 할때) 이전 1 2 다음
