듀비 라이프

SVN을 형상관리 용도로 사용하는 프로젝트에 투입되게 되었다. 그게 뭔지도 몰랐는데 git같은 형상관리 프로그램이라고 했다. 별로 쓰고 싶지 않았지만.. 난 을이니까 사용해야한다. TortoiseSVN 설치 https://tortoisesvn.net/downloads.html Downloads · TortoiseSVN download TortoiseSVN tortoisesvn.net 위 링크에서 TortoiseSVN을 설치해야한다. 가운데 for 64-bit OS로 설치했다. 다음 다음 누르면서 진행하면, 간단하게 설치가 종료된다. TortoiseSVN 설치 확인 일단 소스를 다운받을 디렉토리를 하나 생성한다. 디렉토리에 오른쪽 버튼을 눌렀을 때, 이렇게 TortoiseSVN이 추가되어있다면 사용이 가능..

최근 카페24의 쇼핑몰 호스팅을 사용하는 홈페이지의 소스를 수정할 일이 생겼다. 몇 년전 대학 다닐 시절에 닷홈의 호스팅 서비스를 사용해본 이후, 호스팅 서비스는 처음이라 많이 버벅였다. 카페24의 서비스에는 여러가지가 있는데, ftp에 직접 접근이 가능한 서비스와 그렇지 않은 서비스가 있다. 그 중 쇼핑몰 호스팅은 ftp에 직접 접근과 DB 접근이 불가능하다. 있는 템플릿에서 html과 javascript, jquery로 프론트엔드만 수정 가능하다는 말이다. 카페24의 쇼핑몰 호스팅의 프론트엔드 개발 방식은 모던 스타일과는 다른데, 모듈을 따로 생성해서 화면에 넣는 react의 방식과 조금은 유사하다. 하지만 EC 서비스에서는 모듈 생성하는 방법도 막혀있는 것 같고.. 자세히 나와있는 부분이 없어서 있..

AWS에서 만든 인스턴스에 ftp로 접속하기 위해 파일질라를 이용해보기로 한다. AWS에서 클라우드 서버 무료로 만들기는 아래 링크 참고 https://vivacolor96.tistory.com/87 AWS에서 무료 클라우드 서버 사용하기 간단하게 사용할 테스트 서버 셋팅을 위해 무료 클라우드 서버를 사용하기로 했다. OCI등 여러가지 클라우드 서버가 있지만, 역시 많이 쓰이는 AWS(Amazon Web Services)의 프리 티어를 사용하기로 한다 vivacolor96.tistory.com 위 게시글에서 AWS의 프리 티어 서비스를 이용해 무료 클라우드 서버를 생성했다. 생성한 서버에 FTP로 접속하기 위해 필요한 준비물이 있다. AWS 인스턴스에 FTP 접속을 위한 준비물 1. FTP 접속 프로그램..

간단하게 사용할 테스트 서버 셋팅을 위해 무료 클라우드 서버를 사용하기로 했다. OCI등 여러가지 클라우드 서버가 있지만, 역시 많이 쓰이는 AWS(Amazon Web Services)의 프리 티어를 사용하기로 한다. AWS 접속 및 준비 무료 클라우드 컴퓨팅 서비스 - AWS 프리 티어 이러한 프리 티어 혜택은 AWS 신규 고객에게만 제공되며 AWS 가입일로부터 12개월 동안 유효합니다. 12개월의 무료 사용 기간이 만료되거나 애플리케이션 사용량이 프리 티어 범위를 초과할 경우 aws.amazon.com 위의 AWS 홈페이지로 접속해서, "콘솔에 로그인" 버튼을 누르면 회원가입 혹은 로그인을 한다. 로그인 후에는 콘솔 홈에 접속이 가능하다. 콘솔 홈에서 인스턴스라고 검색한다. 검색 결과 중 EC2(클라..

도메인의 필요성 웹사이트 개발, 블로그 등 도메인이 사용되는 곳은 매우 많다. 브라우저로 웹사이트에 접속했을 때 나타나는 도메인 주소는 해당 사이트의 특징을 나타낸다 쇼핑몰이라면 무엇을 판매하는지, 회사소개 홈페이지라면 어떤 회사인지 등등.. 또한, 도메인이 연결되지 않은 ip 주소보다는 도메인이 홈페이지를 브랜딩화하고 사용자로 하여금 홈페이지를 잘 기억하게 하는데 도움을 준다. 그러한 도메인을 판매하는 곳은 가비아, 카페24, 호스팅KR 등이 있다. 그 중 내가 이용한 곳은 가비아라는 업체다. https://www.gabia.com/ 웹을 넘어 클라우드로. 가비아 그룹웨어부터 멀티클라우드까지 하나의 클라우드 허브 www.gabia.com 가비아에서 도메인 검색하기 홈페이지 도메인을 구입하기 위해서는 가..

예전에나 지금이나 차트를 표시해줘야 할 때는 c3.js를 잘 이용하고 있다. 근데 사용하다보니 디자인이 좀 질려서.. 직접 커스텀 하기는 또 귀찮고 다른 차트 라이브러리는 어떤게 있는지 좀 찾아봤다. 1. c3.js C3.js | D3-based reusable chart library Comfortable C3 makes it easy to generate D3-based charts by wrapping the code required to construct the entire chart. We don't need to write D3 code any more. Customizable C3 gives some classes to each element when generating, so you can..

c3.js 설치 및 기본 사용법은 아래 링크 참고 https://vivacolor96.tistory.com/68 javascript ) c3.js를 이용한 차트 표시 쇼핑몰 관리자를 작업중인데, 대시보드에 매출이나 회원 등의 수치 변화를 나타내는 그래프를 표시해주어야 했다. 예전 작업에서 사용했던 c3.js가 생각나서 사용해보기로 했다. 시작하기 일단 vivacolor96.tistory.com 위의 내용까지는 javascript 안에서 노출하고자 하는 값을 배열에 직접 값을 넣어주었다. 하지만 분석용 차트 표시하면서 이렇게 사용할 사람은 많지 않겠지.. 나 또한 쇼핑몰 관리자에서 여러 값의 변화를 표시하기 위해 사용하는 것이므로 데이터 연동이 필수적이다. 페이지 로딩하자마자 보이는 차트라서 ajax를 사..

쇼핑몰 관리자를 작업중인데, 대시보드에 매출이나 회원 등의 수치 변화를 나타내는 그래프를 표시해주어야 했다. 예전 작업에서 사용했던 c3.js가 생각나서 사용해보기로 했다. 시작하기 일단 아래 깃허브 링크에서 c3.js를 다운받는다. https://github.com/c3js/c3/releases/tag/v0.7.20 Release v0.7.20 · c3js/c3 Changes Fix config subchart_axis_x_show (#2806) Fix pan of y-axis when zoomed and rotated=true #2799 (#2805) github.com 서버에 올리고, 아래처럼 사이에 추가해준다. 1 2 3 4 5 6 cs c3는 d3기반으로 이루어져 있다. d3.js도 함께 불러와..

GoToPage 클래스를 누르면 페이지가 이동된다. 현재 페이지를 전역으로 선언하고 swiper에서 슬라이드 넘길때 현재 페이지 index값을 가져와서 저장 한다. 이후 버튼 눌렀을 때 현재 페이지의 다음 페이지로 넘어가도록 한다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 var activePage = 0; // 슬라이드 현재 페이지 var total_count = 5; // 슬라이드 전체 페이지 // 스와이퍼 생성 var swiperSlide= new Swiper(".swiperSlide", { loop : true, speed : 500, autoplay: { delay: 10..

슬라이드 조건 - 슬라이드 개수는 5개 - delay시간은 5초 - 자동으로 5초뒤면 넘어가고, 무한루프 swiper로 슬라이드 만들고, 세로 슬라이드 옵션을 켜면 익스플로러에서 깨지는 현상이 있었다. 그래서 그냥 직접 만들었던 세로 슬라이드 소스코드다. 그땐 DB에서 값 불러오는 슬라이드였어서 php 코드랑 얽혀있었는데 다 배제하고 슬라이드 기능만 있는 순수 html, javascript 코드다. 요샌 익스플로러까지 신경들 안쓰니, 그냥 스와이퍼 사용한다. 스와이퍼 짱짱맨 html, javascript 소스 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40..