Vue.js最速キャッチアップ+📩
「この番組は駆け出しエンジニアの順平と先輩エンジニア海地篠里が送る駆け出しエンジニアを中級エンジニアにレベルアップさせるラジオでございますということで今日ですね私今年からですねVue.jsというやつを使い始めたんですねVue.jsといえば」
「フロントエンドの中のフレームワークでかつてはリアクトなのかビューなのかみたいな議論が巻き起こった後に今はリアクトに王座を取られてしまったであろうフレームワークですねそうですね結構僅差のイメージありますけど取られちゃってますね最近は結構大きな差があるイメージありますけどねマジですか?どうなんだろう?ちょっと調べてみるか」
「なんか多分当初はビューが上回ってて多分ビューが3K出たタイミングで多分結構バグがあってそこでリアクトに追い抜かれたんですよねそうなの?確かそこの問題なのこれって結構最初からいい勝負であったんですけどなんかそこがあってビューの方が勢いあったんですけどリアクトに抜かれて今も変わらずリアクトの方がちょっと上みたいなイメージですね僕は」
「ちなみに日本じゃない情報も含まれてるんであれですけどGoogleの検索によるキーワードの推移で言うとずっと圧倒的にリアクトっすねマジっすかただVue.js確かに日本でいっぱい使われてるイメージあるんで日本に限るとちょっと違うかもしれないなんかOSSインサイト知ってます?サイトを」
「わかんないなんだそれossインサイトで結構なんかossを比較できるいい感じのアレなんですけどうーんちなみに今googleでも日本に絞って検索したんですけどはい2022年に入る前ぐらいまでは結構検索数viewjsが買ったりリアクトが買ったりちょっとviewjsのが優勢かなって感じですねなるほど」
「2021年ぐらいからリアクトがちょっと押し始めて2022年からはリアクトが勝ってますね検索数はOSSインサイトっていうサイトがあってOSSをいろいろ比較OSSそれ自体を見れたりあとは比較できるんですよねこれとこれみたいな感じで比較できたりして今それで」
「ビュージェイエスとリアクトを比較してるんですけど今現在だとスターズヒストリースターの数かビューとリアクトいいねの」
「数そういうことね比較しているとリアクトの方がやっぱり1,100,1,000,10,000,25万ぐらいビューが今23万ぐらい確かに接戦だね1回ほぼ同じだったのが2013年ですねやっぱりどっちも21万7,0008,000とかねここを起点にリアクトに抜かれてますね」
「そうなんだ2021年細かく言うと2022年の12月がほぼ一緒だったんですけど多分ここら辺でなんかビューの方でリリースされたんじゃないかな新しいあれが確か検索の方がでもちょっと先に出るんだね検索ですか検索数の方が先になんか傾向出るなと思って確かに確かに検索だと検索キーワードの回数だと」
「リアクト2022の頭から結構超えてきてるのでそれがスターストーリーに後ほど反映されるんだろうね確かに確かにそっちの方が早そうというフレームワークでございますちなみに僕がエンジニア始めた時は結構アンギュラーも3大フレームワークみたいな感じだったんですけどよく聞く名前でしたね」
「今検索のやつ見た感じはずっとゼロをキープしてますねゼロそれぐらい圧倒的に多分リアクトビュージェスの方が使われてるそんなビュージェス今年使い始めてですねここキャッチアップしとけばなんか早くつかめたなっていうポイントいいっすね最速キャッチアップビュージェスをやっていこうかな面白いいな」
「いやもう僕一回そのビュージェイス解説会一回出したことあったと思うんですけどあったねもうあんま覚えてないですからねなんか基本文法の話してたよねそうですねなんでちょっとここはね視点を変えてビュージェイスをキャッチアップするために何が知れればよかったのかなとかどういう順番で把握していけばよかったのかなっていうのをちょっとやっていこうかなと思ってます分かりやすい助かりますはい」
「ということで歴史的なところを見るとVue.jsとかReactとかってどちらも比較的新しいフレームワークというか一応VueはフレームワークでReactはライブラリって言われてるんですけど歴史的に見るとJQueryとかが多分その前の世代の覇者みたいなイメージがあると思うんですよただJQueryってやっぱDOMを指定してどういう変更するみたいなのを一個一個書いてたんですねドキュメントオブジェクトモデル」
「そうIDで例えば検索してそこの要素の色を変えるためのメソッドを呼ぶみたいなうんうんうんこいつの中の文字を変えるみたいなはいはいはいでこういう何に対して何々をするみたいな命令的な行動とかって言ったりするんですけどうんうんうん」
「一方Vue.jsとかReactもそうですけど宣言的にコードを書くことができるというかVue.jsってJSなのに中にHTMLのテンプレートみたいなのを書けたりするじゃないですか書けますねあれって裏側では本当は何やらなきゃいけないかっていうとはい」
「ドキュメントのDOMの何の要素を指定してそこに対してクリエイトエレメントみたいな感じでこういう要素を作るよみたいなメソッドをバシバシ呼んでいかないとああいうのって作れないんですけどはいはいはいこういうのをHTMLっぽいコードから勝手にやってくれてるみたいなイメージですねうん」
「実はなんかgetElementByIdみたいな要素を取得してきてそうそうそうそうみたいな話ですね元々のJSだとでそこでcreateElementでinnerTextは何々みたいな感じで結構命令的に指定するってなるとめっちゃめんどくさいんですけどめっちゃめんどくさいそれをただ表現したいHTMLの形で書けちゃうみたいなこれが宣言的に書けるってやつですねはいはい」
「どうするじゃなくて何をしたいかで書くみたいなイメージこれがVue.jsの特徴的な部分でもあるともう一個特徴的なのがシングルファイルコンポーネントかなシングルファイルコンポーネントで合ってるかこれ日本語だとあれですね単一ファイルコンポーネント」
「呼ばれてて従来のJQueryの時って多分HTMLはHTMLで書いてCSSは別のファイル作って.cssのファイル作ってJavaScriptもHTMLのスクリプトの下に書くこともあるけど大体の場合はスクリプトタグ使って別のファイル読み込んでみたいなっていう分離をしてたんですけど」
「Vue.jsの特徴的なところはVue.jsを読み込ませてしまえばそのVue.jsのファイル内でHTMLのタグみたいなものを書けるしJSっぽいコードも書けるしCSSっぽいことも書けるしみたいななので1個のファイルで全部できちゃってるよみたいなすごいこれが特徴的なところですね便利なんか結構プログラミングって」
「分けりゃいいんだよみたいなところあるじゃないですかありますねなんですけどそれって別にファイルの種類で分けるんじゃなくて関心ごとで分けた方がいいよねってなった時に例えばこのVue.js特徴的なので結構コンポーネントっていうのが特徴的だと思うんですけどコンポーネントっていうのは小さいパーツをいっぱい作ってそれを組み合わせてウェブページ作るよねみたいなそれの小さいパーツのことをコンポーネントって言うんですけど」
「そのコンポーネントで使ってるタグもHTMLもCSSもJSも関心は同じものに当たってるよねみたいな確かに例えばボタンのコンポーネントだったらボタンのタグになるしボタンのスタイルになるしボタンのJSになりますよねってことはこれ属性は確かに違うけど1個の関心ごとに向いてるんじゃないかってことで1個にまとめちゃった方が楽なんじゃねみたいなそれがさっき言った単一ファイルコンポーネントの考え方ですね」
「はいはいはいもともとはあれですもんねその1ページのウェブサイトの検索バーのところのCSSの部分とかログインボタンとかのCSS当てるやつとかをCSSのファイル内にひとまとめに書いてたんですよねそうそうそうそうそれがなんか分類というか書くものの種類によって分類してたのを」
「じゃなくてボタンごととか検索バーごとにファイルを用意するっていうのが関心ごと関心ごとごとにって言うんですか関心ごとで分割するみたいなイメージですねこれがSFC単一ファイルコンポーネントの基礎となる考え方とSFCはいはいはい」
「この辺は一応前提知識として持っておくと良いかなって感じですねあとはオプションAPIとコンポジションAPIって言ってUJSも実は二通り書き方があるみたいな感じですねやれることはそんなに変わんないんですけどちょっと違うけど基本的にはどっちのAPIを使っても書けるっていう感じですねうんうんうん」
「なるほどっていうのがあるんで検索するときとかは一応今自分がどっちの使ってるんだっけっていうのを把握した上で検索しないとあれこれなんか書き方全然違いますやんっていう事件が起きる結構違うんでしたっけオプションAPIとコンポジションAPIってなんとなくの僕のイメージですけどコンポジションAPIはちょっとリアクトっぽいうん」
「オプションAPIは本当にTheVue.jsトラディショナルなVue.jsって感じますねトラディショナル昔からこうだったよねみたいなVue.jsの書き方上にテンプレートがあって真ん中にJS書くんだけど書く場所が結構決まってて最後はCSS書くみたいななんて言うんでしょうねトラディショナルなVue.jsリアクトっぽいのがコンポジションAPI」
「そうですね寄せてきた説ですかリアクトに寄せてきた説あると思いますよこっちの方が良くねみたいなっていうのが前提としてあった上で知っておいた方がいいことと後回しでいいことを話していこうかなと思いますありがとうございますまず知っておいた方がいいこと」
「これはねそもそもVue.js以前の話なんですけどJavaScriptとかつES6ES2015以降の書き方は文法としてはまずちょっと前提必要かなと思ってます確かにでどうしよっかなこれからいこうかなまずVue.jsやる上で個人的にはここさえ掴めばいいんじゃないかなってのが一個あってうん」
「それがですねリアクティビティってやつですねリアクティビティこれマジでフロントのドキュメント読むと毎回カタカナ多すぎて無事よってなるんですけどそんな難しく考えなくてよいです今回説明したいリアクティビティっていうのはVue.jsの中で言うとデータっていうプロパティとメソッドっていうプロパティいやデータだけでいいなもはやはいはいはいいやメソッドいるなメソッドいるわ」
「メソッドいるメソッドいるわデータとメソッドうんこの2つが僕的にはねVue.jsの本質なんじゃないかなと思ってますほうはいまず前提Vue.jsとかってフロントエンドのフレームワークじゃないですかはいはいはいだからやることってデータを表示することなんですようんで今回言ってたリアクティビティってどんなものかっていうとはいまず表示したいデータがありますとはい」
「そこの値が変わります変わったら変わった値を表示しますこれまでだと」
「毎回それを表示するところとかをちゃんと自分でやらなきゃいけなかったんですけどUJSのすごいところはそこの状態が変わったら勝手にそれが反映されることだと思うんですねなるほどこの勝手に反映される仕組みのことをリアクティブとかリアクティビティとかって言ったりするんですよ反応してるとかそういう意味か多分そうですね再びアクティブになるみたいなリアクティブですねなんで」
「これさえ分かっておけばぶっちゃけなんとかなるなと思うんですよそれを定義するためのまずデータを持たせる部分っていうのがデータっていう部分ですねデータプロパティかなここに例えばカウントとかそういう変数的な情報を入れておきますよとそれを次表示したいですよね」
「で表示したければそれを同じファイル内にあるhtmlのタグのところに書くんですよ書きますねはいうんそしたら表示されますとうんあとはデータの中身さえ変わればいいですよねうんうんうんそうですねなのでデータの中身変えるためにはメソッツっていうところでまあメソッド定義しますとうんそこでそのデータの中身の値を更新するための処理を書きますとうん」
「あとはそのメソッドさえ呼び出されれば状態変わりますよね変わりますなので例えば画面内にボタンとか置いたりとかそしてそのボタンがクリックされた時にそこのメソッドが動くように仕掛けますとそうするとデータの状態が書き換えられて書き換えられたやつが自然と画面に反映されるっていうこれだけやっておけばいいんじゃないかなと思うんですよねなるほどここ押さえておけばなんとなく」
「ここを押さえておけば既存の複雑なコードを読み取るには絶対足りないんですけど新しくVue.jsを学習する上では一旦ここが一番大事かなっていう気がしますね確かに」
「なんかすごい忘れてましたけど話聞いててちょっと思い出してきましたおマジですかありましたね今触ってないんだって今触ってないですよね結構しばらく触ってないですね寂しいですね寂しいですねいやでもそうですねデータプロパティあったなそこに変数で宣言しておいてその変数をメソッツの中で使ってるんでしたっけ」
「HTMLの方で書いてるのかHTML上で表示することが多いかなメソッツで使うこともあるけどメソッツではそのデータを更新する処理を書いておいてHTML側からクリックされたらとかスクロールされたらそれを呼び出すみたいなイベントを仕掛けておくとこれができれば動くウェブサイトが作れます確かに」
「いやいいですね必要最低限のポイントでまずはこの流れを把握するのが大事かなと思いましたそれをやる上でちょっとだけ知らなきゃいけない方法があってまずVue.js僕これ嫌いなポイントでもあるんですけど独自構文多いんですよねそうなんですね独自っていうとJSに比べてってことですかそうそうそうそう特にテンプレートの部分ですねHTMLの」
「あそこってなんかじゃあこれ条件に合わせて出したいよって時になんかV4とかV-ってつきますよねV-なんちゃらかんちゃらみたいな独自公文多くて確かにいっぱいあるしかもそうなのでちょっとそこはさっき言ったなんて言うんでしょううーん」
「さっき言ったリアクティビティのところが分かったら次はその独自構文とかを調べると良いかなという気がしますね覚える必要はないですけど存在は知っておく必要がありますよねありますね特にVIFとかV4みたいな制御構文系とVモデルとかかなあった気がするV小とかV小はVIFとあんま変わんないよね」
「なんかそうですねちょっと1回調べてなんか細かい違いまで把握した記憶があるんですけどそうなんだ正直僕VSHOW使ったことないかもそうですよね基本IFで良かった気がするちょっと曖昧なこと言うと怖いなちょっと使うとき調べてみてくださいとりあえずそういう細かい独自公文があるんですけどなんでちょっと調べ方難しいというかおそらく」
「公式のドキュメント見るのがいいんですがもしやりたいことを言語化できているのであれば例えばデータが特定の条件の時だけこのタグを表示したいとかそういう風に言語化できているのであればチャットGBDとかに投げちゃってもいいかなって思います結構しっかり文法でできますもしあれ書き方違うなと思ったらコンポジションなのかオプションなのかも指定してあげると良いですねうん」
「ブーバーリアクティビティがわかったら次はその独自公文をちょっと調べていこうとはい最後のステップ最後はいはいライフサイクルフックああはいまあちょっと」
「1個じゃない3つ要素あるんですけどライフサイクルフックと算出プロパティとウォッチャーってやつですねはいはいはい懐かしいこの辺はさっきのテンプレートの独自構文の後にこの3つをやっておくといいかなって感じですねそれぞれ簡単に説明するとライフサイクルフックはそのコンポーネントが例えば作られたタイミングで実行されるとかうん」
「完全に画面に表示された後に実行されるとかそういうやつですねはいはいここの辺がちょっとやっぱ難しいですよね実際の開発現場ではあれってなるところな気がするなでもぶっちゃけメソッドとそんな変わんないです実行されるタイミングが違うだけはいはいはいメソッドは例えばイベントが起きた時とかに動くと思うんですけどうん」
「ライフサイクルフックは決まったタイミングで絶対動くみたいな他のオージェフト思考の言語をやってるとしたらコンストラクターとかがイメージつきやすいかなって感じがコンストラクターに近いので例えばボタンを押したらモーダル出てきますよってなるじゃないですかモーダルだったら最初ない状態から作られると思うんですけど」
「作られる瞬間に動くみたいなタイミングを指定できるやつですねうんうんはいはいはい算出プロパティは表示するデータがちょっと複雑な場合に使うほぼデータと同じやつうんこれデータとほぼ同じだと思っちゃっていいかも最初ははいはいはいウォッチャーはいいかウォッチャーはいいわウォッチャーはいいとしましょうライフサイクルフックと算出プロパティやっとけばある程度アプリケーション作れるはず」
「現場だと僕リアクティブになるタイミングっていうんですかねそこで現場のコードだとちょっと複雑だってなった時がよくあった気がする画面ではこのタイミングこれをしたタイミングでこの表示はこう変わってほしいのになんかちょっとリロードしないと変更してくるリアクティブに」
「中身が変わってくれないなとかってなってってなった時にライフサイクルとかそこら辺がちゃんと見なきゃいけないというかデータの変更が反映されるタイミングみたいなところがゲンマのコラボだと結構複雑でパニクったことはあったなという記憶ですね確かちなみに僕その現象起きたことないんですけどどういう時に起きるの?」
「APIフェッチとかそういう系?APIフェッチそれでもNextTick使わないといけない系のやつかなNextTickっていうメソッドみたいなのがあるんでしたっけ組み込みの関数みたいなのがあってレフとかでドムを直接参照してると読み取れないタイミングとかがあるからNextTickで一回待ってあげるみたいなことはするけどNextTick使った」
「記憶はあんまないですけど確かにそのレフの兼ね合いもあった気がするレフだから値を変えられてそれが変わった後に読み込むのか変わる前に読み込むのかみたいなところでプラスそのリアクティブのタイミングによってちょっとうまく期待したものが画面に表示されないなみたいなのがちょこちょこあった気がするそういう時だいたいマウンテッドに書いておけば大丈夫なんじゃないや」
「マウンテッドうわーなんかあったな完全に画面にもHTMLが描画された後に実行されるやつですねはいはいはいそっか確かに保険じゃないですけど最後にこれやってくれって決めておくファイナリーみたいな話なんですかねファイナリーなのかちょっと違うファイナリーなのかなどっちかっていうとドキュメントオンロードだと思ってるんですけど僕的にはドキュメントオンロードはい」
「JSってHTMLとかそっち系いじるじゃないですかだからたまに要素が読み込まれてない状態で実行されるとエラーになったりとかするんですねっていうのを防ぐためにJSって多分素で書いたりJQueryで書いたりするとそのJSのコード自体を即時関数ってやつで囲ったりすると思うんですよそうなんでしたっけドキュメントが全部読み込まれる前に動かないようにするみたいな」
「それに使うのがドキュメントオンロードだったりJQueryだったらダラー括弧ファンクション括弧括弧閉じ並括弧並括弧閉じ括弧丸括弧丸括弧みたいなごちゃごちゃしてよく分からないの書くかもそれに近しいと思ってるただちょっと違うのはドキュメント全体というかJQueryの場合って1ページ丸々レンダリングするじゃないですかはい」
「一方Vue.jsはそのパーツだけとかの読み込み後だったりするんでちょっと厳密にはタイミング違うと思うんですけど雰囲気的にはドキュメントオンロードとかそっち系だと思っているなるほどはいっていうのでVue.jsまず最速で覚えるってなったら今挙げたやつES6の記法を知ってるっていうのはあった上でまずデータとメソッドとそれをテンプレートに書くっていうこのリアクティブな流れ」
「これがまず一番大事その後テンプレートで使う系のV-なんちゃらみたいな独自構文を知っておくその次にライフサイクルフックと算出プロパティあたりをやっておくとある程度ウェブサイト作れるんじゃないかなって気がします表面上はもちろんもっともっと豊かなサイトを作るってなった時にはいろいろさらに知る必要あると思うんですが」
「とりあえずはこの辺やっておけば大丈夫かなとそしてこれはマジで後回しでいいだろうっていうシリーズその1ルーティング多分学習するときって一番大事なのって一気にいろいろやりすぎないことだと思うんですよ一気にいろいろやるとパンクしてちょっとずつ進んでいくみたいな全体がみたいなのってあんまり良くないかなと思ってて全然覚えられないですねそう」
「なので今なんかいい例え出そうだったな消しゴムあるじゃないですか消しゴムを早くなくすのを目的だと思ってくださいはいはい一気にいろいろやろうとするのって消しゴムを本当に平行に地面に当てて削っていくみたいなイメージだと思うんですよね本当に長方形をキープしたまんま小さくなっていくみたいなうんうん」
「一方大事なところだけポイントでやっていけば角から消していくみたいなはいはいはい角を使ってそしたらなんか削れいいじゃないですか角を消しやすいですよね削れるの早いじゃないですか角って話いうことにはい」
「でも角削ると消しゴムの形がなんか先ちょ丸くなって丸くなります丸いと丸いでまたそれが多分平面丸ごとつけるより早く削れるじゃないですか消せますねはい勉強多分それと同じですね消しゴム消しゴムが消えるスピードうんうん」
「大丈夫かなこれ大丈夫です大丈夫ですわかりやすいですという意味で消しゴムを角を作る必要があるんですよさっき説明したのが角これから説明するのが角じゃないなんか大事じゃない場所というか後回しでいいやつその1ルーティングルーティングはいルーティングはねSPA作るなら必要っちゃ必要なんですけど」
「そこを覚える前にまずはさっきのやつを学んだ方がいいんじゃないかなという気がしてますカトからですねその2ビューXビューX状態管理ですねビュージェイス勉強するってなったら状態管理はビューXっしょみたいな感じで出てくるんですよただ」
「別にこれなくても状態管理できるっちゃできるさっきのデータプロパティも要は状態管理なのでVueXってもっと大規模なアプリケーション作るってなった時に必要なやつなんですよなのでまず基礎を覚えている段階でVueXはやらなくていいかなと思ってますそしてその3TypeScript」
「タイプスクリプトTSもしタイプスクリプトをマスターしてるのであれば別にそもそもやんなくていいし知ってないのであればVue.jsと同時にやるのはあんまりおすすめしない悩まなきゃいけないポイントが増えるんで後回していいかなっていう」
「なるほど確かにちょっと分かってなかったな同時に行ったんで僕はマジ切り分けがよくわかんなくなっちゃってましたね最初にそれを一気にやるとこれppsの問題かそれともこれbjsの問題かそもそもどこまでがどっちの書き方なんだみたいななんかいらなくていい悩みが発生しちゃうんですよねうん」
「なのでタイプスクリプトとかも後でいいかなっていうもしくは先でいいかなっていうそうですね同時じゃない方がそうそうそうそうあともう一個最近フロントエンド界隈だとよく上がるSSRとかそっち系ですねサーバーサイドレンダリングSPAとかってあると思うんですけどSPAって全部フロント側でルーティングとかページ切り替えもやっちゃうやつなんですけど」
「それだとSEO弱いよねとか最初のレンダリング重いよねってことでSSRに回帰してリアクトとかUGSだと出てきてると思うんですけどこれもぶっちゃけパフォーマンスとかSEOの話なんで今気にしなくていい最初のキャッチアップでは全く気にしなくていいかなっていう感じですかねこの辺を削ぎ落とした上でさっき知っておいた方がいいこと」
「ノキトだけを使って動くページを作るっていうのがUJSの本質を掴むのに一番いいんじゃないかなという感覚でした実際触ってみてわかりやすいすごいありがとうございますまとまってますね僕はオプションの方で触ってるんでコンポジションAPIの方はもしかしたら別のやつがあるかもしれないけどちょっとそっちはわかんないのでご勘弁ということでうんうんうん」
「なるほどオプションだからトラディショナルな方ですねそうですはいはいはいというので今年VUJS触ってみてキャッチアップする時にここ掴めばよかったんかっていう優先順位が見えたのでなんとなくそれを発表してみた感じでしたいやー取っ掛かりやすくなりましたいい感じですありがとうございます」
「次また触るとき純平はもうとっかかり5弾ですけどねいやーでもほぼほぼ忘れちゃったんでマジかすぐ忘れちゃうんですよね大丈夫大丈夫そういうもんだからまたやればそこら辺の角からやってきますまたありがとうございましたではラストお便りいきますか」
「じゃあちょっとここからはお便りいきますはいお願いします7月頭にもらっててちょっと遅くなっちゃってすいませんなんですがすいませんラジオネームカリナさんからキャリナさんかもしれないですねキャリナさんキャリナさんですねなるほどどうしようかな先に感想からいきますか感想からいきましょう自分は18からインターンアルバイトでウェブアプリ開発を始めて終始でロボット系の研究にハマり現在は」
「自動運転系のロボットエンジニアとしてソフトウェアを書いてますドイツ在住最近業務中にバックグラウンドとしてポッドキャストを聞いていますウェブは最近書いてなかったのですが趣味で彼女メカニカルエンジニアと作っている自動運転ロボットのUIを皆さんの影響もあってリアクトで書くことにしました久しぶりにリアクトとウェブソケットを触れて楽しんでます皆さんおすすめの新しい」
「おすすめの新しめな楽しい技術を教えてほしいです毎週楽しみにしてますちょっと情報量が多いすごいありがとうございますなんかすごいイケイケな気配感じますけど18からインターンこいつでなんかいい感じのロボット開発してるんですかそういうことですよねでウェブは書いていたことはあって趣味で彼女をメカニカルエンジニアと作っている自動運転ロボットを」
「彼女っていうのは普通に彼女ですよねそうですね海外在住のエンジニアカップルの方からいただいたという感じですねメカニカルエンジニア何するんだろうねこういうの自動運転ロボットのUIを皆さんの影響で自動運転系とかを書いてるすごそう自動運転ロボットのUIは本当にイメージだとあれですよね多分ガストとかさ」
「運んでくるロボットいるじゃないですかペッパー君みたいなやつとかそうそうそうそうあれ系の表示されてる部分とかリアクトとかで作ってんのかな確かに自動運転ロボットロボットかそんな感じだろうねペッパー君みたいなちなみにじゅんぺい君はおすすめの新しめな楽しい技術ありますかやばいなやばいなおすすめの新しめな楽しい技術はい」
「興味あるやつでもいいですよやっぱチャットGPTですかいやーそうなんですよね僕ちょっとAI系がちょっと興味あるなと思っていてまあまあ仕事で今AI系なのでそれもあってオープンAIもそうなんですけどクラウドっていうAIもあるじゃないですかクラウドAIクロードAIかな」
「クロードAIのちょっと精度とかも結構えぐいみたいな聞くじゃないですかそうなんだそうなんですよね結構なんか実質の能力で言うとオープンAIを超えてるみたいな話があってで今いくつなんだろ3.5とかなのかなクロード3.5とかなのかななんか元々そのオープンAI立ち上げ当初にいた兄弟だったかな結構主要メンバーがいるんですけどそこはその2人が」
「オープンAIを抜けてクロードを立ち上げたんですよねそうなんだっていう話もあってオープンAIやばいんじゃないぐらいの脅威を持ってるクロードAIとかはちょっと興味あったりしますねそういう感じになっちゃうなありがとうございますノリさんはありますか」
「僕はですねあんまりこうなんて言うんでしょう新しい技術技術単体にあんま楽しさを覚えることあんまりないんでどっちかっていうとその技術使ってこういうことをやってみたみたいなのが興味あるっちゃあるんですけど最近触ってる新しい技術だとラスト言語を触ってるって感じですかねあれはまあ」
「マニアックな楽しさなんですけど他の言語だとこういう場所全く気にしてなかったけどこういうのをやらなきゃいけないんだってので学びが多くてちょっと楽しいなって思ってましたなんかすごい難しいっていう話を前にした気がしますけどどうなんですか実際やっぱり難しいですねこれ何?みたいなの出てくるもん言ってることは分かったけどじゃあこれなんで嬉しいのか分かんないみたいな」
「とかは結構ありますねなるほど前がのりさんにちょっと人類には早すぎた言語みたいなことを言ってた気がしてそうね僕もそれどっかから聞いたのを受け流してるだけなんですけどでもね言うてどうなんだろうCとかよりは全然わかりやすいんじゃないかな思ってるよりって感じなんですねうんわかんないCまず触ったことないんであれですけどはいはい」
「そんな感じですかね新しい技術ちょっと興味ある楽しめなやつはそんな感じでポッドキャストで話してほしいこと」
「ウェブ以外のソフトウェアで興味のある分野について話してるのを聞いてみたいですとのことですウェブ以外難しいなこれもなんだろうなウェブ以外のソフトウェアで興味のある分野っていうかまず知らないっていうのがちょっと申し訳ないことに大きいんですけどなんでCって言うなら僕はやっぱり組み込み系とかはなんでしょうね」
「興味あるって言ったらちょっとあれですけどあれですか春平あれだもんね白米めっちゃ好きって言ってたから炊飯器の組み込みプログラミングとか多分作りたいんだよね作りたいですねすごい作りたいなんでしょうね炊飯器のやっぱねあるよね中のお米の具合をセンサーで測ってとかはい」
「条件分岐の機械みたいなIoTがやっぱ来てると思うんでスマホのアプリと連動して遠隔で炊飯器のボタン押せるみたいなあんまいらなそうですけど」
「組み込み系とかの技術って全然分かんないですけどそんなに難しそうじゃないですかうんけど食いっパグれそうな気はしないなと思ってそっちでいくにしても常に需要はあり続ける一定はと思っているのでなんか一回経験としてやってみるのはありかなっていう風に思ってたりは」
「してますねなるほどね多分難しさの質が違いそうだなまあまあ確かに多分組込み系ってさ多分ウェブとかよりおそらくコードのロジックとかはシンプルだと思うんですけど一方バグがあったら直せないっていう確かにそういう問題があるからなんかテスト工程とかやばそうだよね」
「そうですよね確かにな今時オンラインで買えれるのかなそういうのってインターネットと繋がってるし繋がってるやつなら行けそうですけどねうーんお店の炊飯器は絶対無理だないや無理ですねだから確かにバグとかあったらあれですよねリコールみたいな話ですもんねなかなかえぐいな確かに怖っていう感じで僕はそのぐらいになっちゃうんですけどのりさんいかがですか」
「そうですねウェブ以外で興味あるところだとちょっとこれも順平ほどウェブから飛び出ないんですけど最近さ色んなツールがラストで書き換えられてるじゃないですかそうなんですねラスト製のブラウザですとかラスト製のなんちゃらですみたいなツールがいっぱい出てきてて既存のあるツールをラストで書き換えたことによってすごい高速で動くみたいなそういうインストールする系のデスクトップアプリケーションですかね」
「それ系が多いイメージあって僕が今使ってるGitUIっていうTUIツールがあるんですよターミナルで使うUIのツールGUIとターミナルの間ぐらいのツールなんですけどそうですよね今どういうことだろうと思いましたターミナルで使うUIのツールって思って見たら分かるターミナル上でGUIを表現してるみたいな感じで」
「そのGitUIというのを使ってるんですけどそれがラスト性なんですねなんとなく個人の感覚だとたまにちょっとバグるイメージがあって今プッシュできないんですよ僕えぐいっすねそれが解決できないんですねだからちょっとラストできるようになったらそういう系のやつ見てみたいなとは思ってます」
「ラストって何ですかその速さは結構売りなんですか売りですね5とかじゃないんですね結構速いのって俺5のイメージあったんですけどどっちが速いか知らんすけどラストはねCあるじゃないですかC言語って速いんですよそうなんですねただ色々できてしまうが故に危険なコードも書けるというかうんうんうん」
「っていうなんか危険なコードを書けないようになんか安全にしてくれてるよみたいなイメージですねラストはへーだからラストも早いなるほどうんコンパイルする前にコンパイラーで結構いろいろチェックしてくれてるんですよしかもうんうんうんコンパイラーの段階でチェックすると実行時は気にしなくていいので確かにより早くなるどっちがいいんだろうね今ちょっと調べてみようかなえーと今」
「ちょっと記事調べた感じだと5の方がやや早いかもでもほぼ同じぐらい場合によりそう作るものとか得意なケースと苦手なケースがありそうな感じするけどまあどっちも早いまあそうっすよね今後出てくるものって基本なんか速さ勝負ですよねうんまあ書きやすさもあるっちゃありますけどフロントエンドとかもさウェブアセンブリとか」
「ラストとかも確かWebアセンブリにビルドできるはずなのでそういう意味でもラストはちょっと熱いかもしれない今後触ってみる言語としてありですね選択肢として確かに結構勉強になりますよラストを触る人たちをラスタシアンって言うらしいですラスタシアンラスターじゃないんだ」
「ラスタシアンって言ってラスタシアンなんだっていうので僕は最近興味あるウェブ以外のところだとそういうデスクトップアプリケーションラスト性で書き換えてますみたいなやつにちょっと携われたら面白いなって思ってますあーいいっすねそれこそOSSとかOSSもそうで興味ありますね結構自分が使ってるツールだからより興味あるというかですよねプッシュできないってなかなかだもんな」
「あれ何なんだろうなマジであれプッシュできないはえぐいですねそれ使わなきゃ別にできるんですよねまあそれ使わなきゃできるんだよね直したいですねそれは直したいそんな感じですかね今日はちょっとカイチさん不在なので2人だけですがはいカリナさんお便りありがとうございましたありがとうございます参考というかちょっと楽しんでもらえたらいいなと思いますはい」
「じゃあもう最後サクッと挨拶して終わりにしますかはいじゃあハッシュタグひまじんプログラマーでSNSXなどで今日は何ですかねハッシュタグビューはここを押さえとけみたいなハッシュタグニッチすぎるとかねこういうのもティップスだよみたいなところがあればね共有してもらえれば嬉しいなと」
「確かにこれもやっぱ大事だったよねとか抜けてる可能性はあるんで今回激絞りをしてるんですけど確かにコンポジションAPIとかのそっちの方とかでも全然今日話してないですからなんかあれば」
「いいなと思いますあとは説明欄概要欄の方にGoogleフォームメールアドレスなどがありますので質問感想何でもどしどしもらえればと思いますお願いします各種SNSポッドキャストいいねフォローしてもらえると飛んで喜びます」
「飛んでることになりますあと動画もアップしようかな動画Xでね僕が飛んでる動画がアップされるのでぜひフォローいいねお願いします楽しみはいって感じで今日は終わりこのくらいですかねはいそうですねBJS最速キャッチアップでした最速キャッチアップありがとうございましたはいではまた次回バイバイこのキーボードは一生ものハッピーハッキングキーボード公式LINEスタンプ販売開始」
