本校の情報教室が Linux 主体なわけ
中西渉
watayan@meigaku.ac.jp
名古屋高等学校

2022 年 12 月 26 日

中西渉 (名古屋高等学校)

本校の情報教室が Linux 主体なわけ

2022 年 12 月 26 日

1 / 18

はじめにはじめに
本校の ICT 環境
情報教室サーバ
情報教室端末生徒個人端末Debian GNU/Linux
Debian GNU/Linux
iPad

なぜ情報教室サーバ ・ 端末を Linux にし たのか?
そのこ とのメリ ッ ト は?
そのこ とのデメリ ッ ト は?

中西渉 (名古屋高等学校)

本校の情報教室が Linux 主体なわけ

2022 年 12 月 26 日

2 / 18

自己紹介 ・ 勤務校紹介

自己紹介
氏名 中西渉勤務校 名古屋高等学校 （1989〜）
教科 情報 （元は数学）
得意分野 プログラミ ング
PenFlowchart， WaPEN， PyPEN などの開発

Web https://watayan.net
twitter @watayan

中西渉 (名古屋高等学校)

本校の情報教室が Linux 主体なわけ

2022 年 12 月 26 日

3 / 18

自己紹介 ・ 勤務校紹介

勤務校紹介
学校法人名古屋学院 名古屋中学校 ・ 名古屋高等学校
創立 1887 年 （名古屋英和学校）
私立男子校併設型中高一貫校
キリ スト 教主義 （プロテスタ ント 系）
建学の精神 『敬神愛人』

https://www.meigaku.ac.jp

中西渉 (名古屋高等学校)

本校の情報教室が Linux 主体なわけ

2022 年 12 月 26 日

4 / 18

HTML の実習においてHTML の実習において使用教科書 ： 日本文教出版 「情報 I」
第 2 章の章末実習 「ポスタ ーや Web サイ ト の制作」

Web サイ ト 制作実習のフ ァ イ ル構成

中西渉 (名古屋高等学校)

本校の情報教室が Linux 主体なわけ

2022 年 12 月 26 日

5 / 18

HTML の実習において共通部分の処理

共通の HTML(index.html, content_?.html)<!DOCTYPE html><html lang="ja"><head><meta charset="utf-8"><title>Web ページのタイトル</title><link rel="stylesheet" href="common.css" type="text/css"></head><body><div class="header">Web ページ上部に表示するヘッダ部（全ページ共通）</div><div class="left-navi">
Web ページ左部に表示するナビゲーション部（全ページ共通）</div><div class="main-contents">
Web ページのコンテンツ部（各ページ異なる内容）</div><div class="footer">Web ページ下部に表示するフッタ部（全ページ共通）</div></body></html>中西渉 (名古屋高等学校)

本校の情報教室が Linux 主体なわけ

2022 年 12 月 26 日

6 / 18

HTML の実習において共通部分の処理

ヘッ ダ部<p><a href="index.html"><img src="images/kosho.png" width="30" height="30" alt="校章のイラスト"></a>情報高等学校</p>

ナビゲーシ ョ ン部
コンテンツ<br><div class="left-menu"><a href="content_1.html">メニュー 1</a></div><div class="left-menu"><a href="content_2.html">メニュー 2</a></div><div class="left-menu"><a href="content_3.html">メニュー 3</a></div><div class="left-menu"><a href="content_4.html">メニュー 4</a></div>

フッ タ 部(c) Joho High School

中西渉 (名古屋高等学校)

本校の情報教室が Linux 主体なわけ

2022 年 12 月 26 日

7 / 18

HTML の実習において共通部分の処理

5 つのファ イ ルに全部同じこ と書く の?
→全ファ イ ルにコ ピペ ? 1 つ作っ てコ ピー ?
→もし 書き換えたく なっ たら ?
共通する記述は 1 つのフ ァ イ ルにし たい中西渉 (名古屋高等学校)

本校の情報教室が Linux 主体なわけ

2022 年 12 月 26 日

8 / 18

HTML の実習において共通部分の処理共通する記述は 1 つのフ ァ イ ルにし たい→ HTML には include の仕組みはない
実現方法
JavaScript

SSI

PHP

難点
サーバ経由でないと見えない (CORS)
プログラミ ングは未習
jQuery 使う ?
サーバ経由でないと見えないサーバ側に設定が必要
セキュ リ ティ 面に難サーバ経由でないと見えないサーバ側に設定が必要

PHP が楽かなあ…

中西渉 (名古屋高等学校)

本校の情報教室が Linux 主体なわけ

2022 年 12 月 26 日

9 / 18

HTML の実習において共通部分の処理

ファ イ ル構成の変更→中西渉 (名古屋高等学校)

本校の情報教室が Linux 主体なわけ

2022 年 12 月 26 日

10 / 18

HTML の実習において共通部分の処理

共通の HTML(index.html, index?.html)<!DOCTYPE html><html lang="ja"><head><meta charset="utf-8"><title>Web ページのタイトル</title><link rel="stylesheet" href="common.css" type="text/css"></head><body><div class="header"><?php include('header.html'); ?></div><div class="left-navi"><?php include('navigation.html'); ?></div><div class="main-contents"><?php include('contents0.html'); ?></div><div class="footer"><?php include('footer.html'); ?></div></body></html>中西渉 (名古屋高等学校)

本校の情報教室が Linux 主体なわけ

2022 年 12 月 26 日

11 / 18

HTML の実習において共通部分の処理

拡張子 html のフ ァ イ ルも PHP を通す設定

中西渉 (名古屋高等学校)

本校の情報教室が Linux 主体なわけ

2022 年 12 月 26 日

12 / 18

HTML の実習において共通部分の処理

header.html<p><a href="index.html"><img src="images/kosho.png" width="30" height="30" alt="校章のイラスト"></a>情報高等学校</p>navigation.html
コンテンツ<br><div class="left-menu"><a href="index1.html">メニュー 1</a></div><div class="left-menu"><a href="index2.html">メニュー 2</a></div><div class="left-menu"><a href="index3.html">メニュー 3</a></div><div class="left-menu"><a href="index4.html">メニュー 4</a></div>

footer.html(c) Joho High School

中西渉 (名古屋高等学校)

本校の情報教室が Linux 主体なわけ

2022 年 12 月 26 日

13 / 18

HTML の実習において

閲覧方法

生徒はホーム ディ レ ク ト リ で作業
ホーム ディ レ ク ト リ は NFS サーバからマウント→ NFS サーバを Web サーバにすればいい
ホーム ディ レ ク ト リ の public_html がサーバ経由でhttp://サーバ名/~ユーザ名/になる

中西渉 (名古屋高等学校)

本校の情報教室が Linux 主体なわけ

2022 年 12 月 26 日

14 / 18HTML の実習において

閲覧方法

ホーム ディ レ ク ト リ に public_html というディ レ ク ト リ を作る→ 生徒にフ ォ ルダを作らせるのはミ スの元→ フォ ルダごと配布

中西渉 (名古屋高等学校)

本校の情報教室が Linux 主体なわけ

2022 年 12 月 26 日

15 / 18

HTML の実習において

閲覧方法

生徒のフォ ルダ一覧は簡単にできる

中西渉 (名古屋高等学校)

本校の情報教室が Linux 主体なわけ

2022 年 12 月 26 日

16 / 18

Linux だからLinux だからUNIX 系のサーバだから楽にできた部分がある
設定はわり と自由
資料もわり とあるUNIX 系の端末だから楽にできた部分がある
学校の事情と OS の事情を混同し てほし く ない
ホーム ディ レ ク ト リ はローカルと同じ扱い
OS なんて何でもいいという時代

中西渉 (名古屋高等学校)

本校の情報教室が Linux 主体なわけ

2022 年 12 月 26 日

17 / 18

Linux だから

Windows でどうやるかわからない

中西渉 (名古屋高等学校)

本校の情報教室が Linux 主体なわけ

2022 年 12 月 26 日

18 / 18