#
142
2024/9/30
今日のトレンド

動かすこととAnt Design など

こんにちは、マイクです!今日は2024年10月1日、火曜日ですね。今日の「zenncast」では、Zennでトレンドになっている記事をいくつかご紹介しますよ!

さて、前回ご紹介した記事ですが、今回は触れませんので、さっそく今日の内容に移りましょう。

今日ご紹介する記事は全部で5本です!それでは、早速最初の記事からいってみましょう。

1つ目の記事は「ソースコードを見るより動かしたほうが手っ取り早いとき」です。このドキュメントでは、ソースコードをただ読むだけではなく、実際に動かしてみることの重要性について述べています。プログラムの理解やデバッグ、機能の確認において、コードを実行することで得られる情報が非常に有用だと強調されています。著者は、単にコードを眺めるだけではコンセプトや動作を理解するのが難しいと指摘し、実行することで動作の流れやエラーが発生する場所を直感的に把握できると述べています。具体的な例として、特定のライブラリやフレームワークを使用する際の手順や、動かすことで得られるフィードバックの重要性が挙げられています。理論と実践を組み合わせることで、エンジニアとしてのスキルを向上させることができるとアドバイスされています。

。...。...。...

2つ目の記事は「Ant Designで始める管理画面開発」です。Ubieのデザインエンジニアである著者が、社内管理画面開発にAnt Design(Antd)を採用した経験を共有しています。Ant Designは、React用のUIライブラリで、豊富なコンポーネントが特徴です。著者がAntdを選んだ理由は、特に複雑なフォーム用コンポーネントが充実していること、開発が活発でドキュメントやサンプルが豊富であること、テーマやスタイルの上書きが柔軟であることなどです。また、Antdの最大の利点は、必要な機能が揃っているため、他のライブラリを追加せずに管理画面開発が進められる点です。便利な機能として、GUIを使ってテーマを編集できるTheme Editorや、コンポーネント単位でCSS変数を調整できるComponent Tokenが挙げられます。全体として、Ant Designは機能が充実しており、特に管理画面開発において非常に有用なライブラリであると結論づけています。

。...。...。...

3つ目の記事は「HTMLのselect要素がCSSでカスタマイズ可能になる」です。これまでHTMLの`<select>`要素はブラウザのデフォルトスタイルに依存していたのですが、今後はネイティブの`<select>`要素に柔軟なスタイルを適用できるようになるとのこと。ChromeのCanary版を用いて、具体的なカスタマイズ方法が紹介されています。`appearance: base-select`を適用することで、統一された基本スタイルが適用され、各パーツは要素や疑似要素として割り振られ、CSSを利用してカスタマイズが可能になります。具体的な例として、ChromeやNotionのセレクトボックスを再現するためのHTMLとCSSの例が示されています。カスタマイズ機能はまだフィードバックを募っており、今後の改良が期待されます。このような進展は、エンジニアにとって大きなチャンスですね。

。...。...。...

4つ目の記事は「Jotaiのatomを自由にテストしたいときに見る記事」です。この記事では、Jotaiのatomのテスト方法について詳しく解説されています。公式ドキュメントにはテストに関する情報が薄いため、実際のテスト実装に役立つ内容がまとめられています。ReactアプリにJotaiとVitestを導入する手順が示されており、基本的なテスト方法としてカウンターコンポーネントを例にとり、atomの値が正しく増加するかを確認するテストコードが紹介されています。また、派生atomやアクションatomについても説明があり、複数のatomを組み合わせてテストする方法やカスタムフックを用いたテスト手法も取り上げられています。Jotaiを利用するエンジニアにとって、非常に有用な情報が詰まっています。

。...。...。...

5つ目の記事は「Scala の Wasm バックエンドを実装した」です。Scala.js 1.17.0では、実験的なWasmバックエンドがサポートされるようになり、JSの代わりにWasmモジュールを生成することが可能になりました。Wasmバックエンドを有効にするためには特定の設定を行う必要があり、Node.jsのバージョン22以上が必要です。Wasmの特徴には、ガーベジコレクションや例外処理、JS文字列の組み込みなどがあり、今後の展望にはさらなる最適化や効率的なバーチャルスレッドの実装が含まれています。引き続きScalaのWasm対応が進むことを期待したいですね。

さて、今日はここまででおさらいをしてみましょう。最初に「ソースコードを見るより動かしたほうが手っ取り早いとき」、次に「Ant Designで始める管理画面開発」、続いて「HTMLのselect要素がCSSでカスタマイズ可能になる」、その後「Jotaiのatomを自由にテストしたいときに見る記事」、最後に「Scala の Wasm バックエンドを実装した」という内容をご紹介しました。

次回もまたお会いできるのを楽しみにしています!詳しい内容はショーノートに書いてありますので、ぜひチェックしてくださいね。番組の感想もお待ちしています!それでは、またね!

Related episodes

内容の近いエピソードを推薦しています