자.. 오랜 잠수 끝에 만든 책검색 서비스다.
사실 개발 기간은 4일.. ㅎㄷㄷ
디자인도 신경 하나도 안쓰고 그냥 쇼핑몰 기능을 조금 넣어봤던걸까나..
프로그래밍이라는 것도 하나도 모르고
회사에서 조금씩 배우면서 만든거라 굉장히 허접스럽다는.. 어허허

간단히 원리를 말하자면 이렇다.
검색어를 담아내는 하나의 기억장소가 필요하고
그 검색어와 API를 이용하기 위한 Key 값을 조합해서 쿼리를 네이버 책검색 서비스로 던져준다.
그러면 네이버 쪽에서 다시 값을 날려주는데
그 값의 형태는 XML 형태.
XML을 다시 이 쪽에서 VO(Value Object)로 변환시켜서
배열에 집어넣는다.
Flex 2.0 부터는 ArrayCollection이라는게 만들어져서 꽤 간단하게 짤 수 있었다.
이 ArrayCollection 은 mx.collections.ArrayCollection 클래스 소속인데
이게 좋은건 데이터가 바뀔 때 마다 dataProvide해 줄 필요가 없다는 것이다.
VO데이터를 Array에 넣게 되면 Object 형태로 들어가는데 Object 내부의 일부분이 수정되거나 변경되어도
기존의 Array는 그런 사실을 provide되는 Object에게 알려주지 않는데 이 ArrayCollection은
뭐가 어떻게 바뀌었는지 알려준다. 이전에 했더 CRUD 맛보기 프로그램을 짤 때도 잘 이용했다.
사실 처리할 데이터가 몇건 안될 때는 그냥 Array를 통째로 dataProvide 해버리면 되는데
만약 몇 만건이상의 데이터 베이스를 처리할 경우가 생기면
그 처리시간이 만만치 않게 걸린다는 것이다. 그런 점에서 ArrayCollection은 유용한 도구가 될 수 있다.
ArrayCollection 이야기를 하다보니 본론에서 조금(?) 벗어나 버렸다.

뭐 아무튼
이렇게 처리한 VO데이터를 DataGrid와 TileList를 ViewStack을 이용하여 검색된 결과를 보여준다.
보여준 데이터는 ItemRenderer를 이용해서 이미지와 HTML 텍스트들을 처리했다.
보고 있는 아이템중 상세정보를 보고 싶은 아이템을 클릭하게 되면
일련의 처리과정 후에 아랫쪽에 보여지게 된다.
기존의 검색된 데이터에서 누락된 데이터들을 볼 수 있게 되고 이 때 좀 더 상세한 내용을 보고 싶은 아이템은
상세정보를 볼 수 있는 아이콘이 있어서 바로 네이버로 가서 확인할 수 있게끔 링크를 걸어두었고
장바구니 버튼을 클릭하면 오른쪽에 있는 장바구니 화면에 들어가게 된다.
장바구니 버튼을 여러번 누르면 아이템이 계속 장바구니에 담겨지는게 아니라 NumbericStepper의 숫자가 올라가게 된다.
그러다 구매하기 싫은 아이템은 체크박스에 체크를 하고 삭제버튼을 누르면 삭제가 된다.
편의를 위해 전체선택도 가능하게 했다.
이렇게 이야기만 하면 크게 감흥이 안올 것 같고(사실 직접봐도 큰 감흥은 없다..-_-;;)
한 번 보시라.

클릭하세염~

Flex를 통해 3일만에 만든게 게시판이었다.
물론 데이터베이스를 이용한 것은 아니였지만 기본적인 CRUD를 구현하기 위해서
이틀동안 머리를 쥐어짜야했다.(그것이 가능했던건 물론 회사였기 때문이 아니었을까..-_-;;)
어쟀든 며칠동안 작업하고 Open Api라는 것에 대한 이해가 전혀 없었던 나로써는
조금은 벅찬(?)걸 만들었다. 물론 완성은 아니지만..

Flex 네이버 Open Api를 통해 만든 책검색 서비스!!

일단 현재는 책을 검색해서 상위 6권의 보여주는 정도다.
이제 더 작업해야하는건

1. 선택된 책들에 대한 상세정보를 보여줘야한다.
2. 책을 6권이 아닌 검색된 전체 내역을 보여줘야한다. - 페이징 기능
(네이버 open Api 서비스의 한계때문에 1000건이상 결과가 나오더라도
 1000번째 이상 상세정보를 받아올 수 없다.)
3. 상세정보를 보고 구입을 원하게 되면 실제 구매 페이지로 링크를 걸어줘야 한다.

지금 디자인은 OSX를 모티브로 했다.
http://www.scalenine.com 에서 받아왔고 사용하지 않는 기능은 삭제시켰다.
완성되면 만드는 과정을 찬찬히 살펴보도록 하자.