はじめに
本稿はAlinous-Coreを動かしながら習得するためのサンプル集です。このサンプルを追っていくことによって、ほとんどのことはできるようになると思います。また、1つ1つの例が小さいので、各機能ごとに見ていくことができます。
これらのサンプルはすべて動かすことができますので、実際にデバッガーのステップ実行で動きを追いながら学習できます。記事を読んだあとには、ぜひ、ダウンロードして実際に動かしてみてください。
まずは基本から
HTMLの表示
Alinous-Coreは、スクリプトが存在しない状態では、普通の静的なHTML表示をする形になります。以下のHTMLファイルを作成し、ブラウザから「http://localhost:8080/sample01.html」にアクセスしてください。
sample01.html
<html> <head> <title>SAMPLE01</title> </head> <body> <h1>タイトル</h1> <p> このページはHTMLのみのページです。<br> "sample01.alns"が無くともちゃんと表示されます。 お好きな内容を書いて確かめてみてください。<br> </p> </body> </html>
CSSの読み込み例
拡張子がAlinous-Coreで予約されているhtmlやalns以外のファイルに関しては、通常通りHTTPでファイルをダウンロードすることができます。下の例では、CSSファイルをlinkタグで指定して読み込んでいます。
sample02.html
<html> <head> <title>SAMPLE02</title> <link rel="stylesheet" href="test.css" type="text/css" /> </head> <body class="layout-two-column-right main-index"> <h1 id="banner-header">タイトル</h1> このページはHTMLのみのページですが、<br> cssファイルを追加しました。<br> (test.css)<br> お好きな内容を書いて確かめてみてください。<br> <br> あまりイケてないですが、"test.css"の内容を確認してみてください。 </body> </html>
htmlにロジックを加える
次に、ロジックであるAlinousScriptを加えます。ロジックを加えるには拡張子がalnsのファイルを用意します。まずは、何もしないスクリプトを追加します。スクリプトでは、最後に必ず0をリターンするようにしてください。コメントはJavaやC++と同様、//で行う1行コメントと、/*と*/で囲まれた複数行コメントとの両方をサポートしています。
sample03.alns
// これはコメント行です /* これもコメントです */ return 0;
sample03.html
<html> <head> <title>SAMPLE03</title> </head> <body> <h1>タイトル</h1> このページはHTMLのみのページですが、<br> ロジックファイルが追加されています。<br> お好きな内容を書いて確かめてみてください。<br> <br> <br> "sample03.alns"の内容を確認してみてください。 </body> </html>
変数を使う
次に、変数を使います。変数は、AlinousScriptのなかで定義することができ、その定義した値をHTML内にマクロをつかって書き出すことができます。
sample04.alns
// なにか文字列を変数にしてHTMLに渡してみましょうか $moji1 = "文字列だよ"; $suji1 = 2; return 0;
sample04.html
<html> <head> <title>SAMPLE04</title> </head> <body> <h1>タイトル</h1> このページはHTMLのみのページですが、<br> ロジックファイルが追加されています。<br> お好きな内容を書いて確かめてみてください。<br> <br> "sample04.alns"の内容を確認してみてください。<br> <br> この下にsample04.alnsの$moji1で設定した値が表示されているはずです。 <br> {$moji1}<br> この下にsample04.alnsの$suji1で設定した値が表示されているはずです。 <br> {$suji1}<br> 実は、文字列型と数値型を区別しているんですよ！<br> </body> </html>
