seulcoding

a 태그를 disabled 시키려고 찾아보다가 a tag는 disabled가 없고 href를 없애거나 를 사용하면 된다고 해서 javascript:void(0)이 뭔지 찾아보았다.Mozilla 공식 dev 문서에서는 다음과 같이 얘기하고있다.void 연산자는 주어진 식(expression)을 실행하고 undefined를 반환합니다즉, javascript void 안의 표현식을 실행하고, 이후 undefined를 반환하기 때문에 a 태그를 무력화시킨다.다음 두 코드는 똑같이 a 태그를 비활성화 하는 코드이다. href 안에 #(hash)값 없이 해쉬만 넣으면 아무 일도 일어나지 않기 때문이다.(javascript:;도 javascript:void(0)과 동일한 역할을 한다.) 물론 다음 두 방법 말고도 다..

here’s plenty of solution for get URL parameter with javascript.1. Custom getUrlParam function with JQueryvar getUrlParameter = function getUrlParameter(sParam) { var sPageURL = decodeURIComponent(window.location.search.substring(1)), sURLVariables = sPageURL.split('&'), sParameterName, i; for (i = 0; i $(function(){ $.url.attr('protocol') // --> Protocol: "http" $.url.attr('path') // --> host: ..

특정 요소가 array 안에 있는지 확인하기 위해 includes를 사용했는데, 윈도우에서 다음과 같은 오류가 발생했다.개체가 'includes' 속성이나 메서드를 지원하지 않습니다. 찾아보니 includes가 엣지 이외에서는 거의 지원되지 않는다고 한다.그래서 indexOf를 찾아보니 이것도 I.E.에서 약간의 이슈가 있는것 같지만 기본적으로 잘 동작한다.// before code if (arrayName.includes(sth)) { ... } // after code if (arrayName.indexOf(sth) !== -1) { ... } python을 사용해서 backend 코딩을 할 때에는 브라우저 이슈를 전혀 생각하지 않았는데, 앞으로는 브라우저간 호환을 생각하고 코딩할 수 있는 습관을 길..

Installgem install sass # or sudo gem install sass When installed, check versionsass -v Compile usage# compile one file sass input.scss output.css # watching (automatically compile) sass --watch input.scss:output.css # set style sass --watch --style compressed input.scss output.css

install vue-routernpm install --save vue-router set up vue-routermain.js에서 Vue.use를 통해 사용할 수 있다.import Vue from 'vue' import VueRouter from 'vue-router'; import App from './App.vue' Vue.use(VueRouter); new Vue({ el: '#app', render: h => h(App) }) routes.js 만들기src/routes.js에 라우트를 선언해준다.import User from './components/user/User.vue'; import Home from './components/Home.vue'; export const routes = [..

sass를 사용하는데 좋은 가이드라인이 있어서 공유한다. 구문, 설계 등 다양한 sass 사용 방식을 잘 설명해 놓은 글.sass를 사용하는 중이거나 사용 할 예정에 있는 사람이라면 한 번 읽어봄직하다.Sass Guidelines. 한국어 번역판은 여기에서 확인할 수 있다.다음은 저자가 너무 길어서 안 읽는 사람들을 위해 쓴 정리.탭 대신 스페이스 두(2) 칸을 들여쓴다;행의 너비는 80 글자;CSS를 여러 행으로 적절히 작성한다;공백을 의미 있게 사용한다;문자열과 URL에는 인용 부호(작은 따옴표)를 붙인다;뒤따르는 0은 표기하지 않는다. 앞장서는 0은 반드시 표기한다;연산은 괄호로 감싼다;매직 넘버를 피한다;색은 키워드 > HSL > RGB > 16진법 순으로 표기한다;리스트는 쉼표로 구분한다;리스트..

VariableSass는 variable을 사용해서 자주 쓰는 것들을 쉽게 사용할 수 있다. $를 사용해서 var를 선언할 수 있다.$color-red: red; div { background-color: $color-red; } p { background-color: $color-red; } NestedSass는 중첩된 엘리멘트들을 다 쓰지 않고, 해당 엘리먼트 내에 작성이 가능하게 하여 훨씬 간편하게 스타일을 적용할 수 있다..post { color: red; .title { color: black; } } Referencing Parent Selectors (부모참조 선택자: &)위의 중첩을 사용할 때, &를 사용하면 css로 컴파일 될 때 복합선택이 된다..post { color: red; .ti..

Vue Resource공식 github pageVue Resource 설치하기npm으로 설치하기npm install --save vue-resource cdn Vue Resource 전역에 불러오기main.jsimport Vue from 'vue' import VueResource from 'vue-resource'; import App from './App.vue' Vue.use(VueResource); new Vue({ render: h => h(App) }) Post server data이번 예시에서는 간단하게 filebase database를 사용해 보겠다. (Firebase 콘솔에서 아주 쉽게 데이터베이스를 만들 수 있다. 간단한 테스트 용도로는 무료로 사용이 가능하다.) Http testing..

Input data bind basicinput tag에 데이터를 바인딩 하기 위해서는 v-model이 필요하다. v-model을 사용하면 아주 쉽게 데이터를 바인딩 시킬 수 있다.App.vueApp.vue에 email input 필드를 추가한 후, email 데이터를 만들고 v-model="email"로 해당 인풋 필드와 연결시켜준다. Email Mail: export default { data() { return { email: "" } } } 이제 input 필드에 값을 입력하면 아래 `` 데이터에 바인딩 되는 것을 볼 수 있다.v-model.lazyv-model은 기본적으로 모든 key stroke가 발생할 때마다 값을 업데이트 시킨다. 이를 방지하고 싶다면 v-model.lazy를 사용하면 된다..

Filtersvue.js는 default filter가 없기 때문에 사용하기 위해서는 직접 만들어야 한다.Local filter 만들기methods를 만드는 것처럼 아주 간단하게 만들 수 있다.lower case를 모두 upper case로 만들어 주는 필터를 만들어보겠다. export default { data() { return { text: 'Hello There!' } }, filters: { toUppercase(value) { return value.toUpperCase(); } } } 이제 HELLO THERE라고 출력되는 것을 볼 수 있다.Global filter 만들기, Filter chainglobal filter도 비슷하게 만들 수 있다. main.js에 Vue.filter()로 등록..