似非プログラマのうんちく

「似非プログラマの覚え書き」出張版

jQuery と Sass で FizzBuzz を作ったよ

いろんな人がやってるから何番煎じかわからんけど

  • HTML はベタ打ちせずに jQuery を利用した DOM で生成する
  • Sass を利用してスタイル(文字色の変更)を適用する
  • 3 と 5 はリテラルとして使って良いが、 15 (= 3 * 5)*1リテラルとして直に使ってはいけない

という縛りをつけてやってみる。


FizzBuzz with jQuery and Sass

意外と手こずったけどこんな感じじゃねーの ?

追記 : GitHubリポジトリを作りました → akaneko3/FizzBuzz · GitHub

*1:正確には 3 と 5 の最小公倍数

JPA + EJB + JSF による Web アプリケーション(その 2)

前回の続きで下準備編。

PostgreSQL の下準備

PostgreSQL のインストールとデータベースの作成

ごっそりと割愛。他の人が解説してくれてるよ、きっと(丸投げ)。

データの投入

SQL をぶん投げる。長くなるので折りたたみ。

続きを読む

JPA + EJB + JSF による Web アプリケーション(その 1)

そろそろ本腰入れて Java EE 7 について書こうか。うん、そうしよう。

随分と長いこと WildFly には嫌われてきた*1が、ようやく動かせる状態になったので、簡単なサンプルを元に解説なんぞできればよろしいかと。

Java EE に含まれているいくつかの API のうち、今回は JPA, EJB, JSF を用いてとりあえず動くものを作りたいと思います。Windows 7 64bit で開発します。

で、JPA とか EJB とか JSF って何よ ? (説明になっていない説明)

JPA

Java Persistence API の略。永続化と O/R マッピングに関する Java の標準 API。今回は Model 部分の作成に使用する。

EJB

Enterprise JavaBeans の略。企業利用を意識しているらしい ? 詳しいことはよくわからんがとにかく便利。今回は Model のビジネスロジック(主に DAO)の部分の作成に使用する。

JSF

JavaServer Faces の略。Java 純正のコンポーネントフレームワーク。Facelets とかいうのと管理 Bean をムニャムニャする。View と Controller の作成に使用する。

用意したもの

Java SDK 8 update 25

まぁこれがなきゃ始まらないですよね。一応 Java 7 でも大丈夫だけど、せっかくだから新しいのを。

WildFly 8.2.0 Final

Red Hat が提供する Java EE サーバ。JBoss AS の後継。Java EE 7 の実装を含む。

Eclipse Luna + JBoss Tools 4.2.0 Final

統合開発環境WildFly による開発のためには JBoss Tools は必須。

PostgreSQL 9.3.5-3

データベース。まぁ好みのものを使えば良いと思う。

代用が利くものとしては WildFly の代わりに GlassFish にするとか、Eclipse の代わりに NetBeans 使うとか、PostgreSQL の代わりに MySQL 使うとか。Java SDK だけは代用品が無いので諦めてください(何)。

次回は下準備編。

*1:一番肝心な部分はソースのスペルミスだったことが判明し何とか使えるようにはなったものの依然として嫌われている模様。

独自のカウンタースタイルを定義する

まだ CSS3 の草案の段階ではあるが、独自のカウンタースタイルを定義することができる。そのサンプルがこちら。


全角数字カウンタスタイル

通常の decimal だと半角数字になるが、この em-decimal では全角数字になる。それに意味があるかと言われると微妙*1だけど。

なお草案段階と言うこともあって、現時点では Firefox の最新版でしか機能しないようだ。OperaGoogle Chrome などの WebKit 系のブラウザでは意図した表示にはならなかった(いずれも最新版にて確認済)。

参考 : CSS Counter Styles Level 3

*1:そもそもこのスタイル自体、某ヘルプファイルの見た目を変えずにできるだけスタイルシートで指定しようと試行錯誤した結果作ったもの。

Rust 始めました

Rust という 変態 プログラミング言語を始めてみますた。

とりあえずさくっと階乗でも書いてみるかー、で作ったもの。


Factorial with Rust

もうちょっとスマートに書きたい。

  • fold(1, |a, b| a * b) の第二引数は Haskell っぽく演算子をそのまま関数っぽくして書けないものか。
  • 関数の呼び出しを fact(*num) より *num.fact() みたいに書きたい。

MyBatis + Guice でカンタン DAO 実装(その 4)

View の作成

Velocity で作る。

list.vm

<!doctype html>
<html>
<head>
  <title>日本の政令指定都市一覧</title>
  <link rel="stylesheet" href="css/list.css" type="text/css">
</head>
<body>
  <table>
    <caption>日本の政令指定都市一覧</caption>
    <colgroup>
      <col id="no">
      <col id="pref">
      <col id="name">
      <col id="button">
    </colgroup>
    <thead>
      <tr>
        <th>No.</th>
        <th>都道府県</th>
        <th>都市名</th>
        <th></th>
      </tr>
    </thead>
    <tbody>
    #foreach ($city in $citylist)
      #set ($i = $foreach.index % 2)
      <tr class="tr$i">
        <td>$city.id</td>
        <td>$city.pref</td>
        <td>$city.name</td>
        <td class="button">
          <form action="detail" method="post">
            <div>
              <input type="hidden" name="id" value="$city.id">
              <input type="submit" value="詳細">
            </div>
          </form>
        </td>
      </tr>
    #end
    </tbody>
  </table>
</body>
</html>

detail.vm

<!doctype html>
<html>
<head>
  <title>${city.name}の詳細</title>
  <link rel="stylesheet" href="css/detail.css" type="text/css">
</head>
<body>
  <table>
    <caption>${city.name}のデータ</caption>
    <tr>
      <th>指定日</th>
      <td>$date.format('yyyy 年 M 月 d 日', $city.designatedDay)</td>
    </tr>
    <tr>
      <th>地方</th>
      <td>$city.dstName</td>
    </tr>
    <tr>
      <th>都道府県</th>
      <td>$city.pref</td>
    </tr>
    <tr>
      <th>面積</th>
      <td>$number.format('#,###.##', $city.area)km&sup2;</td>
    </tr>
    <tr>
      <th>人口</th>
      <td>$number.format('#,###,###', $city.population) 人</td>
    </tr>
  </table>
  <p><a href="list">一覧に戻る</a></p>
</body>
</html>

error.html*1

<!doctype html>
<html>
<head>
  <title>Error Page</title>
</head>
<body>
  <h1>エラー</h1>
  <p>このページに直接アクセスすることはできません。</p>
  <p><a href="list">一覧に戻る</a></p>
</body>
</html>

index.jsp*2

<!doctype html>
<html>
<head>
  <title>Index Page</title>
</head>
<body>
  <% response.sendRedirect("list"); %>
</body>
</html>

*1:これは本当にただの HTML。

*2:URL にセッション ID を付けないためのダミー。

続きを読む

MyBatis + Guice でカンタン DAO 実装(その 3)

Servlet の作成

DAO の使い方の例として。

package jp.mydns.akanekodou;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.annotation.WebServlet;

import java.util.List;

import jp.mydns.akanekodou.bean.City;
import jp.mydns.akanekodou.dao.CityDAO;
import jp.mydns.akanekodou.dao.util.DaoUtil;

@WebServlet("/list")
@SuppressWarnings("serial")
public class ListServlet extends HttpServlet {
    @Override
    protected void doGet(
        HttpServletRequest request,
        HttpServletResponse response
    ) throws ServletException, IOException {
        CityDAO dao = DaoUtil.getDao(CityDAO.class);

        List<City> citylist = dao.all();
        request.setAttribute("citylist", citylist);

        getServletContext()
            .getRequestDispatcher("/list.vm")
            .forward(request, response);
    }
}
package jp.mydns.akanekodou;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.annotation.WebServlet;

import jp.mydns.akanekodou.bean.City;
import jp.mydns.akanekodou.dao.CityDAO;
import jp.mydns.akanekodou.dao.util.DaoUtil;

@WebServlet("/detail")
@SuppressWarnings("serial")
public class DetailServlet extends HttpServlet {
    @Override
    protected void doGet(
        HttpServletRequest request,
        HttpServletResponse response
    ) throws ServletException, IOException {
        getServletContext()
            .getRequestDispatcher("/error.html")
            .forward(request, response);
    }

    @Override
    protected void doPost(
        HttpServletRequest request,
        HttpServletResponse response
    ) throws ServletException, IOException {
        CityDAO dao = DaoUtil.getDao(CityDAO.class);

        int id = Integer.parseInt(request.getParameter("id"));
        City city = dao.find(id);
        request.setAttribute("city", city);

        getServletContext()
            .getRequestDispatcher("/detail.vm")
            .forward(request, response);
    }
}