Archive for 2月, 2012

Hello, Flash World!

Posted on 2月 29th, 2012 by cx20

Flash

Flash は Adobe Systems のブラウザ用プラグインである。名前の由来は FutureWave Software のアニメーションソフト「FutureSplash」から。
MXML（Macromedia Flex Markup Language）は、Adobe Flex の UI を記述する為の XML 言語である。
また、ActionScript は、JavaScript に類似した Flash 用のプログラミング言語である。
ともに、MXML コンパイラを用いることにより、.swf ファイルが生成される。

ソースコード（MXML）

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
  <mx:Text text="Hello, Flash World"/>
</mx:Application>

コンパイル方法（MXML）

$ mxmlc ./Hello.mxml

上記の MXML による UI 記述は以下の ActionScript のコードに相当する。

ソースコード（ActionScript）

package 
{
  import flash.display.*;
  import flash.text.*;
 
  public class Hello extends Sprite
  {
    public function Hello()
    {
      var textField:TextField = new TextField();
      textField.text = "Hello, Flash World!";
      this.addChild(textField);
    }	
  }
}

コンパイル方法（ActionScript）

$ mxmlc ./Hello.as

ソースコード（HTML）

<html>
  <head>
    <title>Hello, World!</title>
  </head>
  <body>
    <embed src="Hello.swf" type="application/x-shockwave-flash" width="400" heigt="300" />
  </body>
</html>

実行方法

1. Web サーバの公開フォルダ に配置
2. ブラウザで表示
   http://localhost/doc/hello.html

実行結果

Hello, Flash World!

Hello, Java Applet World!

Posted on 2月 28th, 2012 by cx20

Java Applet

Java Applet は Java プログラムの実行形態の１つである。ブラウザ上で動作する。「〜let」は小さいという意味。

ソースコード（Java）

HelloApplet.java

import javax.swing.*;
 
public class HelloApplet extends JApplet {
    public void init() {
        JLabel label = new JLabel("Hello, Java Applet World!");
        getContentPane().add(label);
    }
}

ソースコード（HTML）

<html>
  <head>
    <title>Hello, World!</title>
  </head>
  <body>
    <applet code="HelloApplet.class" height="100" width="200"></applet>
  </body>
</html>

実行方法（AppletViewer による表示）

$ appletviewer ./hello.html

実行方法（ブラウザによる表示）

1. Web サーバの公開フォルダ に配置
2. ブラウザで表示
   http://localhost/doc/hello.html

実行結果

Hello, Java Applet World!

Hello, CoffeeScript World!

Posted on 2月 27th, 2012 by cx20

CoffeeScript

CoffeeScript は Ruby や Python ライクな構文のスクリプト言語である。JavaScript にコンパイルすることが可能となっている。
プログラムは CoffeeScript の公式サイト（http://jashkenas.github.com/coffee-script/）で試すことができる。

ソースコード（CoffeeScript）
hello.coffee
raw download
hello = -> console.log("Hello, CoffeeScript World!") hello()
hello = -> console.log("Hello, CoffeeScript World!") hello()
上記コードを JavaScript にコンパイルした場合、以下のコードが生成される。

ソースコード（JavaScript）
hello.js
raw download
(function() { var hello; hello = function() { return console.log("Hello, CoffeeScript World!"); }; hello(); }).call(this);
(function() { var hello; hello = function() { return console.log("Hello, CoffeeScript World!"); }; hello(); }).call(this);
実行方法（スクリプトとして実行）
$ coffee ./hello.coffee
$ coffee ./hello.coffee
実行方法（JavaScript にコンパイルして実行）
$ coffee -c ./hello.coffee $ node ./hello.js
$ coffee -c ./hello.coffee $ node ./hello.js
実行結果
Hello, CoffeeScript World!
Hello, CoffeeScript World!

Hello, Node.js World!

Posted on 2月 26th, 2012 by cx20

Node.js

Node.js は Google の高速 JavaScript エンジン V8 をベースとしたアプリケーションサーバーである。

ソースコード

var http = require("http");
 
http.createServer(function (req, res){
    res.writeHead(200, { "Content-Type": "text/html" });
    res.write("<html>¥n");
    res.write("<body>¥n");
    res.write("Hello, Node.js World!¥n");
    res.write("</body>¥n");
    res.write("</html>¥n");
    res.end();
}).listen(8080);

実行方法

1. モジュールの配置
2. サーバーの起動
   $ node hello.js
3. ブラウザで表示
   http://localhost:8080/hello.js

実行結果

Hello, Node.js World!

Hello, eRuby World!

Posted on 2月 25th, 2012 by cx20

eRuby

eRuby は任意のテキストに Ruby スクリプトを埋め込むことのできる書式の仕様である。名前の由来は「embedded Ruby」から。
eRuby の類似技術としては、PHP、ASP、JSP 等がある。
eRuby のライブラリとしては、C言語で実装された eruby や Ruby で実装された ERB、Erubis などがある。
ERB は Ruby による Web アプリケーションフレームワーク「Ruby On Rails」のデフォルトのテンプレートエンジンとしても採用されている。

ソースコード
hello.rhtml
raw download
<html> <head> <title>Hello, World!</title> </head> <body> <p><%= "Hello, eRuby World!" %></p> </body> </html>
<html> <head> <title>Hello, World!</title> </head> <body> <p><%= "Hello, eRuby World!" %></p> </body> </html>
実行方法
1. Web 公開フォルダに配置 2. ブラウザで表示 http://localhost/doc/hello.rhtml
1. Web 公開フォルダに配置 2. ブラウザで表示 http://localhost/doc/hello.rhtml
実行結果
Hello, eRuby World!
Hello, eRuby World!

Hello, Django World!

Posted on 2月 24th, 2012 by cx20

Django

Django は Python で実装された Web アプリケーションフレームワークである。名前の由来は作者の好きなミュージシャンから。
元々はアメリカのある新聞社の社内ツールとして開発された。現在はオープンソースで、Google App Engine でも採用されている。
Django には独自のテンプレートエンジン、O/R マッパー、正規表現を用いた URLディスパッチャーなどの機能が含まれる。
ここでは主要な機能のテンプレートエンジンを使用したサンプルを記載する。

ソースコード（テンプレート）

Content-Type: text/html
 
<html>
  <head>
     <title>Hello, World!</title>
  </head>
  <body>
    <p>Hello, {{message}} World!</p>
  </body>
</html>

ソースコード（CGIコード）

#!/usr/bin/env python
from django.conf import settings
from django.template import Context
from django.template.loader import get_template
settings.configure(TEMPLATE_DIRS=('/Applications/MAMP/cgi-bin/python',))
tmpl = get_template('template.html')
print tmpl.render(Context({'message' : 'Django' }))

実行方法

1. CGI用フォルダ（cgi-bin等）に配置
2. 実行権限の付与
   $ chmod +x hello.py
3. ブラウザで表示
   http://localhost/cgi-bin/hello.py

実行結果

Hello, Django World!

Hello, Cheetah World!

Posted on 2月 23rd, 2012 by cx20

Cheetah

Cheetah は Python 用の汎用テンプレートエンジンである。名前の由来は動物のチータから。

ソースコード（テンプレート）
hello.tpl
raw download
<html> <head> <title>Hello, World!</title> </head> <body> <p>Hello, $message World!</p> </body> </html>
<html> <head> <title>Hello, World!</title> </head> <body> <p>Hello, $message World!</p> </body> </html>
ソースコード（CGIコード）
hello.py
raw download
#!/usr/bin/env python from Cheetah.Template import Template tpl = Template(file='hello.tpl') tpl.message = 'Cheetah' print "Content-Type: text/htmlnn" print tpl
#!/usr/bin/env python from Cheetah.Template import Template tpl = Template(file='hello.tpl') tpl.message = 'Cheetah' print "Content-Type: text/htmlnn" print tpl
実行方法
1. CGI用フォルダ（cgi-bin等）に配置 2. 実行権限の付与 $ chmod +x hello.py 3. ブラウザで表示 http://localhost/cgi-bin/hello.py
1. CGI用フォルダ（cgi-bin等）に配置 2. 実行権限の付与 $ chmod +x hello.py 3. ブラウザで表示 http://localhost/cgi-bin/hello.py
実行結果
Hello, Cheetah World!
Hello, Cheetah World!

Hello, Template Toolkit World!

Posted on 2月 22nd, 2012 by cx20

Template Toolkit

Template Toolkit は Perl 用のテンプレートエンジンの一つである。TT または TT2 と呼ばれている。

ソースコード（テンプレート）

<html>
  <head>
     <title>Hello, World!</title>
  </head>
  <body>
    <p>Hello, [% message %] World!</p>
  </body>
</html>

ソースコード（CGIコード）

#!/usr/bin/perl
use Template;
 
my $template = Template->new();
my $message = 'Template';
my $result;
my $vars = { 'message' => $message };
$template->process('template.tt', $vars, $result);
print "Content-Type: text/htmlnn";
print $result;

実行方法

1. CGI用フォルダ（cgi-bin等）に配置
2. 実行権限の付与
   $ chmod +x hello.pl
3. ブラウザで表示
   http://localhost/cgi-bin/hello.pl

実行結果

Hello, Template Toolkit World!

Hello, HTML::Template World!

Posted on 2月 21st, 2012 by cx20

HTML::Template

HTML::Template は Perl 用の HTML テンプレートモジュールである。

ソースコード（テンプレート）

<html>
  <head>
     <title>Hello, World!</title>
  </head>
  <body>
    <p>Hello, <TMPL_VAR NAME=MESSAGE> World!</p>
  </body>
</html>

ソースコード（CGIコード）

#!/usr/bin/perl 
use HTML::Template;
my $template = HTML::Template->new(filename => 'hello.tmpl');
$template->param(MESSAGE => "HTML::Template");
print "Content-Type: text/htmlnn";
print $template->output;

実行方法

1. CGI用フォルダ（cgi-bin等）に配置
2. 実行権限の付与
   $ chmod +x hello.pl
3. ブラウザで表示
   http://localhost/cgi-bin/hello.pl

実行結果

Hello, HTML::Template World!

Hello, Smarty World!

Posted on 2月 20th, 2012 by cx20

Smarty

Smarty は PHP 用のテンプレートエンジンである。名前の由来は「スマート（smart）」から。
ページにアクセスするとテンプレートはコンパイルされ PHP スクリプトに展開される。

ソースコード（テンプレート）

<html>
  <head>
     <title>Hello, World!</title>
  </head>
  <body>
    <p>Hello, {$message} World!</p>
  </body>
</html>

ソースコード（PHP）

<?php
require_once 'libs/Smarty.class.php';
$smarty = new Smarty();
$smarty->template_dir = 'templates/';
$smarty->compile_dir  = 'templates_c/';
$smarty->assign('message', 'Smarty');
$smarty->display('template.html');
?>

上記の PHP コードならびにテンプレートは実行時に以下の PHP スクリプトに展開される。

コンパイル結果（PHP）

xxxx.file.template.html.php

<?php /* Smarty version Smarty-3.1.7, created on 2012-01-31 00:10:09
         compiled from "templates/template.html" */ ?>
<?php /*%%SmartyHeaderCode:10960230224f26b28ceec5c3-38524326%%*/if(!defined('SMARTY_DIR')) exit('no direct access allowed');
$_valid = $_smarty_tpl->decodeProperties(array (
  'file_dependency' => 
  array (
    '41d3b4a4b71afe0c223778e57c23244caee1baec' => 
    array (
      0 => 'templates/template.html',
      1 => 1327936205,
      2 => 'file',
    ),
  ),
  'nocache_hash' => '10960230224f26b28ceec5c3-38524326',
  'function' => 
  array (
  ),
  'version' => 'Smarty-3.1.7',
  'unifunc' => 'content_4f26b28d05af0',
  'variables' => 
  array (
    'message' => 0,
  ),
  'has_nocache_code' => false,
),false); /*/%%SmartyHeaderCode%%*/?>
<?php if ($_valid && !is_callable('content_4f26b28d05af0')) {function content_4f26b28d05af0($_smarty_tpl) {?><html>
  <head>
     <title>Hello, World!</title>
  </head>
  <body>
    <p>Hello, <?php echo $_smarty_tpl->tpl_vars['message']->value;?> World!</p>
  </body>
</html>
<?php }} ?>

実行方法

ディレクトリ構成
/doc               … 公開用フォルダ
    /libs          … ライブラリ配置場所
    /templates     … テンプレート配置場所
    /templates_c   … テンプレートコンパイル結果配置場所
 
1. ライブラリ（Smarty.class.php）を libs に配置
2. テンプレート（template.html）を templates に配置
3. ソース（hello.php）を公開フォルダに配置
4. ブラウザで表示
   http://localhost/doc/hello.php

実行結果

Hello, Smarty World!

« Older Entries

サイト内の検索

一覧

Hello, World 一覧

カテゴリー

最近の投稿

アーカイブ

メタ情報