본문 바로가기

분류 전체보기

 (73)
slick slider 사용법 및 옵션 (반응형 포함) - 삽질중인 개발자 - slick 슬라이더 사용법 및 옵션 정리 - slick slider는 반응형 웹을 지원하는 슬라이더 라이브러리다. 여러가지 슬라이더 라이브러리가 있지만 그 중에서 가장 좋은 라이브러리 같다. 1. slick 다운로드 및 js, css 파일 로드 slick 홈페이지의 오른쪽 상단에 get it now를 클릭 후 다운로드 기본적으로 slick slider는 jQuery 기반으로 만들어진 라이브러리라 jQuery가 필요하다. slick-theme.css 의 기본 다음 및 이전 화살표 버튼은 횐색바탕에 투명색으로 설정이 되어 있어 배경화면이 흰색인 경우 잘 안 보이기에 상황에 맞게 수정이 필요하다. 2. 기본 사용법 slick slider의 기본 HTML 구성은 아래의 코드처럼 div의 형태로 구성되어 있는..
[CentOS7] SVN 설치 및 이클립스 적용 - 삽질중인 개발자 - SVN 설치 및 이클립스 url 적용 - svn 설치 방법 및 repository 세팅 방법 OS : CentOS7 방화벽 : OFF 1. SVN 설치 하기 yum install -y subversion 2. SVN의 루트 폴더로 사용할 폴더 생성 # / mkdir svn 3. SVN 루트 설정 svn 루트 설정 잘하세요.. 이것 때문에 삽질하다가 2시간 날림.. vi /etc/sysconfig/svnserve =================================== # OPTIONS is used to pass command-line arguments to svnserve. # # Specify the repository location in -r parameter: # root 폴더 지정 ..
summernote 이미지 업로드 구현 및 이미지 경로 설정 - 삽질중인 개발자 - summernote 이미지 업로드 구현 방법 - summernote는 base64로 인코딩 후 저장하는 방식이여서 이미지 파일 관리가 어렵다. 그래서 callback을 이용하여 이미지를 특정 경로에 업로드 후 고유한 url를 리턴하는 방식으로 구현한다. 이 과정에서 url을 통한 외부 리소스 접근을 위한 톰캣 설정도 해줘야 한다. spring boot 를 기준으로 설명된 글입니다. 1. summernote 세팅 및 이미지 파일 업로드 callback 함수 구현 써머노트에서는 몇개의 callback 함수를 지원한다. 그 중 이미지를 업로드할 때 사용할 callback 함수는 onImageUpload 란 함수이다. onPaste 함수(복붙에 대한 콜백) 는 - 기본값을 사용하면 복붙시 base64로 인코..
오라클 한글 초성 검색 방법 , DB 초중종성 검색 방법 - 삽질중인 개발자 - 오라클에서 한글 초중종성 검색 방법 - 오라클에서 한글 초중종성 검색을 구현하는 방법이다. 함수를 사용한 방법으로 초성, 중성, 종성의 문자를 추출하여 비교하는 방식이다. 가장 베스트 방법은 처음부터 검색될 단어의 초성을 저장하고 있는 것이지만 DB 구조가 그렇지 않다면 아래와 같은 방식으로 구현한다. 아래의 함수에서 약간 수정하면 초성용 함수도 만들 수 있다. 1. 한글을 초중종성으로 나눠주는 FUNCTION 생성 아래의 초성을 나누는 함수를 살짝 수정해서 원하는 방식으로 구현하면 됩니다. CREATE OR REPLACE FUNCTION FN_GET_KOREA_SYLLABLE ( i_p1 IN VARCHAR2 ) RETURN VARCHAR2 AS l_rt VARCHAR2 (4000); FUNCTIO..
jQuery UI datepicker 사용법 - 삽질중인 개발자 - jQuery UI datepicker 사용법 및 옵션 정리 - jQuery Ui 중에서 datepicker는 간단한 option을 통한 캘린더 구현이 가능한 사용하기 편한 라이브러리다. 한글 캘린더 또한 구현이 가능하다. (좀 더 스타일리쉬한 캘린더를 원하면 bootstrap datepicker 를 클릭) 다운로드 사이트 ( jQuery UI 공식 페이지 ) 이미 기존에 사용되고 있는 사이트에서 jQuery UI 의 모든 기능을 다운 받아서 사용하면 다른 css나 js와 충돌이 날 가능성이 있다. 따라서 원하는 부분만 설정해서 다운받도록 한다. Download Builder | jQuery UI Download Builder jqueryui.com 1. JQuery UI datepicker 디폴트 옵..
twbspagination ajax & totalPages 변경 방법 - 삽질중인 개발자 twbspaigination ajax & totalPages 변경 방법 twbspagination 을 이용하여 동적으로 총 페이지 수를 변경하면서 페이지네이션을 하려고 하면 onpageclick이 1회 호출되어 무한 호출이 되는 현상을 볼 수 있을 것이다. 이러한 현상때문에 totalPage 를 변경을 할 수 없어 동적으로 페이지 수를 변경할 수 없다. 이 현상을 해결하기 위해서는 약간의 로직이 필요하다. ajax 활용 방법 twbs 플러그인은 ajax를 사용하여 동적으로 페이지네이션 버튼 만들기 위해서는 $("#pagination-div").twbsPagination("changeTotalPages", 총 페이지, 변경되고 난 후 선택될 페이지 번호); 다음 함수를 사용해서 구현하기에는 클릭이벤트가 발..
Summernote 사용법 , 썸머노트 사용법 - 삽질중인 개발자 - 썸머노트사용법 정리 - 홈페이지에서 글을 쓰는 부분에 일반 텍스트 형태의 글 쓰기만 지원한다면 사용자가 사용하기 불편하다. 이러한 점 때문에 대부분의 홈페이지에서는 웹에디터를 지원한다. 수많은 웹 에디터 중 summernote 에디터는 오픈소스이면서 HTML5 기반의 깔끔한 UI와 가장 많이 쓰이는 기능이 구현되어 있다. summernote에서는 bootstrap4에 기반을 둔 버젼과 독립적으로 사용가능한 라이트 버전이 있다. ( 라이트 버전이 있어서 CSS가 겹치지 않고 사용이 가능한 점이 썸머노트의 강점이다.) 이 포스트는 라이트 버젼을 기반으로 작성할 것입니다. (bootstrap4 버젼은 다른 CSS와 충돌 가능성이 너무 많아서) Summernote 공식 홈페이지 Summernote - Sup..
twbspagination 예제 및 옵션 - 삽질중인 개발자 twbs paigination 옵션 및 사용법 정리 twbspagination 플러그인은 간단한 옵션 설정을 통해 페이지네이션을 해주는 플러그인이다. 이 twbs를 사용하는 이유는 다른 페이지네이션 플러그인에 비하여 사용법이 간단하고 깔끔하다. twbs-pagination은 jQuery와 bootstrap에 최적화 되어 있는 플러그인이다. twbs-pagination의 깃허브 주소 josecebe/twbs-pagination jQuery pagination plugin (bootstrap powered). Contribute to josecebe/twbs-pagination development by creating an account on GitHub. github.com twbs-pagination ..

티스토리툴바