Slide 1

Slide 1 text

学情絶叫 ウェブシステムGX ~Development the system and manage contents in the server.~ Sora Arakawa (arkw) 2021/12/26 静大情報LT大会@静岡大学 浜松キャンパス 「#静大情報LT」でツイートすると 画面上部に表示されます!

Slide 2

Slide 2 text

自己紹介 Sora Arakawa(arkw) • 静岡大学 情報学部 行動情報学科 B2 • 所属:某室(長)、xRサークルはまりあ、ICON • 愛知県岡崎市出身→静岡県浜松市在住 • 光回線開通しました • https://arkw.net/ • シンフォギア未履修(ここ重要)(OP曲がすき)

Slide 3

Slide 3 text

あらすじ

Slide 4

Slide 4 text

時に、西暦2021年

Slide 5

Slide 5 text

学情システム、 墜ちて燃えて尽きて、 そして―

Slide 6

Slide 6 text

学情チャンが生まれた

Slide 7

Slide 7 text

今日は何の話?

Slide 8

Slide 8 text

https://gakujochan.com/

Slide 9

Slide 9 text

No content

Slide 10

Slide 10 text

の、システムの話

Slide 11

Slide 11 text

ところで ・GXって何?

Slide 12

Slide 12 text

ところで ・GXって何? → 知るか

Slide 13

Slide 13 text

ところで ・GXって何? → 知るか ・行情2年の地獄「Webシステム設計演習」とは無関係です

Slide 14

Slide 14 text

学情チャン ・学情の擬人化 ・学情チャンプロジェクト(通称:学プロ)が運営

Slide 15

Slide 15 text

学情チャン 非公式ポータル ・学情チャンの紹介や各種リンクをまとめたページ ・https://gakujo.arkw.net/ ・ロゴはこの頃からあった ・2021年5月24日公開~6月4日閉鎖 → 改修の後、学情チャンプロジェクトに譲渡

Slide 16

Slide 16 text

No content

Slide 17

Slide 17 text

No content

Slide 18

Slide 18 text

構成 ・ロリポップ! レンタルサーバ gakujochan.com/114514 とか入れるとエラーページが出る ・クライアントサイド:HTML、CSS、JavaScript(jQuery) ・サーバサイド:PHP(独自CMS v1)

Slide 19

Slide 19 text

独自CMS ・CMS?サイトジェネレータ? ・他のサイト用に書いたプログラムを転用 ・別ファイルのHTMLをテンプレートに合成する ・URLは「https://gakujochan.com/?p={HTMLファイル名}」 ・NoSQL(DBMS不使用)

Slide 20

Slide 20 text

独自CMS index.php ←メインプログラム list.php ←ページリスト page/ ←ページHTML格納フォルダ css/ img/ js/ …(以下略)

Slide 21

Slide 21 text

・pageディレクトリにHTMLファイルを格納する

Slide 22

Slide 22 text

"資料集", "rules" => "学情チャンとのお約束", "contest" => "コンテスト", "404" => "404 Not Found", "illustcon_1" => "第1回 学情チャンイラストコンテスト", "illustcon_2" => "第2回 学情チャンイラストコンテスト", "writecon_1" => "第1回 書いたよ学情チャンコンテスト" ];

Slide 23

Slide 23 text

Slide 24

Slide 24 text

// タイトル

Slide 25

Slide 25 text

// 本文

Slide 26

Slide 26 text

構成 ・独自CMS v2を開発済み、そのうち実装予定 ・list.phpを廃止 ページHTMLの1行目にタイトルを記述する

Slide 27

Slide 27 text

カスのHTML問題

Heading 2

Slide 28

Slide 28 text

カスの表記問題 ・表記揺れ 「第1回」「第2回」「第三回」 ・半角文字/全角文字の混同 「!」「!」「?」「?」 ・半角スペース/全角スペースの不統一

Slide 29

Slide 29 text

対策 Linterの導入 Prettierとかよくね? → Prettierは記法を統一するLinter 初歩的な(?)ミスを訂正するものではない

みたいなダメ文法はエラー吐いて死ぬ @ゆるぼ HTMLの文法ミスに対応したLinter

Slide 30

Slide 30 text

対策 Vue.js / Nuxt.jsに移行 みたいに書けると楽? ビルドはGitHub Actionsで…

Slide 31

Slide 31 text

対策 その他 ・独自CMSに文法チェック/記法チェックを付ける ・ちゃんとしたCMSを入れる(WordPressなど) ・記述ルールを策定する ←これが一番楽

Slide 32

Slide 32 text

ToDo

Slide 33

Slide 33 text

No content

Slide 34

Slide 34 text

ご清聴ありがとうございました