복세편살 개발라이프

Thymeleaf Layout 환경에서 javascript 스크립트 사용하기

Spring boot 환경에서 뷰 리졸버로 thymeleaf를 사용하고 있다.thymeleaf가 제공하는 layout 기능을 사용해 편리하게 메뉴바와 content가 들어갈 공간 등을 잘 잡아 놓았다. [ thymeleaf layout 구성하기 : http://www.leafcats.com/9 ] 이 환경에서 새로 발견한 유용한 플러그인 테스트를 위해 연습용 페이지에서 스크립트를 작성해 보았는데, 아예 스크립트가 작동을 하지 않았다.레이아웃의 템플릿을 잡아놓은 mainLayout.html 파일에서 작성한 스크립트는 정상적으로 동작 하는데, 정작 컨텐츠가 들어갈 html 페이지의 스크립트가 동작하지 않는 것이었다. 문제를 찾기 위해 스크립트 코드 위치를 body 안쪽에도 넣어 보고, header에도 넣어 ..

프로그래밍 & IT/Spring & HTML 2017. 3. 14. 01:17

리눅스 vi editor(vi 에디터)와 gedit 사용법

시스템을 개발하거나 운영하는 사람들에게 있어서 텍스트 에디터는 매우 중요하다. 어떤 작업을 하던 텍스트를 작성하거나 편집하는 과정은 필수적이기 때문이다.리눅스는 텍스트 에디터로 vi 에디터를 제공한다. vi에디터는 유닉스/리눅스 전반에서 공통적으로 사용되기 때문에 사용법을 익혀 두면 도움이 될 것이다. 텍스트 에디터 하나 쓰는데 굳이 사용법을 익힐 필요가 있을까 싶은 생각이 들 수 도 있다. 하지만 vi가 Visual의 약자를 따서 만들어 졌다지만 전혀 visual 스럽지 않기 때문에 처음 접할 경우 조금 당황스럽다. 일단 익숙해 지면 모든 유닉스/리눅스 관련 OS에서 유용하게 사용할 수 있기 때문에 시간을 익혀두는 것이 좋다. vi Editor vi에디터를 사용하기 위해서는 우선 아래의 작동 구조부터 ..

프로그래밍 & IT/Linux 2017. 3. 13. 01:19

소니 하이파이 이어폰 XBA-N3AP 가성비 대만족

솔직히 저는 음향기기에 대한 전문적 지식이 거의 없습니다. 하지만 제 삶에 있어서 이어폰은 매우 중요한 아이템 중 하나입니다. 회사에서건 집에서건 일을 할 때에는 거의 항상 이어폰을 귀에 꼽꼬 살기 때문이죠. 학생 시절부터 음악을 들으면서 공부하던 습관이 있어서 그런지 뭘 하든 이어폰을 꼽고 음악을 들으면 집중이 잘 되는 느낌입니다.하루 최소 5시간 이상을 사용하기 때문에 쇼핑 고.자인 제가 유일하게 꼼꼼히 따져보며 구매해 사용하는 아이템이 바로 이어폰 입니다. 얼마 전, 기존에 사용하던 이어폰인 JVC HA-FX650 WOOD 가 고장났습니다. 20만원 이상 주고 구매했던 제품이라 무료 AS를 기대하고 JVC AS에 대해 알아봤습니다. JVC는 구매 후 2년간 고장난 이어폰에 대해 같은 제품을 절반의 ..

IT제품 리뷰 2017. 3. 12. 15:59

대만 스펀 낭만기차, 천등 그리고 닭날개볶음밥 - 대만 3박4일 자유여행

친구와 함께 떠난 대만 3박 4일 자유여행의 둘째날 일정은 예스진지 택시투어였습니다.택시를 하루 빌려 예류, 스펀, 진과스, 지우펀을 여행하는 일정이죠. 사실 여행은 자주 다니지만 순도 100% 자유여행만을 고집했던지라 "투어" 자체가 조금 고민이었습니다.솔직히 말씀드리자면 예스진지중 스펀을 제외하고는 차라리 타이페이 시내에 있는게 더 좋았을뻔 했어요. 첫 대만 여행이었으니 그냥 한번 가본 사실 자체에 만족해야죠. 대만은 꼭 한번 다시 가보고 싶은 나라인데, 혹시 다시 간다면 스펀만 별도로 기차를 사용해 가볼 생각이에요.예스진지중 가장 좋았던 스펀, 그림같은 기찻길과 기원을 담은 천등날리기, 그리고 내 입맛에 정말 잘 맞았던 닭날개볶음밥에 대한 기억을 글로 적어보려 합니다. 닭날개볶음밥은 사랑입니다. 기..

여행/대만 2017. 3. 12. 02:18

그래프 넓이우선탐색(BFS, Breadth First Search) 알고리즘(java 코드 포함)

알고리즘 문제에서 동적계획법과 함께 단골로 출시되는 것이 그래프 문제이다.그래프 형태의 자료구조로 표현할 수 있는 문제를 해결하기 위한 알고리즘은 여러 가지가 있다.그 중 가장 기본적이면서도 대표적인 알고리즘 기법이 넓이우선탐색(Breadth First Search)과 깊이우선탐색(Depth First Search)이다. 이 중에서 먼저 넓이우선탐색(BFS, Breadth First Search)에 대해 그림으로 알아보고 예제 문제를 자바(java) 코드로 구현해 보자. 위와 같은 형태의 그래프가 있다. 이제 1번부터 시작해서 넓이우선탐색을 통해 모든 정점들을 하나씩 다 방문해 보려고 한다. 넓이 우선 탐색은 처음 시작 정점을 방문한 뒤, 정점에서 인접한 모든 정점들을 우선 방문한다. 방문하지 않은 정점..

프로그래밍 & IT/Algorithm 2017. 3. 10. 23:43

ASCII Keycode 목록과 Javascript event.keyCode 예제

자바스크립트로 클라이언트단 페이지 개발을 하다보면 많은 경우에 Key Code를 알아야 할 경우가 생긴다.해당 웹 페이지에서 작동하는 단축키를 만든다던지, 특정 키를 막는다던지 하는 기능을 개발할 때 필요하다.또한 가장 많이 사용되는 경우로는 검색 영역에서 엔터키를 치면 검색 버튼을 수행하는 기능도 input 영역에서 키 입력시마다 keyCode를 체크해서 엔터키가 들어오면 검색을 수행하게 된다. 이처럼 많은 경우에 keycode가 쓰이지만 키 하나 하나에 대한 코드를 외우고 있을 수 없기에 필요할 때마다 검색을 해서 찾아 쓰곤 한다. (가장 많이 쓰이는 앤터키 정도는 알아두면 검색하는 수고를 덜 수 있다.) ASCII Key Code 테이블 영문알파벳/숫자, 숫자패드, 기타키로 구분했다. 원하는 키를 ..

프로그래밍 & IT/Spring & HTML 2017. 3. 10. 17:07

첫째주 티스토리 블로그 애드센스 수익인증 - 방문자수

애드센스 승인 받은지 한 주가 지났습니다. 이번주는 회사 일이 바빠서 정말 빠르게 지나간 듯 싶은데도 이상하게 애드센스 승인 받은것이 1주일 전이라고 하니 마치 먼 옛날 일 같습니다. 애드센스가 중독성 있고 자꾸 앱과 블로그를 들여다보게 만드는 것이 가장 큰 문제 같습니다. 어찌되었건 최종 승인을 받아 당당하게 블로그에 광고를 달고, 작지만 수익이 발생하니 기분이 좋네요.이런 것은 상상도 못하고 그냥 일하면서 공부한 코딩 관련 내용을 혼자 정리하기 위해 시작한 블로그인데 말이죠. 티스토리 블로그에 애드센스 광고를 달고 첫 한주 동안의 방문자수와 애드센스 수익을 공개하겠습니다. 수익 공개는 괜찮지만 페이지뷰나 CTR등의 상세한 내역에 대한 공개는 약관 위반이라 순수 수익만 보이게끔 편집하였습니다. 2017..

블로그 & 애드센스 2017. 3. 10. 01:45

삼성 32인치 커브드 모니터 LC32F391FWKXKR 리뷰

기존에 27인치 삼성 평면 모니터와 구형 17인치 모니터로 듀얼 모니터를 사용했습니다. 회사에서는 심지어 모니터 3대를 사용하고 있어요. 그래서인지 이제 코딩할때는 물론이고 심지어 웹서핑을 할 때에도 모니터가 한대밖에 없으면 답답한 느낌이 들더군요. 개발자에게 모니터 한 대를 추가해 줄 때마다 개발 생산성이 0.5배씩 증가한다는 우스갯소리도 있습니다. 실제로 코딩할때는 서브 모니터는 선택이 아니라 필수인 정도지요. 그러던 중 집의 서브모니터인 17인치 모니터가 드디어 맛이 갔습니다. 거의 10년 가까이 쓰던건데 드디어 수명을 다했네요. 메인 모니터가 27인치라 그냥 살아볼까 싶었지만 도저히 못참겠어서 질러버렸습니다. 처음에는 서브용으로 작은것 하나 사려고 했다가 어찌어찌 32인치, 그것도 커브드 모니터를..

IT제품 리뷰 2017. 3. 10. 00:37

datatables Cannot read property 'length' of undefined 에러 해결

얼마 전 새로운 부서로 오면서 이 곳에서 사용중이던 시스템의 UI개선 프로젝트를 담당하게 되었다.기존 소스를 뜯어 보던 중 데이터 그리드를 그리는 부분에서 수많은 하드 코딩이 난무하는 것을 발견하였고, 그리드 디자인 자체도 마음에 들지 않았다.이 시스템의 그리드를 datatables로 뜯어 고치려고 일을 벌려놨는데, 막상 손을 대다 보니 생각보다 쉬운 일은 아니었다. 무엇보다 어떤 에러가 발생했을 때, 분명 예전에도 봤던 것이고 해결한 경험이 있었는데 또 같은 부분에서 시간을 낭비하고 있는 것이 가장 힘들었다. 개발을 하다 에러가 발생하고 해결한 과정을 블로그로 정리하면 다음에 또 이런 일이 있을 때 도움이 될듯 싶다. 이번에 쓸데없이 한시간 넘게 낭비한 부분이 datatables에서 그리드를 그릴 때 ..

프로그래밍 & IT/Spring & HTML 2017. 3. 9. 19:36

Java IDE 이클립스에 이클립스 플러그인 설치하기

우리가 어떤 언어로 개발을 하던 사실은 메모장과 같은 간단한 텍스트 편집기만으로도 코딩을 할 수 있습니다. 메모장이나 콘솔창에서 모든 개발을 하게 되면 어떤 일이 발생할까요? 우리는 수많은 API와 라이브러리 함수들을 전부 달달 외우고 있어야 할 것입니다. 그 뿐 아니라 혹시 변수명 하나 바꾸려면 모든 소스를 직접 다 뒤져서 하나하나 다 바꿔 주어야 할테죠. 이런 간단한 것들 말고도 우리는 간단한 프로그램 하나 짜기 위해서 코딩 하는 노력보다 부수적인 것들에 훨씬 더 많은 시간을 들여야 할 것입니다.그래서 대부분의 개발자는 최대한 "코딩" 만 할 수 있도록 적극적으로 도와주는 도구로서 만들어진 GUI기반의 IDE(Integrated Development Environment)를 사용합니다. C언어-비주얼..

프로그래밍 & IT/Java 기본 2017. 3. 8. 13:51

[콘텐츠 크리에이터] 티스토리 블로그로 수익내기(구글 애드센스, 텐핑 등)

요즘 초등학생들에게 장래 희망을 물어봤을 때 "콘텐츠 크리에이터"가 가장 인기라고 합니다.사실 저도 블로그를 시작하기 전인 불과 2~3개월 전까지만 해도 대충 짐작만 했지 정확히 뭘 의미하는지 몰랐을 것입니다. 제 직업이 IT의 최전선에 있는 프로그래머 인데도 말이죠. 콘텐츠 크리에이터(Content Creator)? 콘텐츠 크리에이터는 본인이 기획하고 제작한 컨텐츠를 1인 미디어인 유튜브, 아프리카 등을 활용해 제공하는 것을 직업으로 하는 사람들을 말합니다. 거기에 더해서 블로그나 페이스북 페이지 등을 통해 본인이 생산한 컨텐츠를 제공하는 사람들까지 포함하여 사용됩니다.예전에는 방송에 나가려면 영화나 TV밖에 길이 없었고, 방송국이나 기획사를 통하는 방법 뿐이었습니다. 자신이 만들어 낸 글이나 사진 역..

블로그 & 애드센스 2017. 3. 8. 01:48

HTML5 탄생 배경과 HTML5의 특징

불과 몇 년 전까지만 해도 '코딩' 이라는 것은 프로그래밍을 직업으로 하는 전문 개발자들의 영역이었다. 개발자가 아닌 일반적인 대중들에게 있어서 코딩은 마치 중문학과 학생에게 있어서의 상대성이론과 같이 "나와는 전혀 상관 없는 것" 으로 느껴졌을 것이다. (중문학과를 무시하는 것이 아니다. 그만큼 친숙하지 못하다는 뜻이다.) 하지만 요즘 "코딩" 이라는 것은 몇 년 전보다는 확실히 우리 옆에 조금 가깝게 다가왔다.정부에서 프로그래밍 교육 의무화를 추진한다거나 하는 것에 대한 의미가 아니다. 실생활에서 소소한 코드를 수정할 필요성이 증가한 것이다.특히 티스토리나 워드프레스 등을 통해 블로그를 운영하는 분들은 본인도 모르게 코드를 다룬적 있으며, 분명 한번쯤은 '나도 코딩을 할 수 있었다면..' 하는 생각을..

프로그래밍 & IT/Spring & HTML 2017. 3. 7. 19:02

티스토리 공감버튼 제거하기(숨기기)

티스토리에 쓴 글을 발행할 때, 주제를 선택하게 되면 해당 포스팅이 티스토리 주제별 항목에 노출되면서 본문 하단에 공감버튼이 생기게 된다. 티스토리에서는 많은 공감을 받은 글을 주제별 항목에서 기본적으로 상위에 노출시켜 주고, 별도의 베스트공감 항목에 모아서 보여주기도 한다. 이렇게 공감버튼은 작성한 글을 많은 사람이 볼 수 있도록 도와주는 장점이 있다. 하지만 공감 버튼을 제거해야 할 필요성을 느끼게 될 상황이 있는데, 아래와 같은 경우가 있을 것이다.1. 공감버튼이 블로그 스킨과 어울리지 않아 디자인적으로 거슬린다.2. 광고가 들어갈 위치와 겹치게 되어 문제의 소지가 될 수 있는 여지가 있다.3. 공간버튼이 들어가는 공간을 다른 것에 활용하고 싶다. 이러한 경우에 공감 버튼을 제거하는 방법은 다양하다..

블로그 & 애드센스 2017. 3. 7. 14:32

티스토리 공감버튼 달기 - SNS 공감 기능의 장점

SNS가 지금의 위치 만큼 성장하고 확산될 수 있게 된 요인은 손에 꼽을 수 없을 정도로 많을 것이다.그 중 기능적인 측면으로만 보자면 가장 큰 역할을 한 기능 중 하나가 바로 페이스북이나 인스타그램의 "좋아요" 버튼과 같은 "공감" 버튼일 것이다.내 지인이, 내가 동경하는 누군가, 혹은 전혀 모르는 사람까지 누군가의 삶과 생각에 "공감"을 표시한다는 것은 익명의 벽에 막혀있는 온라인 커뮤니케이션의 벽을 낮추는 것에 큰 역할을 하게 되었다.이러한 SNS 공감 기능은 단순히 내 공감을 표현하는 것에서 그치지 않고 내가 관심있는 것을 보다 많은 사람들이 함께 볼 수 있게끔 해 주는 역할까지 하게 된다. 즉, 많은 사람의 공감을 받은 글은 보다 많은 사람들에게 노출되고 그 사람들이 또 공감을 표시하는 기하급수..

블로그 & 애드센스 2017. 3. 7. 13:22

친퀘테레 리오마조레 맛집 IL GROTTINO 에서의 친퀘테레 와인

나는 일종의 나를 위한 선물이자 에너지 충전을 위해 1년에 두 번 이상은 꼭 여행을 떠난다. 정말 여행을 많이 다니는 분들에 비해서 많다고는 할 수 없지만 그렇게 몇 년이 지나다 보니 꽤나 많은 곳이 되어버렸다. 그 많은 곳에서 많은 것을 보고 느꼈지만, 그 중에서 언젠가는 꼭 몇 번이고 더 가보고 싶은 곳을 꼽자면 바로 친퀘테레 이다.적다고 할 수 없는 시간이 흘렀고, 이제는 기억도 점점 흐려져 사진을 보아야 그 때의 감정이 떠오르는 이탈리아 여행이다. 그 중에서도 두고 두고 답답할 때 마다 꺼내 보는 것이 친퀘테레에서의 사진이다. "Cinque terre", 이탈리아어로 다섯 개의 땅이다. 다섯 개의 해안 마을이 절벽을 따라 이어져 있다.각각의 마을은 하이킹을 해서 이동하거나 기차로 이동하게 되는데,..

여행/유럽 2017. 3. 7. 01:01