ライブ配信と視聴者からのメッセージ
Web の世界には、面白い小噺がたくさんあります。 雨宿りとWeb の小噺 パーソナリティーの
KEITHです。今回も一つ、興味深いお話をご紹介します。 今回はですね、なんとこの番組始まって、
初めてのライブ配信となります。 おそらく初めてだと思いますけど、しかもですね、
なんとここ、裸ドア Web Creator Podcast Day 2025 というイベントにお声掛けいただきまして、
今、出演をさせていただいています。 トップバッターを務めますので、ものすごく緊張しておりますので、
途中途中、ちょっと噛んでしまったら、ご容赦いただければなと思います。 はい、ということで、今回はどういう話をしようかと悩んだんですけど、
このイベントですね、事前におはがきの投稿も募集されていまして、 ありがたいことに、私の番組にもですね、おはがきいただきましたので、
その内容について深掘りしつつ、今日はお話ししていこうかなと思っております。
はい、では、まずおはがきいただきましたので、読ませていただきたいと思います。
ラジオネーム トールさんからいただきました。 ありがとうございます。
Keith さんの雨宿りとウェブの小話はずっと聞かせてもらっております。 今回のイベントにご出演をするというのを見つけて、メッセージさせていただきました。
毎回 Keith さんの声が聞きやすく、エンジニアリングがしっかりわかる話で、聞いていて、
ああ、そういうのもあるのか、とか、そういうふうに使ってるのか、といった自分のエンジニアとしての足りなさとか、足りてるとかっていうのを図るもの差しのようなつもりで、お聞かせいただいています。
Keith さんには失礼な話ですが、全然そんなことはないです。 毎回このイベントでは、いろいろな番組でご出演をされるということですが、
Keith さんが当日にどんな話題をされるのか、とても楽しみにしています。 当日出演されるエンジニア系ポッドキャストでは、
ひまじんプログラマーの週末エンジニアリングレッスンさんもお聞きしていますが、個人的には Keith さん推しです。
めちゃくちゃ嬉しいですね。ありがとうございます。 はい、個人的にはめちゃエンジニアのマニアックな話をして、他のリスナーさんを置き去りにしてもらいたいと思ったりもしております。
頑張ってください、というお書きをいただきました。 はい、改めましてありがとうございます。
そうですね、普段私の配信は Google ホームからお便りとか感想も募集してますけども、結構のんびりエンジョイする番組ですので、
あんまり技術の深掘りとかもするわけではなかったりするということもありまして、あんまりお便りいただくことがなかったので、今回まさか事前にいただけるとは思ってなくてですね、
文字コードと文字化けの歴史
本当に心から嬉しかったです。ありがとうございます。 ということで、嬉しい反面ですけど、今回のイベントのコンセプト的に
リスナーさんが我々と同じような業界の方であったり、同業の方も全然いらっしゃるだろうなと思っておりまして、
ですので、そういう方を置き去りにするような雑談、何があるかなってすごい考えたんですけど、これ難しくてですね、なかなかいいテーマをいただきました。
自分がマニアックに語れるものなんかあるかなっていうのを昔考えたんですけど、一応私がコミッターをしております
JavaScriptのUIライブラリーRiot.jsというものがあります。 これ実はリアクトと同い年なんですよね。半年後に生まれたライブラリーですけど、これについて喋るか、
新卒の頃にですね、お仕事で触っていたECサイト構築用パッケージソフト、EC-CUBEというものがございます。
ご存知の方もいらっしゃると思いますけど、僕はこれのバージョン2Kを触ってましたね。 この2つのどっちかを喋ろうかなと思っていたんですけど、
Riot.jsは今後喋る予定が実はありまして、改めて喋りたいので、ちょっとネタバレしたくないから今回は控えると。
EC-CUBEも喋ってもいいんですけど、正直カイコダンにしかなり得なくて、知ってる人しかわかんないし、とはいえいろんな意味でツッコミどころ満載のソフトウェアなので、
これこれで楽しい話はあるんですけど、いわゆる酒の魚着にしかならない気がするので、今回もちょっとこれはやめといて、まだ別途ニーズがあれば全然お話しますのでお声掛けください。
ということでじゃあ今日何の話しようかなと思ったんですけど、文字化系のお話、あとは英文字の話かな、をしてみようかなと思いました。
おそらくエンジニアの方ならばまあまあ常識かもしれないですけど、ちょっとその辺はご容赦ください。 おそらく一般的にエンジニアじゃない方は知らない話だと思うので、
まあそれも一ついいのかなと思っております。まあちょっとライト目の話でいきたいと思います。 皆さんの周りに高橋さんとか山崎さんっていらっしゃる方
あると思いますけど、この高いという漢字が例えばはしご高だったり、佐紀という漢字の右上の部分が大きいという大の字ではなくて、
スタンドアップ立つっていう字の佐紀だったりすることもあるんじゃないでしょう。 今はもうほぼほぼなくなったと思いますけど、このちょっと
一般常識と違う形の漢字である場合、ウェブサイトのフォームとかで登録すると、なんか文字化けしちゃったよみたいな経験をしたことある方
いらっしゃるんじゃないでしょうか。エンジニアの方も逆に文字化け対応した方もいたんじゃないかなと思います。
はい、まさにそう文字化け。コンピューターが文字を覚える仕組みの歴史の名残なんですよ。 そもそも大前提としてコンピューターっていうのは我々が使っている
AとかAみたいな文字っていうのを直接理解しているわけではなくて、 コンピューター言語は0と1しか理解できません。
ですので、僕らの方で文字に番号を割り振ってるんですよね。 例えばアルファベットのA、大文字のAは65番、Bは66番。
この文字と番号の対応表のことを文字コードと呼んだりします。 昔はASCIIって言われるアルファベットだけの対応表で十分だったんですよ。
なんですけど、ここに日本語っていうマルチバイト文字が登場しまして、こいつが問題を引き起こす。 日本語ってひらがながありカタカナがあり、そして数万文字あると言われる漢字があると。
これどうやって番号に割り振るかっていうのが大変だったわけですね。 日本中一回大混乱に陥ります。
それに対応するために、例えばShift-JISとかEUC-JPとかいろんな対応表が乱立してしまったので、 結局我々どうしたらええのっていうのが難しかったんですね。
特にやばかったのは、WindowsとMacとかで同じ対応表と番号を使っているのに、まさか違う文字が表示される。 いわゆる奇襲依存文字と言ったりするもの。
丸の1とか、かっこかぶ、ああいうのが起きます。 それをですね、混沌としていた時代があったんですけど、終わらせる救世主が登場します。
これが今も使われているユニコードと言われるもの。 もっと言うと、皆さんも見たことあると思います。UTF-8っていうものですね。
ユニコードの中にもたくさんあって、そのうちの1つです。 平たく言うとこれ何ぞやって話ですが、全世界の古今東西全ての文字に、なるべく重複をしないように固有の番号を与えようというものを定義した文字コードになります。
ただ、UTF-8を使わないと文字パケットが今でも起きているし、皆さんも見たことあると思います。 例えば日本語のアーという文字をUTF-8で変換をすると、E38182みたいな文字で表現されるんですけど、
これをShift-JISで無理やり読み込むと、もつれるっていう感じ。 ちょっと説明するの難しいんですけど、見たことあると思います。そういう文字に変換がされてしまいます。
絵文字の複雑さとエンジニアリングの課題
でもUTF-8を使えば全世界統一の文字として使えるんじゃないのっていうところで、一旦は着地をしたんですけども、ところがどっこいここに登場するのが絵文字っていうやつ。
みんな絵文字大好きですよね。僕もめちゃくちゃ使ってます。そろそろおじさんコープンを使い始めて、年齢だなと思ったりしてるんですが。
絵文字って皆さん一文字だと思うじゃないですか。これ違うんです。 例えば有名な絵文字でいくと家族の絵文字。使ったことある方いらっしゃいますかね。後で検索してみてください。家族で変換するとちゃんと絵文字出てきます。
この絵文字がですね、実は7文字分あるんですね。たった一文字なのに。男性の絵文字、女性の絵文字、男の子なんかで子供が2人いる絵文字、それに加えてそれぞれを接着するための見えないね文字が一文字ずつ混ざって、合計7文字でたった一文字の絵文字を表現をしております。
この見えない接着剤みたいな文字のこと、正式名称をゼロウィッツジョイナー、ZWJと言ったりします。いわゆる幅かゼロの文字ということですね。なので見えないんですけど、確実に存在をしていて、例えばJavaScriptで文字列、.LENGTHこのプロパティを使うと、この家族の絵文字、実はLENGTH11文字だったりするというので、1文字の数が11文字で表現されているところで、スプレッド演算子で分解すると7個の要素に分解されたりします。
で、絵文字一つ単体取ってもいいんですけど、最近はですね、その絵文字にさらに色っていう要素が入ってきまして、手とか顔とか肌色の色を変えられたりするじゃないですか。これがまた面倒くさくて、これ合成文字なんですね。
まあですので、基本的に絵文字って肌色修飾書をくっつけて作られているというので、5段階、肌色をかける数百の絵文字で組み合わせがですね、爆発的に増えるということで、まあこれの対応、エンジニアとしては大変なんですよ。
ということで、なかなか文字化けとか文字コードの話っていうのは古今東西、結構皆さん苦心をしているっていうのを理解していただけると印象が変わるんじゃないかなと思ったりします。
あとですね、絵文字そのものも歴史においてちょっとずつ変化をしていってるんですね。見た目が変わるんですよ。例えば拳銃の絵文字とかって、昔は結構リアルな拳銃だったんですけど、今ってよく見ると水鉄砲になったりしていて、
文字って普遍じゃないの?って僕らもそう思ってたんですけど、やっぱり言語とか言葉、文字ってのは常に変化をしていくっていうのを僕らは意識しなきゃいけないっていう話ですね。
あともう一個は実装上、僕らエンジニアが対応する悪夢的な話をすると、文字数カウントですね。みんな大好き、X。あれって140文字以内みたいな制限があると思いますけど、
あれで家族の絵文字一つで、内部的には実は11文字消費する可能性があって、データベースに参照すると、バーキャラ1とか1文字入る列の絵文字があったり、そんな設定することはないですけど、もしテーブルのカラムの設定がバーキャラの1とかだった場合は、絵文字が入りませんよみたいなことも起きる。
それは内部的に複数文字だからですね。さらに恐ろしいのが、フォントもしくはOSによって絵文字の見た目が変わってしまうことですね。
同じコードを送ってるんですけど、やはりiPhoneとかで見ると見た目が変わってしまう。というので、コミュニケーションツールとして使っている絵文字とかが正確なコミュニケーションを阻害しているみたいな皮肉な状況も起きてしまったりしてですね。
マジで大変なんですよ、絵文字っていうのは。なので皆さん、絵文字使ってください。好きじゃない方も全然いらっしゃるんですけど、僕らエンジニアはたくさんいろんなことを考えて作っておりますので、作っているのは厳密に言うと企画を決めている全世界の頭のいいエンジニアたちだと思いますけど、
ただそれを実際に使われて、僕らはデータベースに登録をしてアプリケーションとかで表示をする。そこで最後のアウトプットのところは僕らが制御しているので、みんながいろんなことを考えてやっているっていうのを知っていただけると印象が変わってくれたら嬉しいなと思ったりしております。
EC-CUBEの歴史と複雑さ
はい、絵文字の話はそんなところで、今回他に話したかったことっていくつかあって、その話どこまで喋ろうかちょっと悩んだんですけど、時間がですね、今回は20分しか用意をしていただけてなかったので、他にも12番組がありますので、加味すると、今回はちょっとですね、ライトめにお話をしようかなって思っておりました。
はい、ちょっとだけ先ほどのEC-CUBEの話だけ若干をしますと、EC-CUBEバージョン2K使ったことある人っていうのはもう多分子さんっていうか、僕と同じ年代なので、おそらく30代40代の方だと思うんですけど、EC-CUBEもいろいろバージョンが変わるにつれてちゃんとフレームワークが入っていたり、データベースとか中身がガラッと刷新されたりとかしてはいたんですけど、このバージョン2Kっていうやつはすごく闇の、闇というと失礼ですねごめんなさい。
作られたら会社さんにはちょっと申し訳ないんですけど、いろいろ闇が含まれるツールでして、一方でこのツールを使うことでたくさんのECサイトが生まれたっていう歴史はしっかりあります。
ですので、その価値はすごくあるのは僕も理解してますし、私もそのEC-CUBEを使ってお仕事をさせていただいて、お給料を得ることができたというので、ものすごく感謝はしてます。
今やっぱりいろんな技術を勉強して知識が増えてきてくると、あの設計は果たして良かったのか、みたいな思うところがたくさんあるんです。
例えば、正規化が全然されてないテーブル構造があって、ECサイトを作るので、商品ページとかのデータベース、商品のデータベースがあったりするんですよ。
名前は確かDTVプロダクツって言った気がします。DTVはデータテーブルの略ですね。これの別でマスターテーブルでMTVとかあったりした記憶です。
そうDTVプロダクツが、カラム確かで7、80あった気がするんですよ。
普通に商品カテゴリーとか何やら普通に正規化したらもっとカラム減るでしょうって思ったんですけど、最初見たときそれぐらいあって衝撃を受けました。
あとは受注テーブル、オーダーテーブルもものすごいカラム数があって、何でしたっけ、コメントが6個くらいあるんですよ。
マジでやめてくれって思いました。そういう自由なカラムを作ると自由に使うじゃないですか。
フォームの中に何でもいいから備考欄123456ってあると、例えばそこにビジネス上のクリティカルな情報を載せて、それをもう完全に使う前提で運用に載せてしまうみたいなお客さんって本当はいらっしゃるんですよ。
まあですけどあくまで補足として使うコメント欄なので、それを僕らは期待しないんですけど、一方でお客様でもそういう使い方をするっていうのはやはり僕ら自身も考えていかなきゃいけなくて、ECサイト作るのは難しかったし、
ある意味でエンジニアのスキルを上げたいんであれば、1回ECサイトに挑戦するがものすごく良い題材だと僕は思っています。
むっちゃむずいですよ。配送先が複数になったりするとか、カテゴリー何回送するのかとか、
あとあれですね、物理在庫とオンラインの論理在庫のどういうふうに動機を取っていくかとか、その制御とか、同時に注文が入ってしまった場合どうするのとか、
これめっちゃ大変なので、いろいろ考慮するべきことを考えなきゃいけないポイントっていうのが多いということで、僕はECサイトはエンジニアとしてスキルアップしたいんだったらお勧めはしてますが、
かなりエネルギーがかかるかつ複雑度の高いアプリケーションなので、ちょっとずつ作っていくのがいいんじゃないかなと思います。まずはやっぱりログイン画面作るとか、
商品の一覧ページを作るとか、段階的にやっていって最終的に構築して一つのECサイトが、欠陥だらけでも全然いいと思います。
でも一つ作り上げたっていう経験値はすごく生きると思うんで、やっていただければなという感じですね。
ポッドキャストスターアワード2025の告知
はい、ちょっと余談が挟まってしまったんですけど、はい、ではまあぼちぼちここで区切ってエンディングに入りさせていただきたいと思います。
ちょっとですね、緊張して実は思ったより早く終わってしまって、今エンディング何喋ろうかなって考えながら喋っています。
やっぱり人は緊張すると早口になるっていうのは本当その通りで、いや分かってはいたんですけど、これでもゆっくり喋ったつもりが、はいすいません早くなりました。
巻になることに関して多分そんなに埋めは込まれないと思うんでいいでしょう。許してください。
はいエンディングなので告知1個だけさせていただければと思います。
第2回ポッドキャストスターアワードというイベントがこの裏で実は走っておりまして、実はもうエントリー時代は終わってしまってるんですけど、
この9月1日から9月30日の1ヶ月でリスナーさん投票というのが行われております。
これは本当誰でも投票できるものでして、スポティファイにも今回エントリーいただいた番組さんをまとめたプレイリストというのが公開されています。
そのプレイリストからわざと聞いていただいて、一押しの番組これだっていうのがありましたら是非是非1票投じていただければと思います。
その代わり1人1票ですのでそこだけご容赦いただければと思います。
私もですね今月入って早速聞き始めたんですけど、まあ多種多様個性豊かな番組だらけでして聞き始めると無限に時間が溶けるんですね。
仕事ほっぽり出して全部聞きたいだっていうぐらい楽しい番組たくさんあってですね、かつクオリティ本当高いんですよ。
前回優勝したあの夜の農家さんとか、農家でこんな楽しくめちゃくちゃクオリティ高い番組作れるんだって衝撃を受けましたので、皆さん夜の農家さん聞いてみてください。
マジで楽しいですね。ということでとても楽しいイベント、第2回ポップキャストスターアワードってなってますので、皆さんもぜひ参加していただければと思います。
ちなみに僕もスポンサードさせていただいてまして、福祉としてなんか3つぐらいヘッドホンの種類選んでお好きなものをプレゼントしますみたいな感じでスポンサードしてますので、
良ければ是非投票いただいて、押しの番組にヘッドホンをプレゼントいただければなと思います。
リスナーとの交流
他にも健康的なお薬の復唱と、あと餃子の復唱とかあったりしました。
1番はレコーダーですよね。ZOOMのレコーダーが手に入ると。P2、P4とかも手に入るというかプレゼントいただけるっていう感じで、とてもスポンサーが手厚いのでね。
はい、今回第2回力入ってんなーってすごく感じるので、皆さんで盛り上げていただけると嬉しいなと思います。
はい、ではぼちぼちクロージングに行きたいと思います。
この番組面白かったよという方は是非チャンネル登録もお願いします。
もし聞いていて気になることや話して欲しいトピック、感想などございましたら概要欄のフォームやXでハッシュタグウェブ小話でうやいてください。
ウェブはアルファベット、小話は漢字でもひらがなでも大丈夫です。
それではまた雨宿りしに来てください。
今回もお聞きくださりありがとうございました。
雨宿りとウェブの小話、お相手はキースでした。
バイバイ。
今日も喋ってるそこのあなた。
第2回ポッドキャストスターアワード2025開催中です。
雑談でも語りでもゆる配信でもあなたの声応募してみませんか。
対象には10万円ほか豪華特典も。
詳しくはポッドキャスター.jpをご覧ください。
ナンバーワンポッドキャストクリエイターは誰だ。
