본문 바로가기

Javascript139

jquery에서 contains 함수 jquery에서 키에 따라서 결과를 렌더링할때 쓰는 함수중에 contains라는것이 있다.해당 함수는 하위노드에 특정값을 포함하고 있을때 이벤트가 발생하게 된다.이 함수를 통해 쉽게 글자에 따라 결과가 가려지고 보여지는 기능을 구현할 수 있다.본 함수의 자세한 설명을 보고 싶다면 아래의 링크를 참고하면 된다. https://api.jquery.com/contains-selector/ 그나저나 최근에 규모있는 프로그램을 Node.js 및 jquery로 짜고 있는데,최신 프론트엔드 프레임워크로 앱 컴포넌트화를 하는것의 필요성을 느끼고 있다.(역시 사람은 겪어봐야 이게 왜 탄생하게 되었는지를 아는거 같다.ㅅ.) 2018. 2. 7.
masonry 라이브러리 잘 사용하기 최근 masonry 때문에 정말 많은 고민을 하였다.좋은 라이브러리이긴 하지만 제대로 설정을 안 잡아주면 여러가지고 허점이 많은 라이브러리이기도 하다.특히나 이번에 고민했던것은 콘텐츠를 반응형 그리드 형식으로 출력하는 부분이었는데,아래의 링크를 통해서 영감을 얻어 원했던 완벽한 masonry를 구현할 수 있었다.쉽고 완벽하게 구현하기 위해서 bootstrap의 컬럼 class도 써 주었다. https://codepen.io/Axiol/pen/yzhGF?q=responsive%20masonry&order=popularity&depth=everything&show_forks=false 반응형이 될뿐더러 컨텐츠의 width나 height의 길이가 서로 달라도 빈틈이 생기지 않고 잘 표시해 준다. 2018. 2. 1.
submit 이벤트 지금까지 자주 login 페이지에서의 submit 이벤트를 click으로 했었다.하지만 이렇게 되면 타당성 검사도 못하지 엔터를 쳤을때 바로 이벤트 실행도 못한다.지금까지 왜 이랬는지 모르겠지만,html5의 여러가지 기능혜택을 맛보고 싶다면 로그인페이지의 이벤트는 submit으로 하길 바란다. 2018. 1. 27.
express 앱용 프로세스 관리자 아래의 링크에 express 앱용 프로세스 관리 모듈 및 명령어에 대해 잘 설명되어 있다. http://expressjs.com/ko/advanced/pm.html 2018. 1. 25.
telegram 메세지 보내기에 관한 API 설명 최근 회사에서 우리 홈페이지에서 메세지를 보내면 telegram을 통해 그 메세지가 전달되는 기능을 만들일이 생겼다.해당 기능을 만들기위해 telegram에서 제공하는 API를 조사해야 했다. 조사결과 재미있었던 점은 텔레그램에선 유저간에 직접적으로 채팅을 할 수 있는 API는 제공하고 있지 않다는 점이며,텔레그램의 챗봇을 통해서 메세지를 전달 받을수 있다는 점이다.그러니까 서로간의 메세지를 주고받을 때도 직접 가는게 아니라 그 사람의 챗봇을 통해 메세지를 전달할 수 있다는 말이다.이건 마치 그사람의 비서에게 메세지를 전달하고 그 비서가 그 사람에게 메세지를 전달하는 방식이었다.(왜 이렇게 만들어 놨을까 생각이 든다..) 아래 링크에 텔레그램 봇을 어떻게 생성하고 생성한 봇의 토큰을 가지고 API를 사용.. 2017. 12. 28.
정규표현식 강의 사이트 아래의 사이트에는 정규표현식에 대한 자세하고 쉬운 예제들이 많이 존재한다.정규표현식을 자세히 배우고 싶은 사람이라면 참고하면 좋다. http://zvon.org/comp/r/tut-Regexp.html#Pages~Contents 2017. 12. 21.
이미지 태그 속성의 src를 변환해도 이미지가 변환이 안 되는 경우 제목그대로 이미지 태그 속성의 src를 javascript를 통해 동적으로 변환해도 이미지가 변환이 안 되는 경우가 있다.이러한 경우는 이미지가 서버에서 변했어도 클라이언트에서 이미지 캐시가 남아있어서 제대로 변환이 되지 않는경우인데,이럴때 무리하게 캐시를 비우지 말고, 동적으로 변환하는 src 주소 뒤에 '?' 기호와 함께 스트링을 더하여 주면 된다.자세한 사항은 아래의 링크를 참조하면 된다. https://www.aspsnippets.com/Articles/How-to-remove-delete-image-from-browser-cache-when-Image-is-changed-in-ASPNet.aspx 여기서는 DateTime.Now.Ticks.ToString()을 붙여주는데 실제 돌려보니 안 되고,.. 2017. 12. 18.
vue.js 예제 모음 사이트 이미 아는 사람도 있겠지만 아래의 사이트는 vue.js에 관한 다양한 UI 예제가 올라온 곳이다.아무래도 vue.js를 실무에 사용하려는데 감이 없는 사람들에게 많은 도움이 될수 있다. https://vuejsexamples.com/ 2017. 12. 15.
node.js 이미지버퍼 작업후 저장시 주의할 점 최근 fs 모듈로 jpg 이미지를 불러와 jpeg-js 모듈의 decode 함수를 이용해 이미지버퍼를 추출하고,픽셀배열 작업후에 encode라는 함수를 이용해 인코딩 해준후 다시 fs 모듈을 통해 jpg 이미지로 저장하는 작업을 해보았다.아래는 jpeg-js 모듈 링크이다. https://github.com/eugeneware/jpeg-js 문제는 픽셀작업후 저장되는 이미지에 색 오류가 발생했다는 점이었다.노이즈 색상이 자꾸만 끼어있었다.왜그런지 이유를 찾는데 이틀이 걸렸다.. 문제는 매우 간단했다.이미지버퍼값들중 소수점 값 및 255를 넘어가는 값이 섞여있었다.이럴경우 jpeg 모듈을 통해 encode 할 경우 당연히 결과에 오류가 있을수 밖에 없었다.매우 간단한 사실이지만 항상 이미지를 encode .. 2017. 12. 4.

티스토리툴바