책첵 : 작업일지

최근 자바스크립트의 기초를 (몇년만에 다시) 공부했다.
생활코딩에서 언어로서의 자바스크립트 수업웹브라우저에서의 자바스크립트 수업을 봤다.

공부를 마친 뒤엔 복습과 실습을 겸해, 내가 원하는 프로그램을 만들어 보기로 했다.

평소 관심이 가는 책이 생기면 더 많은 정보를 얻기 위해 이런저런 사이트를 열고 검색을 하곤 하는데, 이를 좀더 편하게 할 수 있으면 좋겠다고 늘 생각해 왔기에 그걸 도와주는 프로그램을 만들기로 했다.

기본적인 부분은 유저스토리북 북마클릿를 참고해서 만들었다.
토요일 오후부터 화요일 오후까지 다른 일들 포함해서, 3일정도 걸렸다.


02.20.토

1. 방법을 구상했다. 사이트별 검색결과 url을 새창으로 띄우기로 했다.
각 사이트에서 검색어로 검색했을 때 랜딩 페이지의 url 형태와 파라미터 형태를 확인했다.

2. 위 방법 이전에는 아래의 방법을 구상했다 : 실패
한권의 책을 확정하여 여러 사이트에서 해당 도서의 상세페이지로 랜딩하는 방법을 원했었다.
이를 위해서 유사한 기능을 가진 유저스토리북의 광장 페이지를 살펴 보았고, 그 결과 아래 두 가지가 필요하다는 것을 알았다.

* 도서 확정
: 검색어를 기반으로 나온 여러 도서결과 중 한 도서를 확정하는 것. 초기 구상시 간과했던 스텝이었다.

* 확정한 한 도서의 정보를 가지고 각 사이트의 도서 상세 페이지를 연결하는 것
: 여기엔 오픈된 API가 필요할 가능성이 높다는 생각이 들었다.

* 그런데 이 두 가지는 현재 나에게는 너무 어렵거나 불가능하고,
위 1과 같은 대체재가 있다는 것을 알았으므로,
2 부분은 일단 접기로 했다.



02.21.일

1. 프롬프트 창 띄우기 : 실패
간단히 윈도우 프롬프트 창을 띄운뒤 프롬프트 창 내 입력창에 입력된 밸류를 알아내려 했다.
그런데 찾아보니 그건 어려운 것 같았다.

2. 커스텀 창 띄우기
div태그로 작은 상자를 하나 띄운뒤 그 안에 input태그로 만든 검색어 입력창을 담았다.

3. 검색어 기반으로 사이트 띄우기
input 검색창에 입력된 텍스트를 받아오고, 이를 url에 파라미터로 포함하여 새창을 띄우게 했다.
검색 대상은 리디, 유저스토리북.

4. 북마클릿용 코드와 기능 코드 분리 : 실패
원격 업데이트가 가능하도록 하기 위해 코드를 분리했다.
기능 코드를 별도의 파일로 분리해서 내 서버에 두고, 북마클릿의 코드는 이 src를 로드만 하도록 작성했다.
이렇게 하면 사용자는 계속 동일한 북마클릿을 사용해도 내 서버쪽 기능 코드를 업데이트함으로서 프로그램을 자동 업데이트할 수 있다.

그런데 이렇게 하고 나니, 어떤 사이트에는 작동을 하는데 어떤 사이트에서는 작동을 하지 않았다.
알고보니, 북마클릿에서 src를 쓰는 것을 막는 사이트가 많다는 것을 알았다. (트위터, 페이스북 등등)

업데이트가 가능한 것보다는 어디서나 실행가능한 것이 좀더 중요하므로,
아쉽지만 북마클릿에 직접 기능코드를 넣는 방식으로 원복했다.



02.22.월

1. 닫기 버튼을 추가

2. 검색 대상에 알라딘을 추가(파라미터 인코딩)
알라딘의 검색결과 url용 쿼리 파라미터는 한글이 바로 들어가면 작동이 안 되고, 인코딩을 해야 하는 것 같았다.
인코딩의 개념이나 원리는 모르기 때문에 무작정 이것저것 테스트하면서 했다.
마침 토요일 2번 항목을 진행하면서 알게된 인코딩/디코딩 사이트의 단어 인코딩 결과가 알라딘에서서 검색url에 사용하는 파라미터 형식과 일치하기에, 소스코드에서 그 함수를 복사해 왔다(활용 자유라고 써 있었다).
이런게 모듈화구나 라는 생각을 했다.

3. 검색 사이트 옵션
검색할 사이트를 고를 수 있게끔 체크박스를 만들었다.
성공하고 집의 이쪽 끝에서 저쪽 끝으로 어깨춤을 추며 왕복했다.

4. 정식 이름을 지음 : 책첵.js
책을 체크해주니까 책첵!



02.23.화

---------------
사용성개선

1. 키보드입력 지원
enter키로 검색이 실행되게, esc키로 창이 닫히게 했다.

2. 오토포커스
실행시 검색창이 오토포커스 상태로 바로 입력이 가능하게 했다.

3. 선택 텍스트 인식
현재 도큐먼트에서 드래그한 텍스트가 있다면 이것이 검색창에 자동으로 들어가있게 했다.

4. GUI 개선
요소들의 배치 순서를 다듬었다. 스타일도 조금 줬다.


---------------
공유관련작업

1. 인포 버튼 추가
습작 프로그램이지만, 그래도 커뮤니케이션을 위한 링크가 하나는 있었으면 해서 만들었다.

2. 인포 내용 작성
1의 링크를 깃헙으로 하고, 깃헙의 리드미 파일을 썼다.

3. 설치방법작성
2에는 설치용 a태그 작성이 안 되었기 때문에, 설치안내는 슈가루이넷으로 링크하기로 했다.
이를 위해 슈가루이넷의 WORK항목에 프로그램 카테고리를 추가하고 게시글을 작성했다.


---------------
작업 일지 작성
슈가루이넷에 이 작업 일지를 정리했다. 설치방법 작성글을 쓰면서 겸사 겸사.


토스트

작업일시  2008-03-31
카테고리  toon

우리 둘 사이에는

작업일시  2008-03-30
카테고리  toon