Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
学情絶叫ウェブシステムGX
Search
Sora Arakawa
December 26, 2021
Programming
0
120
学情絶叫ウェブシステムGX
静大情報LT大会 -2021年12月-
Sora Arakawa
December 26, 2021
Tweet
Share
More Decks by Sora Arakawa
See All by Sora Arakawa
技術島の指定ツール「LaTeX」で同人誌を作ろう
arkw
2
61
ポスト・パソコン時代のジャンク遊び スマートデバイス編
arkw
0
57
ジャンカーよ、車も買え ~10分でわかる!? 中古車選び入門~
arkw
1
62
arkw vs. サーバ移転 -2024年1月版-
arkw
0
230
なれる! 村上さん Misskeyサーバ構築入門
arkw
0
420
Cloudflare Tunnelで自宅サーバを公開してみた
arkw
0
1.3k
5分でわかる!? 7セグメントLED制御
arkw
0
61
ヤフオクで原付買った話
arkw
0
170
パソコンの消費電力と省エネ化のおはなし
arkw
0
270
Other Decks in Programming
See All in Programming
shadcn/uiを使ってReactでの開発を加速させよう!
lef237
0
290
QA環境で誰でも自由自在に現在時刻を操って検証できるようにした話
kalibora
1
140
chibiccをCILに移植した結果 (NGK2025S版)
kekyo
PRO
0
120
traP の部内 ISUCON とそれを支えるポータル / PISCON Portal
ikura_hamu
0
180
Simple組み合わせ村から大都会Railsにやってきた俺は / Coming to Rails from the Simple
moznion
3
2.1k
DevFest - Serverless 101 with Google Cloud Functions
tunmise
0
140
アクターシステムに頼らずEvent Sourcingする方法について
j5ik2o
6
700
Alba: Why, How and What's So Interesting
okuramasafumi
0
200
GitHub CopilotでTypeScriptの コード生成するワザップ
starfish719
26
5.9k
週次リリースを実現するための グローバルアプリ開発
tera_ny
1
1.1k
Асинхронность неизбежна: как мы проектировали сервис уведомлений
lamodatech
0
1.3k
いりゃあせ、PHPカンファレンス名古屋2025 / Welcome to PHP Conference Nagoya 2025
ttskch
1
160
Featured
See All Featured
Mobile First: as difficult as doing things right
swwweet
222
9k
GraphQLとの向き合い方2022年版
quramy
44
13k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
3
240
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
30
2.1k
Measuring & Analyzing Core Web Vitals
bluesmoon
5
210
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
120k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
28
4.5k
GraphQLの誤解/rethinking-graphql
sonatard
68
10k
RailsConf 2023
tenderlove
29
970
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
33
2k
Fontdeck: Realign not Redesign
paulrobertlloyd
82
5.3k
No one is an island. Learnings from fostering a developers community.
thoeni
19
3.1k
Transcript
学情絶叫 ウェブシステムGX ~Development the system and manage contents in the
server.~ Sora Arakawa (arkw) 2021/12/26 静大情報LT大会@静岡大学 浜松キャンパス 「#静大情報LT」でツイートすると 画面上部に表示されます!
自己紹介 Sora Arakawa(arkw) • 静岡大学 情報学部 行動情報学科 B2 • 所属:某室(長)、xRサークルはまりあ、ICON
• 愛知県岡崎市出身→静岡県浜松市在住 • 光回線開通しました • https://arkw.net/ • シンフォギア未履修(ここ重要)(OP曲がすき)
あらすじ
時に、西暦2021年
学情システム、 墜ちて燃えて尽きて、 そして―
学情チャンが生まれた
今日は何の話?
https://gakujochan.com/
None
の、システムの話
ところで ・GXって何?
ところで ・GXって何? → 知るか
ところで ・GXって何? → 知るか ・行情2年の地獄「Webシステム設計演習」とは無関係です
学情チャン ・学情の擬人化 ・学情チャンプロジェクト(通称:学プロ)が運営
学情チャン 非公式ポータル ・学情チャンの紹介や各種リンクをまとめたページ ・https://gakujo.arkw.net/ ・ロゴはこの頃からあった ・2021年5月24日公開~6月4日閉鎖 → 改修の後、学情チャンプロジェクトに譲渡
None
None
構成 ・ロリポップ! レンタルサーバ gakujochan.com/114514 とか入れるとエラーページが出る ・クライアントサイド:HTML、CSS、JavaScript(jQuery) ・サーバサイド:PHP(独自CMS v1)
独自CMS ・CMS?サイトジェネレータ? ・他のサイト用に書いたプログラムを転用 ・別ファイルのHTMLをテンプレートに合成する ・URLは「https://gakujochan.com/?p={HTMLファイル名}」 ・NoSQL(DBMS不使用)
独自CMS index.php ←メインプログラム list.php ←ページリスト page/ ←ページHTML格納フォルダ css/ img/ js/
…(以下略)
・pageディレクトリにHTMLファイルを格納する
<?php $list = [ "reference" => "資料集", "rules" => "学情チャンとのお約束",
"contest" => "コンテスト", "404" => "404 Not Found", "illustcon_1" => "第1回 学情チャンイラストコンテスト", "illustcon_2" => "第2回 学情チャンイラストコンテスト", "writecon_1" => "第1回 書いたよ学情チャンコンテスト" ];
<?php include_once "list.php"; $id = $_GET["p"]; if (isset($id) == "")
{ $id = "top"; } else { if (!file_exists("page/".$id.".html")) { $id = "top"; } $title = $list[$id]; } $main = file_get_contents("page/".$id.".html"); ?>
// タイトル <title><?php if (isset($title) == "") { echo "学情チャン
公式ウェブサイト"; } else { echo "".$title." - 学情チャン 公式ウェブサイト"; } ?></title>
// 本文 <div class="wrapper-columns-right"> <?php echo $main ?> </div>
構成 ・独自CMS v2を開発済み、そのうち実装予定 ・list.phpを廃止 ページHTMLの1行目にタイトルを記述する
カスのHTML問題 <a href = “***”> <a href=“***”style=“font-size: 20px;”> <b style=“font-size:
23px;”> <p><h2>Heading 2</h2></p>
カスの表記問題 ・表記揺れ 「第1回」「第2回」「第三回」 ・半角文字/全角文字の混同 「!」「!」「?」「?」 ・半角スペース/全角スペースの不統一
対策 Linterの導入 Prettierとかよくね? → Prettierは記法を統一するLinter 初歩的な(?)ミスを訂正するものではない <p><h2></h2></p>みたいなダメ文法はエラー吐いて死ぬ @ゆるぼ HTMLの文法ミスに対応したLinter
対策 Vue.js / Nuxt.jsに移行 <Contest v-bind:number=“3” v-bind:name=“書いたよ学情チャンコンテスト“ v-bind:status=“end” /> みたいに書けると楽?
ビルドはGitHub Actionsで…
対策 その他 ・独自CMSに文法チェック/記法チェックを付ける ・ちゃんとしたCMSを入れる(WordPressなど) ・記述ルールを策定する ←これが一番楽
ToDo
None
ご清聴ありがとうございました