Hong Chen

void setup() { size(200, 100); textFont(createFont("x", 15)); // 日本語を表示用。バージョンアップで不要？ // frameRate(10); // 1秒間に10回 draw()実行 } void draw() { int h = hour(); int m = minute(); int s = second();


  String time = "時刻："+nf(h, 2)+":"+nf(m, 2)+":"+nf(s, 2);

  // println(time);

textSize(14); // 文字サイズ background(200); // 背景を指定色で塗りつぶす fill(0, 0, 255); // 文字色 RGB text(time, 10, height/2); }

WEBで簡単にPROCESSING！

タイトルは「WEBで簡単にPROCESSING！」ですが、

「WordPressでで簡単にPROCESSING！」になります。

WordPressに（マルチサイトは動かないらしい！）プラグイン “Processing.js for WordPress” をインストールしてください。

それから、記事に、textモードでProcessingのコード書いてください。

<script type="application/processing" data-processing-target="processingcanvas">
//Info: http://processingjs.org/reference
void setup() {
  size(200, 200);
  frameRate(10);
}
void draw() {
  background(#ffffff);
  ellipse(100, 100, random(50), random(50));
}
</script>
<canvas id="processingcanvas"></canvas>

C# exercises (f) Summary

C# 演習前期のまとめ

C#プログラムは「入れ子構造」をしている

ボタンクリックでメッセージボックスに表示完成したコード

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;

namespace test1
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        // ボタンクリックでメッセージボックスに表示
        private void button1_Click(object sender, EventArgs e)
        {
            MessageBox.Show("Hello world");
        }
    }
}

＊注意：( ” “) ; は全角（漢字）にしてはいけません。全角（漢字）の文章を入れた場合、かならず半角に戻して入力しましょう。

●using

usingキーワードは，プログラムの処理の流れには直接関係ありません。その代わり，プログラム全体にわたってどのライブラリを利用するかを明確にする役割があります。

前回触れたように，C#では基盤にある「 .NET Framework」のライブラリを利用してアプリケーションを作ります。.NET Frameworkでは，ライブラリの各機能を処理内容ごとにツリー状のグループに分類して管理します。ちょうど，パソコンでファイルを管理するときに目的別のフォルダを用意して分類・整理しておくのと似た状態を想像すればいいでしょう。フォルダに相当するグループを .NET Frameworkのライブラリでは「名前空間」と呼びます。

●名前空間（namespace）

usingの次に出てくるnamespaceは，それに続くブロックが所属する名前空間を指定するキーワードです。usingのところで，標準ライブラリがSystem以下の名前空間に属していることを説明しましたが，自分で作るプログラムも必ずどこかの名前空間に所属させます。

●class

classは，C#プログラムを構成する最小単位である「クラス」を定義するキーワードです。必ずnamespaceのブロック内に書かれます。C#プログラムの大部分はこのようなクラス定義の集まりです。

●メソッド（method）

メソッドはクラス内で実行される具体的な処理を一つにまとめて名前を付けたものです。メソッドはクラス定義ブロックの中にいくつでも作れます。メソッドの中でほかのメソッドを呼び出したり，ほかのクラスを利用するといったことも可能です。ただ，Mainという名前のメソッドには特別な役割があります。プログラムを起動したときには自動的にMainメソッドが実行されるのです。

●//（コメント）

この構文だけはほかとは異質で，実はC#プログラムに不可欠な要素ではありません。//と書かれた個所から改行までの部分はプログラムの処理の流れからは一切無視されます。つまり，この//以降を削除してしまってもプログラムは全く同じように動作します。

この一見ムダな行は，プログラム内に動作などをメモしておくプログラマ向けの注釈文です。プログラム内での処理という点では全くムダですが，実際のプログラミングでは読みやすい注釈を記述することがプログラミングの重要なテクニックです。例えば，思った通りにプログラムが動かずにミスを探す場合などは，わかりやすいコメントがついているかどうかでミス発見までの作業の効率が大きく変わってきます。あるいは他人の作ったプログラムや過去に自分が作ったプログラムを見る場合，処理だけが書かれているのと，適切なコメントがあるのとでは理解のしやすさが大きく違います。

期末レポート：

A4　2枚以上、eメールで提出する。

提出先：h.chen@ueno.daiichi-koudai.ac.jp
タイトル：C#期末レポート　（学籍番号）
提出する期限：2016/7/29

C#プログラミング関連名詞の意味を説明する
1. イベントドリブン
2. ツールボックス
3. コントロール
4. イベント
5. メソッド
6. プロパティ
Webプログラミング関連名詞の意味を説明する
1. API
2. REST
3. JSON
4. Open Data
学内Proxyを通して、Webデータ取得する方法を説明する
1. 画面デザイン
2. プログラム
オープンデータを利用したWebアプリの作成
1. オープンデータの好みのどれかを選択
  1. – 郵便番号検索
  2. – 天気予報検索
  3. – その他　「LinkData.org」から探す
2. オープンデータをブラウザで確認
  1. ブラウザ画面
3. C#を使って、オープンデータWebアプリの作成
  1. 画面デザイン
  2. プログラム

参考：

http://linkdata.org/
C# で JSON 形式のデータを取得　（郵便番号の住所を JSON 形式で取得）
郵便番号検索API
C#で天気予報のWeb API(Weather Hacks)を使ってみる～コンソールアプリケーション

C# exercises (e) Open Data

オープンデータを利用したWebアプリ作成

オープンデータとは

オープンデータ（Open Data）とは、特定のデータが、一切の著作権、特許などの制御メカニズムの制限なしで、全ての人が望むように利用・再掲載できるような形で入手できるべきであるというアイデアである。

オープンデータの利用

「LinkData.org」には、誰でも無償で利用でき、商用利用も可能なオープンデータが豊富にまとまっています。
都道府県別で探したり、人気ランキングやキーワードを指定しての検索もできるので、自分が興味のあるデータを探すのも簡単でしょう。

LinkDataのサイト内には、全国の「お城データ」や「道の駅データ」、「避難所データ」、「補助金まとめデータ」、「さくら名所データ」…など、意外とユニークで面白いデータがまとまっているので、うまく利用すれば楽しいWebアプリが作れそうです。

「ダウンロード」の項目下に、「その他の形式のAPIリストを表示」というリンクがあるのでクリックします。

すると、外部APIとしてデータが取得できるURLが一覧表示されます。

そこで「JSON」形式のURLをコピーして、実際にブラウザのアドレスバーに入力してみましょう！

あとは、このデータをC#を使って、自分のWebアプリに組み込めば良い。

グループ課題

オープンデータを利用したWebアプリの作成

オープンデータの選択
1. 郵便番号検索
2. 天気予報検索
3. その他
オープンデータをブラウザで確認
C#を使って、オープンデータWebアプリの作成

C# exercises (d) REST & JSON

Visual Studio community 2015 アカウントについて　(学内専用)

WebBrowser　（基本）
Form（自動操作）
HttpClient
REST & JSON ←今週

RESTとは

RESTとは、RESTはREpresentational State Transferの略。2000年にRoy Fielding氏が提唱した、分散システムにおいて複数のソフトウェアを連携させるのに適した設計原則の集合。また、狭義には、それをWebに適用したソフトウェアの設計様式のこと。一般には後者の意味で用いられることがほとんどである。RESTの世界では、ネットワーク上のコンテンツ(リソース)を一意なURLで表すのが基本。各リソース（URL）に対してGET,POST,PUT,DELETEでリクエストを送信しレスポンスをXMLやjsonなどで受け取る形式（レスポンスのフォーマット形式は指定されていない）。

REST APIをを作る前に先人はどのような設計をしていたのかを見てみましょう。今ではTwitterやfacebook,Github、Amazonなど大きいところではだいたいAPIを提供しているので、お手本は山ほどあります。URL設計やリクエスト・レスポンス、HTTPヘッダなどに着目して見比べてみましょう。

Twitter REST API: レスポンスの情報量が多いので、どういった情報を返すべきか参考になります。
Github API: 一番綺麗にまとまっているAPIだと思います。リクエスト・レスポンスがRESTらしく、とても綺麗。

JSONとは

JSONとは、JavaScriptにおけるオブジェクトの表記法を応用したデータ形式。 JSONで表記されたデータは、JavaScript上ではコードとして実行するだけで読み込みが完了する。JSONでは、データ全体を配列またはJavaScriptにおけるオブジェクト（キーと値のペアを列挙した構造体）として記述する。

JSONというのは「データを表現するための記法（≒文法）」です。シンプルなデータであれば、文法など気にせずにただ書けば問題ありません。少々複雑でも、我々は「表」という記法をしっているため、ある程度の複雑さには対応できます。しかし、表で表すのが困難な程度の複雑な構造を持つデータを表現しなければならないことは多々あります。このように、表形式では表現が困難な構造のデータを、人間に対するある程度の可読性を残しつつ、コンピュータに対しても伝達できるような記法、その1つがJSONです。そしてJSON形式で記述したデータのことを、JSON-textといいます。

chenlabのメンバーをJSON-textで表現

{
“name” : “chenlab”,
“member3” : [ “14TE485”, “14TE406”, “14TE410”, “14TE449” , “14TE461″”, “14TE465″”, “14TE470”],
“member4” : [ “13TE466”, “13TE477”, “13TE486”, “13TE520” , “12TE412″”, “13TE457″”, “13TE405”],
“count” : 4
}

C#でJSON

Newtonsoft.Jsonのインストール

C#でJSON扱うときは、いくつ方法があり、ここはNewtonsoft.Jsonののライブラリを使う。

NuGetパッケージ管理を開く

Newtonsoft.Jsonを選択して、インストールしてください。

JSONデータサンプル

http://wp-api.xyz/wp-json/posts

先週のプログラムでサンプルデータを取得するように変更してください。

ダウンロード：web_get2 (2)

JSONをクラスとして貼り付け

JSONのデータ構造をC#のクラス定義に変換する。

取得したサンプルデータをコピーして、メニューの「JSONをクラスとして貼り付け」で、プログラムのnamespaceの最後部に貼り付けください。

JSONプログラミング

16 行に下記の分を入れえてください

using Newtonsoft.Json;
using Newtonsoft.Json.Serialization;
using Newtonsoft.Json.Linq;

デザイン画面に、「button1」ボタンと、「listBox1」リストボックスを追加してください。

デザインのbutton1をダブルクリックし、DeserializeObject処理を入れてください。

private void button1_Click(object sender, EventArgs e)
{
    var json = HTTP_Results.Text;
    var posts = JsonConvert.DeserializeObject<Class1[]>(json);
    foreach(Class1 post in posts)
    {
        listBox1.Items.Add(post.ID);
    }
    // string saveJson = JsonConvert.SerializeObject(posts, Formatting.Indented);

}

実行画面

これて、Jsonデータ（ブログの投稿）の取得、Deserialize、そして（ブログID）表示ができた。

最終プログラム構造

Namespace web_get2
- Class Form1 : Form
  - Form1
  - Quit_Click
  - Request_Click
  - button1_Click
- Class Rootobject　（JSON データ構造）
- Class Meta　（JSON データ構造）
- Class Links　（JSON データ構造）
- Class Terms　（JSON データ構造）
- 。。。

最終プログラム

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;
// for httpclient
using System.Net.Http;
using System.Net;
using System.IO;
using System.Runtime.Serialization;
// using System.Runtime.Serialization.Json;
using Newtonsoft.Json;
using Newtonsoft.Json.Serialization;
using Newtonsoft.Json.Linq;

namespace web_get2
{


    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        private void Quit_Click(object sender, EventArgs e)
        {
            Application.Exit();
        }

        private async void Request_Click(object sender, EventArgs e)
        {
            if (ProxyOn.Checked)
            {
                // デフォルト プロキシ情報を取得して、資格情報を設定する 
                var proxy = WebRequest.DefaultWebProxy;
                proxy.Credentials = new NetworkCredential(ProxyID.Text, ProxyPW.Text);
            }
            var client = new HttpClient();
            string response = await client.GetStringAsync(URL.Text);
            HTTP_Results.Text = response;

        }

        private void button1_Click(object sender, EventArgs e)
        {
            var json = HTTP_Results.Text;
            var posts = JsonConvert.DeserializeObject<Class1[]>(json);
            foreach (Class1 post in posts)
            {
                listBox1.Items.Add(post.ID);
            }
            // string saveJson = JsonConvert.SerializeObject(posts, Formatting.Indented);
        }
    }


    public class Rootobject
    {
        public Class1[] Property1 { get; set; }
    }

    public class Class1
    {
        public int ID { get; set; }
        public string title { get; set; }
        public string status { get; set; }
        public string type { get; set; }
        public object author { get; set; }
        public string content { get; set; }
        public object parent { get; set; }
        public string link { get; set; }
        public DateTime date { get; set; }
        public DateTime modified { get; set; }
        public string format { get; set; }
        public string slug { get; set; }
        public string guid { get; set; }
        public string excerpt { get; set; }
        public int menu_order { get; set; }
        public string comment_status { get; set; }
        public string ping_status { get; set; }
        public bool sticky { get; set; }
        public string date_tz { get; set; }
        public DateTime date_gmt { get; set; }
        public string modified_tz { get; set; }
        public DateTime modified_gmt { get; set; }
        public Meta meta { get; set; }
        public object featured_image { get; set; }
        public Terms terms { get; set; }
    }

    public class Meta
    {
        public Links links { get; set; }
    }

    public class Links
    {
        public string self { get; set; }
        public string author { get; set; }
        public string collection { get; set; }
        public string replies { get; set; }
        public string versionhistory { get; set; }
    }

    public class Terms
    {
        public Category[] category { get; set; }
    }

    public class Category
    {
        public int ID { get; set; }
        public string name { get; set; }
        public string slug { get; set; }
        public string description { get; set; }
        public string taxonomy { get; set; }
        public object parent { get; set; }
        public int count { get; set; }
        public string link { get; set; }
        public Meta1 meta { get; set; }
    }

    public class Meta1
    {
        public Links1 links { get; set; }
    }

    public class Links1
    {
        public string collection { get; set; }
        public string self { get; set; }
    }
}

C# exercises (c) Web3 HttpClient

Visual Studio community 2015 アカウントについて　(学内専用)

WebBrowser　（基本）
Form（自動操作）
HttpClient ←今週
REST & JSON

いままで、WebBrowser　コントロールを利用して、　Webサイトを表示と操作プログラムを作りました。

今回は直接 http 通信に HttpClient クラスを使用するプログラムを作ります。

HTTPとは

httpとは、代表的な通信プロトコルの一つで、インターネット上でWebサーバー（サイトの公開側）と、クライアント（ブラウザ：サイトを閲覧する側）が、相互に通信するために使用される仕組みです。

もっと言うと、Webサーバーとクライアント間で、HTML（Webページを作成するための言語）で記載された情報をやりとりするための仕組みです。

この「http」がないと、インターネット上のサイトを見ることができなくなるので、今や無くてはならない仕組みとなります。

ＨＴＴＰコマンド

主なＨＴＴＰコマンドには次のようなものがあります。

GET	指定したページの取得を要求します。
HEAD	メッセージヘッダを要求します。
POST	フォームに入力したデータを送る
PUT	サーバーへデータをアップロードする
DELETE	サーバー上のデータを削除する

ＨＴＴＰコマンド応答メッセージ

主な応答メッセージには、次のようなものがあります。

200	OK　正常に取得できた
301	恒久的に移転した
302	一時的に移転した
403	Forbidden アクセス拒否
404	Not Found ファイルが見つからない

HttpClient 通信プログラム

デザイン

Form
- Form1
TextBox
- textBox1 —
  - Name : URL
  - Text : http://wp-api.xyz
- textBox2 —
  - Name : ProxyID
  - Text : (your_proxy_id)
- textBox3 —
  - Name : ProxyPW
  - PasswordChar : *
  - Text : (your_proxy_password)
- textBox4 —
  - Name : HTTP_Results
  - Multiline : True
Button
- button1 —
  - Name : Quit
- button2 —
  - Name : Request
CheckBox
- checkBox1 —
  - Name : ProxyOn

プログラム

HttpClient クラス

// for httpclient
using System.Net.Http;
using System.Net;
using System.IO;
using System.Runtime.Serialization;
// using System.Runtime.Serialization.Json;

Quit　ボタン

        private void Quit_Click(object sender, EventArgs e)
        {
            Application.Exit();
        }

Requestボタン

private async void Request_Click(object sender, EventArgs e)
{
    if (ProxyOn.Checked)
    {
        // デフォルト プロキシ情報を取得して、資格情報を設定する 
        var proxy = WebRequest.DefaultWebProxy;
        proxy.Credentials = new NetworkCredential(ProxyID.Text, ProxyPW.Text);
    }
    var client = new HttpClient();
    string response = await client.GetStringAsync(URL.Text);
    HTTP_Results.Text = response;

}

最終プログラム：

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;
// for httpclient
using System.Net.Http;
using System.Net;
using System.IO;
using System.Runtime.Serialization;
// using System.Runtime.Serialization.Json;


namespace web_get2
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        private void Quit_Click(object sender, EventArgs e)
        {
            Application.Exit();
        }

        private async void Request_Click(object sender, EventArgs e)
        {
            if (ProxyOn.Checked)
            {
                // デフォルト プロキシ情報を取得して、資格情報を設定する 
                var proxy = WebRequest.DefaultWebProxy;
                proxy.Credentials = new NetworkCredential(ProxyID.Text, ProxyPW.Text);
            }
            var client = new HttpClient();
            string response = await client.GetStringAsync(URL.Text);
            HTTP_Results.Text = response;

        }
    }
}

投稿者: Hong Chen

bus

sample

時計