Jaeilit

Array.map() 배열의 각 요소들에 대해 연산을 하여 원본 배열을 유지하고 새로운 배열로 반환 한다. const original_array = [1, 2, 3, 4, 5] const map_array = original_array.map(a => a+1) console.log(original_array) // [1, 2, 3, 4, 5] console.log(map_array) // [2, 3, 4, 5, 6] 원본 배열은 유지된다. 새로운 배열 반환. Array.map vs Array.forEach 두 메서드 전부 배열의 각 요소들을 순회한다는 공통점이 있지만, map 메서드는 원본 배열을 유지하고 새로운 배열로 반환시키고, forEach 는 원본 배열이 바뀐다. 새로운 배열은 undefined ..

1. JWT JWT(JSON WEB TOKEN) 란? JSON 웹 토큰(JWT) 정보를 JSON 객체로 안전하게 전송하기 위한 간결하고 자체 포함된 방법을 정의 하는 개방형 표준( RFC 7519 )입니다. JWT는 크기가 비교적 작기 때문에 URL과 POST 매개변수를 통해 HTTP 헤더 내부에서 보낼 수 있으며 비교적 빠르게 전송됩니다. 모든 Auth0 발급 JWT에는 JSON 웹 서명(JWS)이 있습니다 . 즉, 암호화되지 않고 서명됩니다. 인용글 https://auth0.com/docs/security/tokens/json-web-tokens 항해99 미니프로젝트 사용예제 POST 요청으로 url 담아서 쿠키(token)를 전송 서버측에서 token_receive로 받아옴 받아온 token_rec..

웹 저장소 데이터를 저장을 할 때 서버 DB을 통해서 저장을 하는데, 굳이 서버에서 가지고 있지 않아도 되는 데이터들을 저장해야 할 때가 있을 겁니다. 별로 중요하지 않거나, 지워져도 되거나, 같은 말이지만 유실되도 되거나 등등 그럴때 사용 하는것이 웹 저장소입니다. 중요한 정보는 절대 저장하지 않는다! 1. Local Storage JavaScript 로 조작 도메인, 프로토콜, 포트로 묶여있기 때문에 같으면 같은 스토리지를 공유 브라우저가 달라도 도메인만 같다면 동일한 로컬 스토리지를 사용 서버에 전송하지 않음(쿠키보다 더 많은 자료를 보관 가능) 로컬 스토리지 5mb 쿠키 4kb 사용자가 지우지 않는 이상 브라우저에 계속 남아 있음 클라이언트 저장 자동로그인과 같이 지속적으로 필요한 데이터를 저장 ..

프로젝트 기획 정리 https://jaeilit.tistory.com/20 베포 도메인 http://gmkim.shop 감수성 영화관 | 로그인 닉네임은 2-8자의 한글만 입력 가능합니다. gmkim.shop 뿌듯하다 좋다,,,,

Git똥 찬다해서 Git이라는??? -_-;; 미니 프로젝트 하면서 Git 사용해서 협업하는 방법을 알아두어야 합니다. 혼자 commit 하고 push 할 땐 몰랐습니다. 이렇게 많은 에러가 뜰 줄... 내가 사용한 깃 협업 방법 1. 내 repo 를 사용 할 때, Settings 에서 초대 해주시고 상태만 해주시면 됩니다. 2. 다른 사용자의 repo 를 사용 할 때 clone 없이 올리기, git remote 이름 깃 repo 주소 // 원격저장소 연결 git branch -b 브런치이름 // 브런치를 생성하고 생성 된 브런치로 바로 이동합니다. git add / commit // 추가하고 커밋합니다. git push remote이름 브런치이름 으로 하시면 됩니다. 더보기 간혹 가다가 push 에서 ..

객체란(?) 객체는 데이터들을 저장/관리 합니다. Type 은 Object 입니다. 객체의 프로퍼티와 메서드들은 '키값'으로 구분된다 객체는 여러가지 값을 가질 수 있으며, 함수도 가질 수 있다. 프로퍼티 값이 함수일 경우, 일반 함수와 구분하기 위해 메소드라 부른다. 생성 방식 객체 리터럴 생성자 함수 object.create() 객체 리터럴 방식 const abc = { // 일반적인 key 와 value name : "재일", age : 99, // 함수(메서드) yubin: function() { console.log(this.name, this.age) } } // 객체 console.log(abc) // {name: "재일", age: 99, yubin: ƒ yubin()} // 객체 함수(메..

반응형이나 일반 레이아웃 짤 때 css 단위를 정확히 몰라서 한번 파보도록 해야겠다고 생각을 했습니다. 작업 할 때 의미를 알고 작업 할 수 있도록 짚고 가겠습니다. 단위 px, % rem, em vw, vh vmin, vmax px(픽셀) .div{ width : 100px; height : 100px; } 코드블럭이 이상하게 나오네요,, 가장 기본이 되는 단위 픽셀(px) 입니다. %(퍼센트) .div{ width:50% } 자식은 부모의 넓이만큼을 나눠쓰는 구조, 사진 -> 부모가 width 값을 100%를 쓰고 자식은 그 100%의 50%만 써서 블록이 반만 출력 됨, 3. em, rem .jasic1 { width:10em; font-size : 10px; background-color : re..

CSS 우선순위 1 . !important 2. 아이디 선택자 (#div) 3. class 선택자 (.div) 4. tag 선택자 (div) div { color : red !important; } .div { color : blue } #div { color : black } !important 는 강제로 1순위로 입력 시키는 방법이다. 그 다음은 id 선택자, class 선택자, tag 선택자 순서입니다. 더 정확한 의미는 "선명도" 라고해서 예를 들어 id 선택자는 100점, class 선택자는 10점, 각 선택자 마다 점수가 있는데 점수 환산하여 가장 높은 점수가 우선이 되는 방식입니다.

1. Spread 전개 2. Rest 나머지 매개변수 3. Object.assign() 1. Spread 전개구문 인용글(MDN) https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Spread_syntax 코드 예시(배열) var parts = ['shoulders', 'knees']; var lyrics = ['head', ...parts, 'and', 'toes']; // ["head", "shoulders", "knees", "and", "toes"] 더보기 전개구문이 없을 때에는 배열에 요소를 추가/수정 하려면 splice(수정) 또는 push(추가), concat(붙이기) 를 사용해야 했지만 전개구문을 사용 하면 배..

1. npm과 dependencies, devdependencies 의 이해 -> dependencies 는 프로젝트를 위한 패키지들의 모임 -> devDependencies 는 개발자의 편의를 위한 패키지들의 모임 2. express 프레임워크 사용 -> 서버단을 만드는 것을 도와주는 프레임워크 3. babel의 이해와 babel 패키지 설치 및 babel.config.json 설정 + nodemon 설치 3.1 bable 이란 -> 최신코드를 Node.js 가 이해 할 수 있게 하고 complie을 도와주는 패키지 -> 공식 홈페이지 번역본 Babel은 현재 및 이전 브라우저 또는 환경에서 ECMAScript 2015+ 코드를 이전 버전의 JavaScript로 변환하는 데 주로 사용되는 도구 체인입니..