#navi(プログラミング演習I/18)

#contents
 
*ネットワークの利用 [#aba4393c]
**本学科システムの利用法: [#f462acb2]
-学科システムの利用法:http://ie.u-ryukyu.ac.jp/?p=474
-Webの利用法:http://ie.u-ryukyu.ac.jp/?p=458
-シェルでのリモートログイン:http://ie.u-ryukyu.ac.jp/?p=4022
//-http://www.ie.u-ryukyu.ac.jp/howto/
**リモートにログイン [#r2eee2cf]
 % ssh e1XXXXX@shell.ie.u-ryukyu.ac.jp

-X Windowを用いてアプリケーションウィンドウを,ローカルに出したい場合
 % ssh -X -Y e1XXXXX@shell.ie.u-ryukyu.ac.jp
 (X11.appのターミナル(kterm,xterm等)からである必要があります.)
**ネットワーク越しのファイルのコピー [#hdebc6d1]
 % scp
 % scp <ファイル名> <アカウント名>@<サーバー名>:<ディレクトリ>
例:
 % scp test.html shell:
 % scp test.html eXXXXXX@shell.ie.u-ryukyu.ac.jp:
 % scp test.html shell.ie.u-ryukyu.ac.jp:~/public_html
* WWW (World Wide Web) [#fdec20e6]
**ページのアップロードと公開 [#e574577b]
テキスト 上巻p.536 第28章 28.6.3 インターネットに公開
***WWWサーバー [#jd71d92f]
***URL (Uniform Resource Locator) [#ce81b1d8]
 http://ie.u-ryukyu.ac.jp
 http://ie.u-ryukyu.ac.jp/ie/students/students.html
 http://ie.u-ryukyu.ac.jp/ie/students/~e18XXXX (e16XXXXのホームページ)
 http://ie.u-ryukyu.ac.jp/~e18XXXX
実機:  
 urasoe.ie.u-ryukyu.ac.jp
サーバー:
 apache
サーバーの設定ファイル:
 /etc/httpd/conf/httpd.conf

ユーザーディレクトリ:
 ~/public_html
 例:
 http://ie.u-ryukyu.ac.jp/~koji/test.txt
 は,ユーザーのホームディレクトリの
 ~/public_html/test.txtというファイルを参照する


学生のみなさんのユーザーディレクトリは,futenamにログイン後,
 % cd public_html
です.
----
ディレクトリがあるかどうか確認しましょう
-urasoeにログイン
 % ssh e1557XX@urasoe.ie.u-ryukyu.ac.jp
 
 % ls -ld public_html
 public_htmlがない場合:
 % mkdir public_html
***ファイル,ディレクトリのパーミッション: [#n39cce60]
公開するファイルは,
 -rwxr-xr-x ファイル
 drwxr-xr-x ディレクトリ
であることが必要.そうでない場合,
 chmod 755 <ファイル名>
で,モードの変更が必要.

***ファイル転送: [#mf133c43]
 scp <ファイル名> <アカウント名>@<サーバー名>:<ディレクトリ>
 scp test.txt shell.ie.u-ryukyu.ac.jp:~/public_html

 sftp <サーバー名>

 rsync -e ssh [オプション] <ディレクトリ> <サーバー名>:<ディレクトリ>
 rsync -auvz -e ssh --exclude '*~' ~/Sites/ shell.ie.u-ryukyu.ac.jp:~/public_html
オプション:
 -a   archive (ファイルについての情報を保つ)
 -u   update  (新しければ更新しない)
 -v   verbose (-vv より詳細なverbose)
 -z   compress with zlib (圧縮して転送)
 -b   backup  (古いファイルは ~ の付いた名前になる)
 --exclude 指定したファイルを転送しない
 -e ssh sshで転送

注意:
-上記の例は,~/Sitesディレクトリ下のファイルを,shell.ie.u-ryukyu.ac.jpの~/public_htmlディレクトリ以下に転送する
 rsync -auvz -e ssh ~/Sites shell.ie.u-ryukyu.ac.jp:public_html
とすると,shell.ie.u-ryukyu.ac.jpの/~public_htmlの下にSitesディレクトリを作ってしまう.
-すなわち,
 ~/public_html/Sites
ができる
*ローカルとリモート [#n9c8cb9e]
-ローカル
--ネットワークにおいて,手元のコンピュータ
-リモート
--ネットワークにつながった,離れたところのコンピュータ
**ローカルにファイルを作ろう [#k823e70d]

 $ cd
 $ mkdir www_dir
 $ cd www_dir
 $ emacs -nw sample.html
**リモートにログインしよう [#yd689cd4]

 $ ssh e1657XX@shell.ie.u-ryukyu.ac.jp
ローカルのコンピュータのアカウントがリモートログイン先と同じなら,アカウント名を省略できます.
 $ ssh shell.ie.u-ryukyu.ac.jp
**リモートにファイルを送ろう」 [#ec9aff88]
***ファイル転送 [#g9d7be5b]
***ファイル転送(3種) [#g9d7be5b]
1
 scp <ファイル名> <アカウント名>@<サーバー名>:<ディレクトリ>
 sup sample.html shell.ie.u-ryukyu.ac.jp:~/public_html

 scp sample.html shell.ie.u-ryukyu.ac.jp:~/public_html
2
 sftp <サーバー名>

3
 rsync -e ssh [オプション] <ディレクトリ> <サーバー名>:<ディレクトリ>
 rsync -auvz -e ssh --exclude '*~' ~/www_dir/ shell:~/public_html
オプション:
 -a   archive (ファイルについての情報を保つ)
 -u   update  (新しければ更新しない)
 -v   verbose (-vv より詳細なverbose)
 -z   compress with zlib (圧縮して転送)
 -b   backup  (古いファイルは ~ の付いた名前になる)
 --exclude 指定したファイルを転送しない
 -e ssh sshで転送

注意:
-上記の例は,~/www_dirディレクトリ下のファイルを,pw0XXの~/public_htmlディレクトリ以下に転送する
 rsync -auvz -e ssh ~/www_dir pw0XX:public_html
とすると,pw0XXの/~public_htmlの下にwww_dirディレクトリを作ってしまう.
-すなわち,
 ~/public_html/www_dir
ができる


 $ rsync -auvz ~/www_dir shell.ie.u-ryukyu.ac.jp:
*WWW [#zbeeb23f]
-Webの利用法:http://ie.u-ryukyu.ac.jp/?p=458
-シェルでのリモートログイン:http://ie.u-ryukyu.ac.jp/?p=4022
*HTML [#q3980fc7]
テキスト 上巻p.525 第28章 28.6 HTMLによるWWWページ作成
----
 % mkdir www_dir
 % cd www_dir
 % emacs -nw index2.html
//上記で編集したファイルは,
// http://localhost/~e1457XX/index2.html
//でブラウザで見ることができます.
----
**HTMLの文書の構造 [#gdceba99]
全体は,HTMLタグで囲まれ,<HEAD>タグで囲まれたヘッダ部,<BODY>タグで囲まれたボディ部からなります.
 <HTML>
  <HEAD>
   <TITLE>
    ページウィンドウタイトル
   </TITLE>
  </HEAD>
 
  <BODY>
   ページ本文
  </BODY>
 </HTML>
-[[サンプルページ:http://www.ie.u-ryukyu.ac.jp/~koji/soft1/index.html]]
**文字コードについて [#gf195c9b]
-ヘッダ部には,METAタグを用いて,文字コードなどを追加定義します.
~日本語を使う場合,HTML文書の文字コードが,~
ユニコード(UTF-8)なら,
 <META http-equiv="Content-Type" content="text/html; charset=UTF-8">
シフトJISなら,
 <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
EUCなら,
 <META http-equiv="Content-Type" content="text/html; charset=EUC-JP">
JISなら,
 <META http-equiv="Content-Type" content="text/html; charset=ISO-2022-JP">
を入れておきましょう.


-''注意'':もちろん,METAタグで指定した文字コードと実際のHTML文書の文字コードが違っていれば,ブラウザは文字化けします.
-情報工学科のpwでは,[[YaTeX:http://www.yatex.org/]]やyahtmlがインストールされているため,htmlファイルを編集する際,yahtmlモードになります.このとき自動的にJISコードになるようになっています.
~編集中の文章がEUCの場合,emacsのモードラインの表示は,
 -かんな-EEE:-
編集中の文章がJISの場合,
 -かんな-EEJ:-
になります.文字コードにあったMETAタグでの設定が必要です.
**emacsの文字コードの設定 -- (C-x <RET> f) [#e07a2344]
|キー入力|動作|h
|C-x <RET> f|文字コードをかえる|
エコーエリアに次にように表示されるので,下記の文字コード設定値を入力する
 Coding system for visited file (default, nil):

|文字コード|設定値|h
|JIS|iso-2022-jp-unix|
|EUC|euc-japan-unix|
|UNIX用Shift-JIS	|sjis-unix|
|MS-DOS用Shift-JIS|sjis-dos|
|Macintosh用Shift-JIS|sjis-mac|


**HTMLのテンプレート [#x88e662f]
 <HTML>
  <HEAD>
   <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8">
   <TITLE>
    ページウィンドウタイトル
   </TITLE>
  </HEAD>
 
  <BODY>
   ページ本文
  </BODY>
 </HTML>

----
**見出し(Heading):<H1> ~ </H1> [#l2567613]
 <H1>見出し1</H1>
 <H2>見出し2</H2>
 <H3>見出し3</H3>
 <H4>見出し4</H4>
 <H5>見出し5</H5>
 <H6>見出し6</H6>
-[[サンプルページ:http://www.ie.u-ryukyu.ac.jp/~koji/soft1/heading.html]]
**段落(パラグラフ):<P> ~ </P> [#tf0364dc]
**リスト(箇条書き) [#g21e60a2]
-UL (Unorderd List):番号なしリスト
 <UL>
 <LI>リスト1
 <LI>リスト2
 <LI> リスト3
 </UL>
-OL (Orderd List):番号付きリスト
 <OL>
 <LI>リスト1
 <LI>リスト2
 <LI> リスト3
 </OL>
-DL (Definition List):定義リスト
 <DL>
 <DT>リスト1
 <DD>答え1
 <DT>リスト2
 <DD>答え2
 <DT> リスト3
 <DD>答え3
 </DL>

階層を作れる:
 <UL>
 <LI>リスト1
 <LI>リスト2
  <UL>
  <LI>リストA
  <LI>リストB
  <LI>リストC
  </UL>
 <LI> リスト3
 </UL>

 <OL>
 <LI>リスト1
 <LI>リスト2
 <OL>
  <LI>リストA
  <LI>リストB
  <LI> リストC
 </OL>
 <LI> リスト3
 </OL>


-[[サンプルページ:http://www.ie.u-ryukyu.ac.jp/~koji/soft1/list.html]]
**ハイパーリンク:<A HREF="~~~">リンク名</A> [#l2045818]
 例:
 <A HREF="http://www.ie.u-ryukyu.ac.jp">琉球大学情報工学科</A>
-[[サンプルページ:http://www.ie.u-ryukyu.ac.jp/~koji/soft1/link.html]]
**イメージ(画像):<IMG SRC="picture.jpg"  ALT="画像名"> [#tbc19ea4]
**整形済みテキスト:<PRE> ~ </PRE> [#b7ccde1b]
空白,タブ,改行を有効にする.コンピュータ出力や,プログラミングソースをそのまま表示する場合に使う.
*参考となるページ [#s01a97f4]
-[[とほほのWWW入門:http://www.tohoho-web.com/www.htm]]

*情報工学科のページ公開法 [#d41e603a]
-http://ie.u-ryukyu.ac.jp/
-http://ie.u-ryukyu.ac.jp/?p=458
-学生のページ http://ie.u-ryukyu.ac.jp/?p=69


//*課題1 
//-学科にホームページを設定しなさい.
//-[[学科学生のページ>http://ie.u-ryukyu.ac.jp/?p=69]]からアクセスできること.
//-ホームページ形式は問いません.
//-また,moodleページの課題欄にURLを記述すること


#navi(プログラミング演習I/18)

トップ   編集 差分 バックアップ 添付 複製 名前変更 リロード   新規 一覧 単語検索 最終更新   ヘルプ   最終更新のRSS