東京２０２０パラリンピックは８月２４日から

2件の返信

コロナデルタ株（インド株）が猛威を振るう中開催されますがオリンピックと同様多くの人の感動、共感を皆はどう感じるのでしょう。

身近な化学製品についてのメモです

コメントを残す

身近な化学製品例

肥料　空気中の窒素を高圧と触媒を使ってアンモニアが作れるようになった。

硫安や尿素

農薬　除草剤　殺虫剤　殺菌剤

園芸資材　透明フィルム　マルチ　散水パイプなどのプラスチック製品

食品　包装用品　包装フィルム　ペットボトル（ポリエステル樹脂）

上下水　凝集剤として劉さんアルミニュウムやポリ塩化アルミニュウム　オゾン殺菌　高分子凝集剤　逆浸透膜エレメント

石鹸　洗剤

医薬品　アスピリンなど合成医薬品　消毒用クレゾール、アルコール　点滴パック　人工臓器

塗料　接着剤　プラスチック建材　塩化ビニール　ポリカーボネート　断熱材　塩ビサッシ

タイヤ　軽量自動車部品　エンジニアリングプラスチック　ABS樹脂　ポリプロピレン

燃料電池　リチウムイオン電池　絶縁材　ケーシング材

液晶パネルには偏向フィルム、カラーフィルター、導光板　光ケーブル　フォトレジスト

紙パルプ製造に苛性ソーダ、塩素、過酸化水素　リサイクルには脱墨剤　

印刷インキ　顔料

記録メディア　映画フィルム　酢酸セルロース　ポリエステル　ポリカーボネイト

以上　まだまだ他にもたくさんありそうですね。燃料の脱石油が加速していますが化学製品として今後も生産され続けられるでしょう。

東京オリンピック２０２０が始まるよ

1件のフィードバック

コロナ感染拡大で開催反対の人が多いなか、いよいよ東京オリンピックが始まります。やってよかったのか悪かったのかは終わってみなければわかりません。ここ１っか月いろいろなエピソードがいやおうなしに皆の心に刻まれることでしょう。

サーバーサイドプログラムの準備

コメントを残す

前回javascriptを紹介しましたが、サーバーとのやり取りする中で、サーバー側で処理するプログラムとしてPHPが用意されてます。

ここではXAMPPというサーバープログラムをインストールしどのようにPHPプログラムを走らせるかを紹介します。

①　http://www.apachefriends.org/jp/xampp.htmlでダウンロードします。

②　’こんにちは’を表示するphpプログラムは以下のように書きます。

　　<?php

echo”こんにちは”；

これをXAMPPのインストール先にある「htdocs」というホルダーの中にkonnitiwa.phpなどの名前をつけて保存します。ここに置くのが決まり事ですで参照可能となります。

③サーバーソフトXAMPPを起動させ、apacheやsqlのスタートボタンを押します。これで準備OKです。

④WEBブラウザのurlで「http://localhost/konnitiwa.phpでアクセスすると実行されます。

以上実行して確認してみてください。サーバーはstartをstopにしquitボタンで終了できます。

サーバーがレンタルなどの外部サーバーの場合は指定されたサーバーディレクトリにphpプログラムを配置してください。

6月２０日緊急事態宣言解除へ

コメントを残す

ワクチン接種が加速する中、変異種コロナ拡大防止、病床使用率確保、オリンピック開催に向けて今後の方向を打ち出す時期にきました。多様な意見のある中、皆さんはどう思われますか。

online対話について

コメントを残す

第４波コロナ感染が勢いをつけるなかワクチンの遅れなど心配な状況が続いています。
そんな中人との接触を避けるためオンラインで仕事、会議、受講はもちろんお茶飲み会、はては法事まで行う時代になりました。
オンラインでskypeやラインなど気になる程の流行はありませんでした。さらにzoomやたのオンライン対話が登場し逆にどれをどのように利用したらよいのか混乱しそうです。

ここではZOOMについてのメモを紹介します。
・多人数で互いに顔をみながら通話ができる。
・無料と有料がある。無料は参加者１００人まで、１対１は無制限、３人以上は４０分まで
・必要な機材　パソコン　カメラ　または携帯電話その他イヤフォン、ヘッドフォンなどがあればベター
・背景や顔の明るさ調整可

先ずZOOMにユーザー登録する。https://zoom.us/jp-jp/が登録サイト
・メールアドレス入力し、サインアップは無料ですをクリック
・誕生日入力し続けるをクリック
・メールアドレスを確認し確認をクリック
・入力したメールアドレスに届いたメールを確認しアクティブなアカウントをクリック
・画面がWEBサイトに切り替わりZOOMへようこそのページが開く。名前を入力、パスワードを入力確認のため再入　　力し続けるをクリック。
・ほかのユーザーを招待する画面が表示されるが手順をスキップするをクリックする。今は招待せずにすすめる。
・テストミーティングを開始が表示される。テストせずにマイアカウントをクリック。デスクトップにアイコンができる。

ZOOMアプリのインストール　ミーティングクライアントをインストールしないと使えない。
・https;//zoom.us/jp-jp/を開く
・画面を下までスクロールしダウンロードのミーティングクライアントをクリックする。
・ミーティング用ZOOMクライアントのダウンロードをクリック。
・実行をクリック
・インストールが完了する。
・デスクトップにアイコンが登録される。

ZOOMアプリの起動しサインする。メールアドレスとパスワード入力するとミーティングクライアントアプリが起動する。

ミーティングテスト　https://zoom.us/testを開き音声、マイクと映像のテストをする。退出でテスト終了。

ミーティングを始める。新規ミーティングのVをクリック。ビデオありで開始を選択　ミーティングIDをoff
新規ミーティングをクリック。

ミーティング招待者の参加を許可する。許可されるまでは待合室にいることになる。
許可する人をクリック。全員許可もある。

ホームページ作りに役立つｈｔｍｌとjavascriptの入門　2021/4スタート

コメントを残す

第1回

下記のプログラムを見てください。ｈｔｍｌやjavascriptや画像の呼び出し文で構成されていてこれだけで、画面上に動く画像を表示できます。初めての方はちんぷんかんぷんで何のことかわからないとなりますが、中身は難しくなく徐々に慣れてきますので安心して練習してください。尚、高度なプログラムはできないのであくまで入門ということで了解ください。

<html>
<head>
<title>画像を動かす</title>

<img src="haikei.png" name="haikeiImage" style="position:absolute;left:0px;top:16px;">

<script language="JavaScript"><!--
//<img src="haikei.png" name="haikeiImage" style="position:absolute;left:0px;top:0px;">
var x=0;
var y=16;
var konakoroy1=180;
var konakoroy2=300;
var v=2;
var r=100;
var rd;
var rdd;
function moveBall()
{
if((x>1000)||(x<0))
if(x>1000)x=0;
   x=x+v;
 if ((x>200 && x<800)||(x>900 && x<1300)){
   //y=konakoroy1;
   rd=200+r-x;
//alert("rd="+rd+"");
  rdd=r*r-rd*rd;
//alert("rdd="+rdd+"");
   y=konakoroy2+Math.sqrt(rdd);
//alert("y="+rdd+"");
  }

  else{
   y=konakoroy2;
  }


  // if((x>448)||(x<0))v=-v;
document.ballImage4.style.left=-x+1000;

document.ballImage6.style.left=-x+1200;
document.ballImage6.style.top=y;
 document.ballImage.style.left=x;
 document.ballImage1.style.left=x+150;
 document.ballImage2.style.left=x+300;
 document.ballImage3.style.left=x-150;
document.ballImage3.style.top=y;
 document.ballImage5.style.left=x-200;
document.ballImage5.style.top=y;
document.ballImage7.style.left=x-400;
}
// --></script>



</head>

<body onLoad="setInterval('moveBall()',10)">
<img src="note.png" name="ballImage4" style="position:absolute;left:1000px;top:280px;">
<img src="konakoro.png" name="ballImage6" style="position:absolute;left:1000px;top:300px;">
<img src="jitensha.png" name="ballImage" style="position:absolute;left:0px;top:312px;">
<img src="jitensha.png" name="ballImage1" style="position:absolute;left:150px;top:312px;">
<img src="jitensha.png" name="ballImage2" style="position:absolute;left:300px;top:312px;">
<img src="tori.png" name="ballImage3" style="position:absolute;left:-150px;top:100px;">

<img src="tori.png" name="ballImage5" style="position:absolute;left:-200px;top:100px;">
<img src="image12.png" name="ballImage7" style="position:absolute;left:-500px;top:400px;">
</body>

</html>

解説はじめ

html文を使ったプログラムを作ると日ごろ使っているインターネットのWEBブラウザ上に文章や絵、写真、動画などを表現できます。

ｈｔｍｌプログラム作成の準備

①windowsの標準メモ帳を使って文章を作る。
②文章の書き方は「　＜　」と[　＞　」で囲んだ命令とそれ以外の文章で作っていきます。

画面に「こんにちわ」と表現してみましょう

<html>
<h1>こんにちわ</h1>
</html>

上の文章をコピーペーストでメモ帳に貼り付け .htmlの拡張子を付けて保存します。
このとき、テキスト文で保存するのではなく何でもファイルを意味する「＊」を拡張子にえらんでおいてファイル名と拡張子例えば　test01.htmlとして保存します。

保存したらtest01.htmlをクリックして開いてみましょう。できましたか。今回はここまでです。では次回お楽しみに。

第２回

html要素
<html> 文書のルート要素（基礎になる）
<head>　文書のヘッダー
<body>　文書の本体
<title>　文書のタイトル
<meta>　文書に関するmeta情報　使用する言語などを指定する
<div>　範囲の指定（ブロックレベル）
<span>　範囲の指定（ブロック内のインライン）
<h1>から<h6>まで　見出し文字の大きさを指定
<address>　連絡先

書き方
<html>….</html>のように終わりには[/]を入れます。

テキスト

<p>　段落
<br>　改行　改行の場合は終わりの[/]は不要です。
以下　たくさんありますので、調べてみてください。

レイアウト
<center>　センターに文章配置

リンク
<a>　リンクのアンカー

リスト

<li>　リストの項目

画像

<img>　画像の埋め込み　呼び出し

テーブル
<table>　表

フォーム
<form>　入力フォーム
<input>　フォームの部品で入力ボックスや結果表示に使える。

色々試してください。いろいろ欲張らずに単純なものを繰り返しましょう。

文書を選択しctrl+pでコピーしctrl+vで貼り付けるとプログラムが簡単にかけますよ。

———
<head>

<body>

————
</body>
</html>

第3回

cssについて
cssはhtml文の装飾に使う。見やすく、かっこよくなど。
css機能を組み込むのには２通りある。①html文章内に<style>——-</style>宣言して書くか
②拡張子.cssを持つ別ファイルを作って、html文章から参照させる方法である。
②に慣れていた方が文章がすっきりするし、応用拡大しやすくなりますのでこちらをお奨め。
　　　　xxxx.cssファイルを作る
　参照方法は
　<link　rel=”stylesheet”　href=”〇〇〇.css”　type=”text/css”>のように書きます。
　<>link以下のタグ中の各機能記述の順番はどこに配置してもよいようです。
記述例
　　　body{background.color:#8fbc8b;}
h1{font-size:28pt;color:#ffffff;}
いきなり難しくなったと思われた方、現時点ではcssとは文章を装飾しカッコよくするものと理解しておいてください。

次回はjavascriptについて書いてみます。

第4回
javascriptの実装
先ず以下のhtmlプログラムを参照ください。
<html>
<head>
<meta charset=”utf-8″>
<title>こんにちわ</title>
</head>
<body>
<script>
window.document.write(“初めてのJAVASCRIPTです。”);

</script>
</body>
</html>
以上プログラムを作って実行してみてください。
<script>———</script>の間がjavascriptです。
この部分はcssと同様javascriptファイルである拡張子.jaファイルとして
別に用意することができます。
htmlからの呼び出し方は　<script>と</script>の間に呼び出したいファイル名をsrc=”〇〇〇.js”のように記述しておきます。
第5回
これまでの説明で、第１回で紹介したプログラムを解説していきます。sample1

<html>　html文の始まり
<head>　head文の始まり
<title>画像を動かす</title>　タイトル表示

<img src=”haikei.png” name=”haikeiImage” style=”position:absolute;left:0px;top:16px;”>　背景図の別途に用意したhaikei.pngを配置します。

else{
y=konakoroy2;
}

// if((x>448)||(x<0))v=-v;
document.ballImage4.style.left=-x+1000;　別途用意されたイメージを識別する名前を使ってイメージの動きを決めています・以下です。

document.ballImage6.style.left=-x+1200;
document.ballImage6.style.top=y;
document.ballImage.style.left=x;
document.ballImage1.style.left=x+150;
document.ballImage2.style.left=x+300;
document.ballImage3.style.left=x-150;
document.ballImage3.style.top=y;
document.ballImage5.style.left=x-200;
document.ballImage5.style.top=y;
document.ballImage7.style.left=x-400;
}
// –></script>

</head>

<body onLoad=”setInterval(‘moveBall()’,10)”> プログラムがスタートすると最初に呼び込まれ、ある一定時間隔ここでは10でmoveball()関数を繰り返し実行させます。
<img src=”note.png” name=”ballImage4″ style=”position:absolute;left:1000px;top:280px;”>スタート時に別途用意するイメージファイルを使って初期位置を設定しています。このときnameを設定しておき関数moveball()中で使うイメージの動きの式中で使います。以下同様です。
<img src=”konakoro.png” name=”ballImage6″ style=”position:absolute;left:1000px;top:300px;”>
<img src=”jitensha.png” name=”ballImage” style=”position:absolute;left:0px;top:312px;”>
<img src=”jitensha.png” name=”ballImage1″ style=”position:absolute;left:150px;top:312px;”>
<img src=”jitensha.png” name=”ballImage2″ style=”position:absolute;left:300px;top:312px;”>
<img src=”tori.png” name=”ballImage3″ style=”position:absolute;left:-150px;top:100px;”>

</html>

以上ですが本文をコピーペーストで利用する場合はイメージを準備することを忘れずに。イメージは任意に決めてください。このプログラムではcssは使っていません。

sample2
tulip.pngとranankyurasu.png画像を任意に準備して同じホルダーに保存しておいてください。

<html>
<img src="tulip.png">
<h1>チューリップ球根の保存方法</h1>
<ul>
	<li>花が咲き終わったら茎の根元を切る。</li>
	<li>球根に栄養を蓄えるため葉は枯れるまで残しておく。</li>
	<li>葉が枯れたら球根を掘り起こす。</li>
	<li>掘り起こした球根は網袋などに入れ風通しの良い軒下などに吊るしておく。</li>
	<li>秋も終わり寒くなったころに植え付ける。
</ul>
<h1>ラナンキュラスもチューリップと同じ手順</h1>
<img src="ranankyurasu.png">
</html>

以上　初級htmlとjavascriptの第１回〜第５回までの説明は終わります。

今回はの入門編ではサーバーとのやり取りサーバーサイドプログラムについては含んでいません。