오늘의 CODE

git 명령어 1) [파일명.확장자명]을 스테이지에 올림 git add [파일명.확장자명] git add . #수정한 전체파일을 스테이지에 올림 2) 커밋 메시지[메시지명]을 붙여 커밋 git commit -m "[메시지명]" 3) 메시지[메시지명]을 붙여서 스테이징과 커밋을 동시에 진행 git commit -a -m "[메시지명]" 4) 커밋 내역 확인 git log git log --pretty=oneline #한줄로 출력 git log --oneline #할줄에 한커밋씩 출력 git log --branches --graph. #커밋로그에 각 브랜치의 커밋을 그래프로 표시 5) 특정 커밋 내역 확인 git show [커밋 id] 6) 최근 버전과 작업 폴더의 수정 파일 사이의 차이를 출력 git di..

HTML은 태그로 마크업할 것 네이버, 다음, 구글 등 이메일 클라이언트들은 각각 다른 이메일 렌더링 버전을 가지고 있다. 보안상의 이유로 일부 코드를 막아두거나 쓸 수 있는 태그와 속성, css 속성에 제한을 두고 있으며, 그로 인해 작성한 코드가 적용되지 않는 경우도 있다. 또한 기존 자주 사용하는 태그로 웹표준 방식의 마크업을 하게 되면 구조가 틀어지게 된다. 그러므로 대부분의 이메일 클라이언트에서 잘 나오는 태그가 크로스 브라우징에도 적합하다. CSS는 인라인 스타일로 작성할 것 css를 정의하는 방법은 아래와 같이 3가지가 있다. 외부문서 작성(Linked Style) 문서내부 작성(Embedded Style) 태그에 직접 지정(Inline Style) 이메일 클라이언트는 보안상의 이유로 나 태..

vue 프로젝트를 생성하고 세팅을 하던 중 새로운 에러가 발생했다. src/main.js에서 에러가 발생!! new Vue({ el:'#app', render: h => h(App) }) new를 쓰지 말랜다. 검색해 봤더니 eslint 때문에 발생하는 현상이란다. 제일 간단하게는 new를 그대로 사용하지 않고 변수를 선언하는 방법이 있다. 이 방법으로 나는 해결을 봤으니 더이상의 방법을 찾고 싶지 않았지만.... 후에 이게 아닌 보다 원천적인 해결을 원할 수도 있으니... var vm = new Vue({router, render: h => h(App)}) vm.$mount('#app') new를 변수에 선언하지 못하는 상황인 경우, eslint no-new: "error"을 입력해준다면 해결이 된다고..

는 단어 중간에서 행바꿈될 수 있는 위치를 정의할 때 사용함. 길이가 굉장히 긴 단어의 경우, 브라우저는 자동으로 행바꿈을 실행하게 되는데 이때에 브라우저가 해당 단어를 잘못된 위치에서 행바꿈하지 않도록 요소를 사용하여 행바꿈 될 수 있는 위치를 직접 명시할 때 사용합니다. 태그는 길이가 긴 단어의 경우, 브라우저와 상관없이 무조건 행바꿈을 실행하도록 명시합니다. * 태그는 html5에서 새롭게 추가된 요소로 ie에서는 지원하지 않음. http://this.is.a.really.long.example.com/With/deeper/level/pages/deeper/level/pages/deeper/level/pages/deeper/level/pages/deeper/level/pages

li에서 v-for문을 만들던 중 아래와 같은 에러가 뜸 원인 v-for 사용 시 key 값이 요구되므로 필수로 입력해줘야 함. 결과 v-bind:key 속성 추가 시 에러 없어짐

브라우저에서 지원하지 않는 코드를 사용 가능하도록 하게 하는 코드 조건이나 플러그인(추가 기능)을 의미한다. 예를 들어 ES5에 존재하지 않는 ES6의 Map, Promise, Set, Object.assign() 등을 사용 가능한 객체로 만들어준다. 브라우저(특정 엔진)에서 지원하지 않는 코드를 사용할 때 바벨(babel)과 같은 트랜스파일러를 사용하는데 babel에서 사용되던 babel-polygill 모듈이 Babel v7.4.0부터 더이상 사용되지 않으므로 ECMAScript 기능을 대체하는 core-js/stable, 제네레이터 함수 기능을 대체하는 regenerator-runtime/runtime을 사용한다. core-js core-js Standard library www.npmjs.com ..

trim() 메서드는 문자열 양 끝의 공백을 제거함. 여기서 공백이란 모든 공백문자 space, tab, 등과 같은 모든 개행문자를 의미함 if(!String.prototype.trim) { String.prototype.trim = function() { return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, ''); }; } return str 문자열의 양쪽 공백을 제거한 후 문자열을 반환 str 문자열에 공백이 없어도 예외가 발생하지 않고 새 문자열 반환(본질적으로 str의 복사본이라고 할 수 있음) 한쪽 끝의 공백만 제거한 문자열을 반환하려면 trimStart() 또는 trimEnd() 메서드를 사용할 것 폴리필(polyfill) 다른 코드 전에 아..

객체를 합치거나 합칠 때 2개의 객체가 같은 프로퍼티를 가지고 있다면 그 값을 덮어쓰기 해주며, 객체의 복제에서도 사용할 수 있음. (object.assign은 폼(form) 등에 빈번히 이용됨) 1. 오브젝트를 합치기 const target = {a: 1, b: 2} const sources = {c: 3, d: 4} const returnedTarget = Object.assign(target, sources); console.log(target); // { a: 1, b: 2, c: 3, d: 4 } console.log(sources); // { c: 3, d: 4 } console.log(returnedTarget); // { a: 1, b: 2, c: 3, d: 4 } 2. 같은 프로퍼티를 가..

ie8이하 지원 X DOMContentLoaded HTML이 모두 로드되고, DOM 트리가 완성되었지만, 외부 리소스(img, etc.)가 아직 로드되지 않았을 때 실행하는 이벤트로 DOM이 준비 상태이기 때문에 DOM 노드를 제어할 수 있음. jQuery의 ready와 동일하다고 볼 수 있다. load 브라우저의 모든 리소스(img, style, script, etc..)가 로드되었을 때 실행하는 이벤트로 모든 리소스가 로드된 시점이기 때문에, img 사이즈와 같은 값을 얻을 수 있다. beforeunload / unload 페이지를 떠날 때 실행하는 이벤트로 변화에 따른 저장 여부 및 페이지 이탈 여부를 확인할 수 있다. 1. load보다 DOMContentLoaded를 사용하는 이유? load는 모..

현재 열린 포트 목록 확인 lsof -PiTCP -sTCP:LISTEN 찾기 lsof -i :포트넘버 Kill kill -9 (확인한 PID)