소개

Caveman2를 사용하여 간단한 TODO 목록을 만들 수 있습니다.

사양은 다음과 같습니다.

추가 버튼을 눌러 텍스트 상자에 입력된 문자열을 데이터베이스에 추가하여 브라우저에 나열합니다.

나열된 태스크 아래에 삭제 버튼을 놓고 그것을 눌러 데이터베이스에서 태스크를 삭제하고 결과를 브라우저에 반영합니다.

태스크 입력용 텍스트 박스 1개 배치

작업 추가 버튼 하나

작업 삭제 버튼을 작업 수만큼 배치

프로젝트 템플릿 생성

REPL을 시작하고 다음 명령으로 프로젝트 템플릿을 만듭니다.

(ql:quickload :caveman2)
(caveman2:make-project #P"プロジェクトを作成するディレクトリのパス" :author "自分の名前")
(ql:register-local-projects) ; モジュールをlocal-projectsに登録

Caveman2 스켈레톤 프로젝트의 디렉토리 / 파일 구성

이번 괴롭히는 파일은 이하의 ★마크가 붙어 있는 파일입니다.

cl-caveman2-todo
  ├── README.markdown
  ├── app.lisp
  ├── db
  │    ├── todolist.db  ★ テーブル作成後に生成されるファイル
  │    └── schema.sql
  ├── cl-caveman2-todo-test.asd
  ├── cl-caveman2-todo.asd
  ├── src
  │    ├── config.lisp  ★ SQLite3の設定関連
  │    ├── db.lisp
  │    ├── main.lisp
  │    ├── view.lisp
  │    └── web.lisp     ★ ルーティング/SQL実行/結果反映など
  ├── static
  │   └── css
  │        └── main.css
  ├── templates
  │   ├── _errors
  │   │     └── 404.html
  │   ├── index.html    ★ テンプレートエンジン
  │   └── layouts
  │         └── default.html
  └── tests
        └── myapp.lisp

데이터베이스

데이터베이스에 대해서는, 이하의 기사에 기재한 것을 그대로 사용했습니다.

CommonLisp에서 Caveman2와 SQLite3을 사용하여 데이터베이스 작업을 시도했습니다.

템플릿

템플릿 엔진은 Djula입니다.
이것은 Python 장고 템플릿 엔진을 Common Lisp에 이식한 것 같습니다.

templates 디렉토리 아래에 index.html이라는 파일이 있으므로 다음과 같이 수정합니다.

templates/index.html

{% extends "layouts/default.html" %}
{% block title %}Welcome to Caveman2{% endblock %}
{% block content %}
<div id="main">
  <form action="/task-add" method="POST">
    <input type="text" name="name" value="{{ tasks.name }}">
    <input type="submit" value="追加">
  </form>
  <ul>
    {% for task in tasks %}
    <li>
      {{ task.name }}
      <form action="/task-delete"  method="POST">
        <input type="hidden" name="id" value="{{ task.id }}">
        <input type="submit" value="削除">
      </form>
    </li>
    {% endfor %}
  </ul>
</div>
{% endblock %}

라우팅

추가 버튼을 눌렀을 때의 처리입니다.

src/web.lisp

(defroute ("/task-add" :method :POST) (&key |name|)
  (render-todo-list (insert-task |name|)))

삭제 버튼을 눌렀을 때의 처리입니다.

src/web.lisp

(defroute ("/task-delete" :method :POST) (&key |id|)
  (render-todo-list (delete-task |id|)))

SQL 실행 결과를 브라우저에 반영

Djula를 사용하여 데이터베이스에서 값을 검색하고 브라우저에 반영하려면 다음과 같이 작성하십시오.

(defun render-todo-list (tasks)
  (render #P"index.html" `(:tasks ,(get-tasks tasks))))

(defun get-tasks (tasks)
  (with-connection (db)
    (retrieve-all
     (select :* (from :tasks)))))

실행

다음 명령으로 시작합니다.

(ql:quickload :cl-caveman2-todo)
(cl-caveman2-todo.web::create-table) ; SQLite3でテーブル生成
(cl-caveman2-todo:start)

시작할 수 있으면 브라우저를 열고 http://localhost:5000/ 로 이동합니다.
이하 실행중인 모습



다음 명령으로 중지하고 종료합니다.

(cl-caveman2-todo:stop)

마지막으로

Caveman2에서 간단한 TODO 목록 앱을 만들어 보았습니다.
좀 더 정교한 것을 만들려고 생각하면 더 공부하지 않으면 안되는 것 같네요・・・.

이번 소스 코드 세트는 Github에도 올리고 있기 때문에 좋으면 부디.
fireflower0/cl-caveman2-todo