Skip to content

課題: Web電卓の作成

timtakamura edited this page Jun 25, 2013 · 2 revisions

2013年度新入社員向け研修課題

課題の意図

  • プログラミングに関してどれぐらいの知識や経験を持っているかの確認。

課題1 「Eclipseで学ぶはじめてのJava」

「Eclipseで学ぶはじめてのJava」を読んで、問題を解いてください。 一週間を目安に読み切ってください。

課題2 Web電卓の作成

GitHub アカウントの作成~はじめてのpush

通常の開発作業ではソースコードの管理を行いますので、これに慣れていただきます。 「スッキリわかるJava」の13章でバージョン管理システムとイシュー管理システムが解説されていますが、 GitHubはこれを統合したサービスです。

Gitというバージョン管理システムを用います。 一人で開発する場合にも非常に便利なものですので、 今後はどんなソースコードでもバージョン管理下に置くことを心掛けてください。

やること:

2.1.1. GitHubにアカウントを作る

→ アカウント名を報告してください

2.1.2. Gitのセットアップをする

GitHubにアカウントを作ったら、案内ページ(GitHub Bootcampと書かれた窓)が出てきます。 (最初の添付ファイル) この一番左の Set Up Git をクリックすると、Gitのインストール方法が書かれたページ( https://help.github.com/articles/set-up-git )に遷移できますので、これを読んで(というか読まずに)GitHub for Windowsをインストールしてください。

2.1.3. リポジトリを作る

Gitのセットアップが終わったら、リポジトリを作ります。

  1. https://github.com/ にアクセスし、[New Repository] というボタンをクリックします。
  2. Repository Nameに theFirstJava と入力
  3. Add .gitignore: のところで Java を選択
  4. Create Repository をクリック

2.1.4. theFirstJava に「はじめてのJava」で書いたプログラムをpush

  1. theFirstJavaのページを開いて、Clone in Windows をクリック(cloneする、と言います。スッキリわかるJavaの13章で言うところのローカルコピーを作成することです)
  2. GitHub for Windows が起動するので、ウインドウ上真ん中あたりのtools から open in explorer をクリック
  3. エクスプローラでワーキングコピー(ローカルコピーのことをgitではワーキングコピーと言います)が開くので、「はじめてのJava」を読みながら書いたプログラム一式(Eclipseのプロジェクトを含む)をコピーする
  4. git for windows に戻り、uncommited changes と書いてあるところをクリックし、「はじめてのJava」で書いたファイルが一覧されていることを確認する
  5. コミットメッセージを記入してコミット
  6. ウインドウ上真ん中あたりのsyncをクリックしてgithubにsync(pushすると言います)
  7. githubのtheFirstJavaを開いて、自分が書いたプログラムがgithubに転送されていることを確認する

2.2. 逆ポーランド記法電卓

コマンドプロンプトから使える逆ポーランド記法の電卓を作成します。

http://ja.wikipedia.org/wiki/%E9%80%86%E3%83%9D%E3%83%BC%E3%83%A9%E3%83%B3%E3%83%89%E8%A8%98%E6%B3%95

2.2.1. リポジトリの作成

github で新しくリポジトリを作成し、cloneします。.gitignoreはjavaを選択します。

2.2.2. Eclipseのプロジェクトを作成する

プログラムとしては何もしない空の状態ですが、忘れずにコミットしておきます。

2.2.3. プログラム

次のような仕様のプログラムを作成します

  1. プログラムが起動すると入力待ちになる
  2. 逆ポーランド記法の数式を受け取り、計算結果を出力する。入力が数式として解釈できない場合や計算できない式の場合エラーの旨を出力する。
  3. 入力が数式ではなくexitだった場合、あるいは入力が終了した場合、プログラムを終了する

2.3. Web電卓

2.3.1. Play framework のインストール

Webアプリを一から独力で作るのは大変なので既存のライブラリを使います。 今回はJavaなのでPlay frameworkを使うことにします。 インストール手順は http://www.playframework.org/documentation/2.1-RC2/Installing の通りなのですが、 これを読んでやると実行環境が人によって違ってしまいそうなので 以下の手順でインストールしてください:

(0) Git Shellの設定。

(0.1) GitHub for Windowsを開く。

(0.2) [tools] > [options...] を開く。

(0.3) [default shell] を「Git Bash」に変更する(初期状態では「PowerShell」のはず)。

(0.4) [UPDATE] ボタンを押下する。

(1) Git Shellを起動する(スタートメニューから探して開いてください)。

(2) Git Shellのプロンプト内で順次以下のコマンドを実行してください(「#」で始まる行はコメントなので読み飛ばしてください):

# Play framework 2.0.4 のパッケージをダウンロード。
curl -O http://download.playframework.org/releases/play-2.0.4.zip

# パッケージを展開。
unzip play-2.0.4.zip

# パッケージのインストールおよび初期設定。
mkdir -p $HOME/lib
mv play-2.0.4 $HOME/lib
cd $HOME/lib/play-2.0.4
curl -O https://gist.github.com/raw/2939832/823c7cb3d0ba6c188a6dad14af9c4a39c7bf371b/play_cygwin.patch
sed -ie '/^\\ No newline at end of file$/d' play_cygwin.patch
patch -p1 <play_cygwin.patch
echo 'PATH="$PATH:$HOME/lib/play-2.0.4"' >>~/.bash_login

(3) 一度Git Shellを終了し、再度起動し直してください。

(4) Git Shellのプロンプト内で「play help」を実行してください。以下のようなメッセージが画面に表示されていればOKです。

$ play help
	   _            _
 _ __ | | __ _ _  _| |
| '_ \| |/ _' | || |_|
|  __/|_|\____|\__ (_)
|_|            |__/

play! 2.0.4, http://www.playframework.org

Welcome to Play 2.0!

These commands are available:
-----------------------------
license            Display licensing informations.
new [directory]    Create a new Play application in the specified directory.

You can also browse the complete documentation at http://www.playframework.org.

2.3.2. Play framework でのアプリ作成

以下のチュートリアルを読んで実際にアプリを作ってください: http://www.playframework.com/documentation/2.0.4/JavaTodoList

ただ「チュートリアル通りにアプリを作りました」だけではさっぱりなので、

  • プロジェクトを作成した直後。
  • 「Development work-flow」「Prepare the Task model」「The application template」「The task form」……等の各節での変更を終えた後。

の各段階で適宜コミットして GitHub に push しておいてください。 チュートリアルを全て終えてから push するのではなく、 チュートリアルの各節が終わる度に push してください。

なお、最後の「Deploying to Heroku」という節は読み飛ばして構いません。 (余力があるならやってもらっても結構です。)

2.3.3. Web電卓の作成

チュートリアルを通して Play framework を利用してのアプリ作成はできるようになったはずなので、以下の仕様のアプリを作成してください。なお、計算機能に関しては2.2のコマンドライン版の電卓で作り込んだはずなので、それを再利用する形でWeb電卓を作成してください。

(a) 1行のテキスト入力欄(以下「フォーム」)とボタン(以下「計算ボタン」)が1個づつある画面を作ってください。

(b) フォームに逆ポーランド記法の数式を入力して計算ボタンを押下すると、それを計算して結果が画面に表示されるようにしてください。表示位置はフォームより下側とします。計算ボタンの押下後はフォームの内容は空にします。

(c) 何らかの理由で計算ができなかった場合はメッセージをフォームの真下に表示してください。この場合はフォームの入力内容は計算ボタン押下前のものを維持してください。

(d) 計算ボタンの押下後に表示される画面では、これまでに入力した式とその計算結果が順次表示されるようにしてください。新しいものほど上に表示されるようにしてください。表示範囲は直近10回分とします。11回以上計算を行った場合はもっとも古いものから順次画面からは消えていきます。

(e) 計算ボタンを押下せずに画面を開きなおした場合はこれまでの計算結果は全てクリアしてください。

以上。