분류 전체보기266 atom 유용한 단축키 HTML 코드를 짜다보면 가장 불편한것중에 하나가 바로 닫혀있는 태그로 이동하는 작업이다.(특히 HTML 코드가 길어질수록 더 그렇다.) 그래서 맨날 스크롤 노가다를 하다가 최근에 ctrl + m 키가 본 문제를 쉽게 해결해줌을 알게 되었다.ctrl + m 는 현재 지정된 태그의 시작/종료 태그로 이동하는 단축키다. 본 키를 통해서 보다 빠른 개발 및 유지보수가 가능해질거 같다. 2017. 8. 16. masonry 구현시 유의할 점 본 포스트를 올리게 된 이유는 이전에 masonry를 구현해 놓은것에 대한 문제점을 발견하였고,그것을 해결하였기 때문이다. 두가지 문제가 있었는데, 하나는 반응형 컬럼 구현이었다.창의 width값이 변함에 따라서 컬럼의 수가 동적으로 달라졌는데,이떄문에 창의 width값에 따라 원하는 컬럼의 수를 맞춰주기 위해컬럼안의 객체의 너비를 column-width 속성으로 일일이 설정해줘야 했다. 해결 방법을 찾아보니 column-count 이라는 속성을 이용하면 쉽게 해결할 수 있었다.본 속성은 창이 width 값이 달라져도 컬럼의 개수를 일정하게 유지시켜주는 속성이다. 다음 문제로는 컨텐츠가 세로로 짤려서 다음 컬럼으로 가는 문제였는데,본 문제는 컬럼안에 있는 각 객체에 break-inside: avoid 속.. 2017. 8. 10. 크롬브라우저에서 로컬서버 돌리기 웹앱 작업을 하다보면 반드시 로컬 서버를 통해서 앱을 열어야 하는 경우가 생긴다.이는 cross domain 문제으로 추정된다. cross Domain 이란 서로 다른 도메인에서 javascript로 접근하려 하거나,다른 서버에 Ajax통신의 결과를 받는 행위를 말한다.하지만 위와같은 행위를 하려할때 javascript의 보안정책중 하나인 same-origin policy(동일 근원 정책)에 걸려서 원하는 결과를 받아낼수 없게 된다.same-origin policy란 javascript는 같은 도메인 내에서만 작동하는것을 원칙으로 한다는 법칙이다. 그래서 결론적으로 로컬 서버환경을 구축하여 실행시키면 잘 열리게 된다.(물론 이것말고도 여러가지 우회방법은 존재한다.) 이러한 cross domain 문제는 .. 2017. 8. 8. yyyy-mm-dd 형식으로 날짜 데이터 쉽게 꺼내는 방법 결론적으로 toISOString() 메소드를 이용하여 날짜 형식을 변환한 후에그중에서 yyyy-mm-dd 형식의 데이터만 추출하면 된다. 자세한 사항은 아래의 링크를 참조하면 된다. https://msdn.microsoft.com/ko-kr/library/ff925953(v=vs.94).aspx https://stackoverflow.com/questions/23593052/format-javascript-date-to-yyyy-mm-dd 2017. 8. 4. 서버로 보내기전 한글이 포함된 url을 인코딩하는 방법 클라이언트 단에서 서버쪽으로 한글이 포함된 url 주소를 보낼때서버에서 해당 url을 제대로 받지 못할때가 있다. 이러한 문제는 클라이언트와 서버와의 인코딩 형식이 다를때 발생하는데,클라이언트에서는 uft-8 형식으로 url 주소를 보내는 반면, 서버에서는 url을 유니코드 형식으로 변환해서 받기 때문이다. 그렇기에 클라이언트에서 한글이 포함된 url을 서버에 보낼때url의 인코딩 형식을 유니코드로 변환해줄 필요가 있다. 이러한 경우 encodeURIComponent() 라는 함수를 이용하면 된다.본 함수로 url 부분에서 한글로 된 부분만 해당 함수로 감싸주면 문제는 해결된다.(참고로 저 함수로 url 전체를 감싸면 안된다.이유는 해당함수가 특수문자는 제외하고 변환하기 때문에 일부값들이 생략되어 전달될.. 2017. 7. 28. SVG filter에 대하여 최근 SVG 필터를 이용하여 작품읆 하나 만들 준비를 하고 있는데,해당 필터에 대한 한국어 페이지 정보가 미미함을 알게 되었다.그래서 내가 직접 정리해 보려고 한다. 먼저 filter 태그를 살펴보면,여러가지 속성이 있지만 대부분 기본적인 것이고 그렇지 않은것을 보자면filterRes, filterUnits, primitiveUnits 정도가 있다.이중에서 filterRes 폐기되어 더이상 사용하지 않는다고 한다.그러니 filterUnits, primitiveUnits 정도만 알아두면 된다. 솔직히 filterUnits, primitiveUnits에 대한 설명글을 읽어 봤지만정확히 어떤 기능을 하는 속성인지는 파악이 안 되었다. 두개의 속성 모두 userSpaceOnUse, objectBoundingBo.. 2017. 7. 26. mendeley를 사용하면서 주의할점 최근 논문 관리 프로그램인 mendeley를 사용해보았다.그런데 예상치 못한 아주 간단한 문제에서 30분이 낭비되었다. 문제는 저자 기술이었는데, 해당 인풋 필드가 string 파싱을 하고 있기에다수의 저자를 기술하려면 그에따른 string 패턴을 알고 있어야 했다. 구글링을 해봐도 방법이 쉽게 나오지 않았다.그러다 한 사람이 올린 스샷에서 단서를 찾아 문제를 해결하였다.답은 아주 간단했다.그저 개행으로 구분해주면 된다. (즉, 엔터를 치면 된다..) 참 간단한 문제이지만 처음 사용하는 사람들은 혼란을 느낄수도 있기에 적어놓는다. 2017. 7. 20. line-through 부분만 색깔 바꾸기 최근 지인에게 텍스트의 색은 그대로 놔두고 line-through의 색만을 바꿀수 있느냐고 질문을 받았는데,그렇게 해본 경험이 없었기에 찾아보게 되었다. 찾아보니 그 방법이 금방 나왔다.예제 및 방법은 아래 링크를 참고하면 된다. https://jsfiddle.net/kevinfunk/b2ztqLr3/ 2017. 7. 13. datatables editor 파일 업로드 사용하기 datatables editor에서 파일 업로드를 사용하고 싶으면,아래의 예제링크를 참고하면 된다. https://editor.datatables.net/examples/advanced/upload.html 문제가 있다면 본 예제에서 서버사이드는 php 언어만 보여주고 있기에,node.js를 쓰는 경우 ajax 함수 발생에 따른 반환 데이터를 직접 짜주어야 한다. 그렇기에 datatables 팀에서는 php 이외의 서버언어를 사용하는 개발자들을 위해서클라이언트에서 서버로 저달하는 데이터와 서버에서 클라이언트로 전달하는 데이터를 아래의 링크에 잘 정리해두었다. https://editor.datatables.net/manual/server 이러한 형식을 맞춰서 클라이언트와 서버가 소통해야 datatables.. 2017. 7. 11. 이전 1 ··· 15 16 17 18 19 20 21 ··· 30 다음