(単位名:コンピュータプログラミング)
授業中の臨時のソース配布は,掲示板を利用します。
| 私の授業は,授業開始前の2時間前(この授業は,午前6時50分)に,どんな「警報」でも出ていたら休講です。「警報」が出ていない場合は,学校の方針に従います。注意報は授業あり。これは私の授業のルールです。学校のルールではありません。 |
期末テスト 2月4日(木) 8:50から,生命(104) 機能(105)
テスト内容,小問数個に論述式(記述式はテーマが決まっている)。
小問の例:(2,3行程度で書くこと) 変数の役割を述べろ,関数およびメソッドの役割を述べろなど
論述式は,「道具と人間,コンピュータを例にして」という題でA4程度の用紙に書く。工学を学ぶ学生の視点をいれること。
斎藤末広(岐阜大学非常勤)
岐阜大学教育学部教育学科治療教育コース卒業後、ソフトハウス、株式会社テスクを経て、日本総合ビジネス専門学校にて教壇にたち,現在は,ウェブで教材を配付している。
情報処理技術者試験,TOEIC指導が専門
リテラシー(コンピュータを使って勉強する)
プログラミングの基礎を学ぶ
美佳タイプのローマ字単語で,手元を隠して,45 字/分かつミス9回までで合格。各授業最後に,テスト(学生証必要)可能,締切は,(休講になったらその前の)最後の授業。
コンピュータのハード・ソフト,プログラミングの用語の意味を問います。
岐阜大学総合情報処理センター実習室パソコン(Windowsパソコン)
美佳タイプ
『詳解HTML&CSS&JavaScript辞典 第4版』
http://www.shuwasystem.co.jp/products/7980html/2290.html
Winパソコン基本操作:チェックリスト
(日本総合ビジネス専門学校社会人向け短期パソコン習得講座用から)
『驚異のブラインド・タッチ』増田忠 著 参考サイト:増田式キーボード学習法
キーボード練習プログラム ミカタイプ:美佳のタイプトレーナ ダウンロード,英字用 テキスト1,テキスト2
この授業で、パソコン、インターネットを自分の道具にすること。そのためには、キーボードを見ずにたたけるようにすること、さらに、自分専用のパソコンを手に入れ、すぐにでも自分の道具して使用を開始することである。→ 自分用のパソコンを手に入れよう。
自分の学習パターンにインターネットを利用することを組み入れること。
席は教室に入った順番で座ること。実習室を出るときは,自分の席,近くの席の椅子をしまう事
美佳タイプ選手権@201014 ローマ字単語,字/分
| 順位 | 名前 | 速度 | 新人賞 |
| 1 | 水谷(生命) | 236 | |
| 2 | 塚本(機能) | 219 | |
| 3 | abc(機能) | 209 | |
| 4 | 辻村(生命) | 202 | |
| 5 | ダワマン X(生命) | 195 | |
| 6 | Meg(生命) | 191 | |
| 7 | そにぃ)機能) | 186 | |
| 8 | 秋丸(生命) | 184 | |
| 9 | 竹中(機能) | 168 | 新人賞 |
| 10 | 百瀬(機能 | 166 |
音を出せるようにする。
教室に入ったら,すぐにキーボード練習
myClock07.htm からタイマー機能を残し,最初の表示に,5 を出しておき,スタートボンタを押すと,5秒タイマーとなるようにしなさい。
myClock07.htm から現在時刻表示機能のみを残し,
○年○月○日 ○時○分○秒
という表示しなさい。"01月"でなくてもよい。
参考,10/22の授業
myClock07.htm からストップウォッチ機能を残し,表示を整数の秒数のみとしなさい。
いつものアンケートの他に,公式のアンケートもあります。
いつものアンケート
| アンケート項目
学科 生命,機能,その他(具体的に) 学生番号(下2桁) 氏名 A 半年間の授業でためになったこと B 授業に関する質問(後でこのページで答えておきます) C コンピュータプログラム授業の充実度(1-5) D 来年の1年生のコンピュータプログラムの授業への提案 E 前の席の人へのアンケート 1 前に人の名前(フルネーム)は? 2 今度の後期の試験で一番いい点をとりたい科目は?
|
本日の授業は,イヤフォンがないとできません。授業開始前に必ず用意してください。
音を出せるようにする。
wave(.wav) 形式:音のファイル形式。音の信号を電圧の数値として単純に数値化
mp3形式:音のファイル形式。wave形式を圧縮。国際規格。
教室に入ったら,すぐにキーボード練習//本日の授業開始は09:10
音の形式の説明
サンプル動作,課題作成
sound00.hta
<bgsound id="xring" src="" loop="10"> <bgsound id="xsound" src="" loop="5"> <form> <input type="button" onClick="javascript:xring.src='xb_001.mp3'" value="再生"> <input type="button" onClick="javascript:xring.src=''" value="停止"> </form> <script> xsound.src='xpiyo.wav' </script> |
音のダウンロード
音は
http://www.01earth.net/sound/index.html
を利用させてもらいました。
音の入れ替えをする。
sound01.hta を参考に,好きな音を使って,自分でサンプルプログラムを作成する。
myClock07 を作成する。タイマーが0となったときに,音を出す。
ポイント:音ファイルを myClcok07.htm と同一フォルダに置くこと。
| アンケート項目
学科 生命,機能,その他(具体的に) 学生番号(下2桁) 氏名 A 今日の授業でためになったこと B 授業に関する質問 C 授業の充実度(1-5) D アンケート 1 前に人の名前(フルネーム)は? 2 前の人の美佳タイプローマ字の速度 3 前の人は,この授業以前からタッチタイプができた?(出来ていた,出来ていなかった)
|
他人のプログラムを参考にして自分のプログラムを修正できるようにする。
キーボード練習
復習
美佳タイプの速度測定
作成例を参考に,自分の,myClock02, 03, 04, 05 をそれぞれ動作させる。
| アンケート項目
学科 生命,機能,その他(具体的に) 学生番号(下2桁) 氏名 A 今日の授業でためになったこと B 授業に関する質問 C 授業の充実度(1-5) D アンケート 1 前に人の名前(フルネーム)は? 2 美佳タイプローマ字の速度 3 この授業以前からタッチタイプができた?(出来ていた,出来ていなかった)
|
サンプルを見つける
キーボード練習
インターネット上から,ストップウォッチ,タイマーのJavaScript のプログラムを探す
ストップウォッチのサンプルを探し,それを単純化する。
タイマーのサンプルを探し,それを単純化する。
自分専用の時計プログラムを作成する。
| アンケート項目
学科 生命,機能,その他(具体的に) 学生番号(下2桁) 氏名 A 今日の授業でためになったこと B 授業に関する質問 C 授業の充実度(1-5) D アンケート 1 前に人の名前(フルネーム)は? 2 冬休みにしたいこと。3つ。
|
定期的な動作の仕方を学ぶ
キーボード練習
インターネット上から,時刻表示のJavaScript のプログラムを探す
サンプルを単純にする。
テキストエリアに,最新の時刻を表示し,それを,ボタンで,クリップボードにコピーするプログラムを作成する。
テキストエリアをもうひとつ増やし,そこに,起動開始した時刻を表示したままとする。
| アンケート項目
学科 生命,機能,その他(具体的に) 学生番号(下2桁) 氏名 A 今日の授業でためになったこと B 授業に関する質問 C 授業の充実度(1-5) D アンケート 1 前に人の名前(フルネーム)は? 2 その人の子供のころの楽しい思い出ベスト3
|
プログラムの日付の操作を学ぶ。
ダウンロード:ネットワークを通じて,パソコン側にファイルをコピーする。
キーボード練習
教科書 p484 のサンプルを動作させる。
教科書をサポートするウェブページからプログラムをダウンロードする
教科書のサンプルをもとに,2010年まで何日かのプログラムを作成する。
テキストエリアに,"2010年まで○○日" と表示し,それを,ボタンで,クリップボードにコピーするプログラムを作成する。
テキストエリアに,"2010年まで○○日" と表示し,それを,ボタンで,クリップボードにコピーするプログラムを作成する。
テキストエリアに,"2010年まで○○秒" と表示し,さらに,ボタンを押すと,押した時点の残りの秒数を計算しなしして,テキストエリアに再表示し,さらに,クリップボードにコピーするプログラムを作成する。
| アンケート項目
学科 生命,機能,その他(具体的に) 学生番号(下2桁) 氏名 A 今日の授業でためになったこと B 授業に関する質問 C 授業の充実度(1-5) D アンケート 1 前に人の名前(フルネーム)は? 2 その人の子供のころの楽しい思い出ベスト3
|
Webページの構造を理解する。
hta:html言語を利用した応用ソフト(アプルケーション)
html:ホームページを作るためのプログラム言語。 hyper text markup language
キーボード練習
webページの基本構造
html で土台を作成
openDic1203.hta
<html>
<head>
<title>
辞書検索
</title>
</head>
<body>
英辞浪,Google画像で調べる
<form name = "xf">
<textarea name = "xta" rows = 3 cols = 30>
</textarea>
<input type = "button" value = "検索" onClick = "xcp()">
</form>
<script language="JScript">
// 関数定義
function xcp(){
var xword = document.xf.xta.value
window.open("http://eow.alc.co.jp/" + xword,"w1");
window.open("http://images.google.com/images?q="+ xword,"w2");
}
window.resizeTo(400,150);
window.moveTo(100,100);
</script>
</body>
<html>
|
自分の辞書検索プログラムをコピーして,openDic1203-01.htaとし,サンプルのように基本構造を入力せひ。さらに,上の中で,辞書の名称が違っている,正しい名称に変更せよ。
以下のプログラムをどこかに組み込みなさい。
<object width="746" height="413"> <param name="movie" value="http://www.youtube.com/cp/vjVQa1PpcFNiPayh4xNe_YfbEXMs75rx0hnRyaPAAdU="> </param> <embed src="http://www.youtube.com/cp/vjVQa1PpcFNiPayh4xNe_YfbEXMs75rx0hnRyaPAAdU=" type="application/x-shockwave-flash" width="746" height="413"> </embed> </object> |
自分の openDic.htm の背景色をつけなさい。(p13)
課題2を修正して,大きさ,表示位置,背景など変更して,自分用のクリスマスソング再生プログラムにしなさい。
文字列の合体に慣れる。
キーボード練習
プログラム授業フォルダ,myProgフォルダ作成
ショートカットアイコンにショートカットーキーの設定
アンケート用紙を先に配布
openDic.hta
<form name = "xf">
<textarea name = "xta" rows = 3 cols = 30>
</textarea>
<input type = "button" value = "検索" onClick = "xsearch()">
<input type = "button" value = "G画像Clip" onClick = "xGClip()">
</form>
<script language="JScript">
// 関数定義
function xsearch(){
var xword = document.xf.xta.value;
window.open("http://eow.alc.co.jp/" + xword,"xw1");
window.open("http://images.google.com/images?q="+ xword,"xw2");
}
function xGClip(){
var xword = document.xf.xta.value;
clipboardData.setData('Text', "http://images.google.com/images?q="+ xword);
}
window.resizeTo(400,150);
window.moveTo(100,100);
</script>
|
自分の openDic.hta と比較すること
自分の opneDic.hta を コピーして,opneDic-1126.hta とし,上のサンプルのテクニックのうち,クリップボードへのコピーの部分を中心に真似る。
amazon で本のページを開く,openAmazo.hta を作成する。検索とクリップボードにコピーするボタンをつけること。なお,アマゾンのURLは,アマゾンの商品説明ページの,ASIN: B002QQ64GA,あるいは,ISBN-10: 4797820152 の赤字のところを変数(xasin)にすれば可能である。
"http://www.amazon.co.jp/exec/obidos/ASIN/" + xasin
である。

時間があまれば,今までの課題で出来ていないものを仕上げる。または,キーボード練習。
| アンケート項目
学科 生命,機能,その他(具体的に) 学生番号(下2桁) 氏名 A 今日の授業でためになったこと B 授業に関する質問 C 授業の充実度(1-5) D アンケート 1 前に人の名前(フルネーム)は? 2
その人のオススメ本ベスト3 |
好きなウェブページを好きな位置,好きな状態で開けるようにする。
バージョンアップ(改訂): ソフトウェアを改訂すること
属性(プロパティ): 変数の一種類。オブジェクトが持つ値。図形なら,色,高さ,幅などの値。
キーボード練習
opnewin.hta
<script language="JScript">
window.resizeTo(500,200);
window.moveTo(100,100);
window.open("http://www.yscon.co.jp/j/lecture/index.htm");
</script>
サンプル:ホームページを開く
|
Google画像とALCの辞書の両方を,同時に開くプログラムを作成。
ヒント:window.open を2つ書き,それぞれ,ウィンドウ名を,別々につけること。(教科書p340-342参照)
課題5をバージョンアップする。開いたGoogle画像とALC辞書のページのtoolbarの表示をしなくする。位置,サイズも,辞書を使った学習のときにやりやすいように設定する。
Yahoo(http://dic.yahoo.co.jp/)に英単語の発音を確認できる英和辞典がある。その英和辞典を開けるプログラムを作成する。
自分用の辞書検索プログラムを作成する。
| アンケート項目
学科 生命,機能,その他(具体的に) 学生番号(下2桁) 氏名 A 今日の授業でためになったこと B 授業に関する質問 C 授業の充実度(1-5) D アンケート 1 前に人の名前(フルネーム)は? 2
その人の得意になりたいor気合を入れている大学の授業科目と理由 |
好きなウェブページを開けるようにする。
URL:インターネット上の住所 Uniform Resource Locator
キーボード練習
opnewin.hta
<script language="JScript">
window.resizeTo(500,200);
window.moveTo(100,100);
window.open("http://www.yscon.co.jp/j/lecture/index.htm");
</script>
サンプル:ホームページを開く
|
cpy-b.hta を利用して,ボタンを押すと,テキストエリアに入力した ULR のページを開くプログラムを作成する。
Google画像を検索するプログラムを作成する。テキストエリアに入力された,文字列で,googleの画像検索をする。
ヒント:window.open("http://images.google.com/images?q=" + document.xf.xta.value)
ALCの辞書を検索するプログラムを作成する。
Goo, ロングマン英英辞書サイトの検索するプログラムを作成する。
| アンケート項目
学科 生命,機能,その他(具体的に) 学生番号(下2桁) 氏名 A 今日の授業でためになったこと B 授業に関する質問 C 授業の充実度(1-5) D アンケート 1 前に人の名前(フルネーム)は? 2
その人の得意になりたいor気合を入れている大学の授業科目と理由 |
テキストエリア,ボタンを利用できるようにする。
テキストエリア: ホームページの画面を構成する部品の一つで,文字を入力するところ
ボタン: ホームページの画面を構成する部品の一つで,ボタンの形状のスイッチ。
フォーム: ホームページの画面を構成する部品を配置する場所。
HTML: ホームページを作るための言語。
関数呼び出し: 関数を実行する。
関数定義: プログラムの命令を関数の形式で書くこと
初期化:
変数など使用する前に予めクリアしておくこと。
キーボード練習
cpyToday-b.hta
<form name = "xf">
<textarea name = "xta" rows = 3 cols = 30>
</textarea>
<br>
<input type = "button" value = "コピー" onClick = "xcp()">
</form>
<script language="JScript">
var d
var yyyy, mm, dd;
var fmt =""; //fmtの中身を最初は空にしておく。初期化
// 関数定義
function xcp(){
clipboardData.setData('Text', document.xf.xta.value);
}
d = new Date(); // 現在時刻を取得
yyyy = d.getYear();
mm = d.getMonth() + 1; // 月を0から数えているため+1
dd = d.getDate();
if (mm < 10){ // 01等とするため
mm = "0" + mm;
}
if (dd < 10){
dd = "0" + dd;
}
fmt = yyyy + "-" + mm + "-" + dd;
window.resizeTo(400,150);
window.moveTo(100,100);
//クリップボードに日付をコピー
clipboardData.setData('Text', fmt);
//表示
// document.write(fmt); コメントで前のプログラムの一部を残している。
document.xf.xta.value = fmt;
</script>
|
cpyToday-b.hta から,日付の機能を取り除き,コピーボタンを押したら,テキストエリアの情報をクリップボードにコピーをするだけのプログラムにする。
前回の課題の,cpyAdr.hta にテキストエリアとボタンを追加。
前回の課題の,cpyTime.hta にテキストエリアとボタンを追加。
| アンケート項目
学科 生命,機能,その他(具体的に) 学生番号(下2桁) 氏名 A 今日の授業でためになったこと B 授業に関する質問 C 授業の充実度(1-5) D アンケート 1 前に人の名前(フルネーム)は? 2
その人の得意になりたいor気合を入れている大学の授業科目と理由 |
プログラムを自分に合わせて改良するやる方を学ぶ
クリップボード: キーボードを利用して,コピー&貼付けをするときに,コピーしたものを保存しておくところ。
コメント: プログラムソースの中に書き込むメモ。
キーボード練習
hello.hta
| <script language="JScript"> document.write("やー"); </script> |
cpyToday.hta
クリップボードに,今日の日付を入れる。
<script language="JScript">
var d, yyyy, mm, dd;
var fmt;
d = new Date(); // 現在時刻を取得
yyyy = d.getYear();
mm = d.getMonth() + 1; // 月を0から数えているため+1
dd = d.getDate();
if (mm < 10){ // 01等とするため
mm = "0" + mm;
}
if (dd < 10){
dd = "0" + dd;
}
fmt = yyyy + "-" + mm + "-" + dd
window.resizeTo(300,100);
window.moveTo(100,100);
//クリップボードに日付をコピー
clipboardData.setData('Text', fmt);
//確認のために表示
document.write(fmt);
</script>
|
1 直したら使えそうなプログラムを見つける
2 どこを直したらいいかを見つける
3 直す
日付の表示の仕方を,2009-10-20 から,2009/10/22 にする。cpyToday01.hta
<script language="JScript">
var d, yyyy, mm, dd;
var fmt;
d = new Date(); // 現在時刻を取得
yyyy = d.getYear();
mm = d.getMonth() + 1; // 月を0から数えているため+1
dd = d.getDate();
if (mm < 10){ // 01等とするため
mm = "0" + mm;
}
if (dd < 10){
dd = "0" + dd;
}
fmt = yyyy + "/" + mm + "/" + dd
window.resizeTo(300,100);
window.moveTo(100,100);
//クリップボードに日付をコピー
clipboardData.setData('Text', fmt);
//確認のために表示
document.write(fmt);
</script>
|
自分の郵便番号,住所,名前をクリップボードにコピーをするプログラムを作成する。郵便番号,住所,名前の間には,\r\n(改行をする特殊記号) を入れること。
<script language="JScript">
var fmt;
fmt = "502-0046\r\n岐阜市長良川杉乃町2の14\r\n斎藤末広"
window.resizeTo(300,150);
window.moveTo(100,100);
//クリップボードに日付をコピー
clipboardData.setData('Text', fmt);
//確認のために表示
document.write(fmt);
</script>
|
日付と時刻をクリップボードにコピーするプログラムを作成する。
<script language="JScript">
var d, yyyy, mm, dd;
var hh, min, sec;
var fmt;
d = new Date(); // 現在時刻を取得
yyyy = d.getYear();
mm = d.getMonth() + 1; // 月を0から数えているため+1
dd = d.getDate();
hh = d.getHours();
min = d.getMinutes();
sec = d.getSeconds();
if (mm < 10){ // 01等とするため
mm = "0" + mm;
}
if (dd < 10){
dd = "0" + dd;
}
if (hh < 10){
hh = "0" + hh;
}
if (min < 10){
min = "0" + min;
}
if (sec < 10){
sec = "0" + sec;
}
fmt = yyyy + "-" + mm + "-" + dd + " " + hh + ":" + min + ":" + sec;
window.resizeTo(300,100);
window.moveTo(100,100);
//クリップボードに日付をコピー
clipboardData.setData('Text', fmt);
//確認のために表示
document.write(fmt);
</script>
|
アンケート
| アンケート項目
学科 生命,機能,その他(具体的に) 学生番号(下2桁) 氏名 A 今日の授業でためになったこと B 授業に関する質問 C 授業の充実度(1-5) D アンケート 1 前に人の名前(フルネーム)は? 2
その人の好きな漫画(or小説)? |
プログラムの基本を学ぶ
プログラム言語:プログラムを作成するための言語。
HTML:ホームページを作成するための言語。主に,文字内容を記述。
CSS:
ホームページを作成するための言語。主に,デザインを記述。
JavaScript: ホームページを作成するための言語。
主に,動作を記述
拡張子:ファイルの種類をわかりやすく表すために,ファイルの名前で"."の後ろにつけたもの。通常3文字。
関数(命令,メソッド):
プログラムを関数の形式で表したもの
変数(orプロパティ):
プログラムの中で,変化するところを明示したもの。これによってプログラムの応用性を高める。
キーボード練習
hello.hta
hta: HTML application HTML を使った応用プログラム
HTML の中で,JavaScript を使用する。
| <script language="JScript"> document.write("やー"); </script> |
write( ) 数学の関数の形,仕事をするので,命令(コマンド),メソッド
大きさを変更 hello01.hta
hello01.hta
| <script language="JScript">
|
変数を利用 hello02.hta
| <script language="JScript">
var xmsg = "こんにちは"; |
表示の位置を変更するには? hello03.hta として作成
window.moveTo(100, 200)
右上に表示にするには? hello04.hta として作成
| アンケート項目
学科 生命,機能,その他(具体的に) 学生番号,下2桁 氏名 A 今日の授業でためになったこと B 授業に関する質問 C 授業の充実度(1-5) D アンケート 1 前に人の名前は? 2 その人の好きな映画? |
10/8 は,休講でした。
キーボード練習ができる状態にする。
美佳タイプをダウンロードし,各自の[ホームディレクト](Z:)に入れる。
ヤフーメールで,自分のメールを出せるように設定する。
補足:[ホームディレクト]は,岐阜大学の方で用意してあり,卒業まで使用可能です。
席の座り方,退出の仕方の約束確認
電源の入れ方,ID(ユーザー名)とパスワードの入れ方,電源の落とし方の説明
Winパソコン基本操作:チェックリスト
文字書きスピードの測定 日本国憲法前文 タッチタイプの目標はこの3倍。
指回しのやり方説明
美佳タイプをダウンロードし,各自の[ホームディレクト]に入れる。
メニューの4-2の確認
ホームポジションの確認
| アンケート項目
学科 生命,機能,その他(具体的に) 学生番号,下2桁 氏名 A 今日の授業でためになったこと B 授業に関する質問 C 授業の充実度(1-5) D アンケート 1 授業の前から,正しい指でタッチタイプができたか? はい,いいえ 2 自分のパソコンをもているか? はい,いいえ 3 手書きスピード ○字/分 |