EY-Office ブログ

前々回のブログ で、「Astro4.0のIncremental Content Caching (Experimental)を試したけど、わずかにしか早くならなかった」と書きました。その原因は、この機能はAstro V2で導入されたコンテンツコレクション（Content Collections）に依存しているからでした…

コンピューター関連の良書を出版しているオライリーから来春に出版される Fluent React のアーリーリリースが、現在10日間無料で読めます❗Fluent Reactは、Reactバージョン18の機能や内部構造、SSR/useTransitionなどの最新のトピックに付いて詳しく書かれた、React中級者向けの書籍…

先週 ホームページ構築ツールのAstroをバージョン3.6に更新しました というブログを書いたら、その日に Astro 4.0 がリリースされました❗3.6にアップデートしておいて良かった・・・😃Astro 4.0は、The Astro Dev ToolbarInternationalization (i18n) r…

このブログを含むEY-Officeホームページは、Static Site GenerationツールAstroを使っています。 関連ブログ → EY-OfficeホームページのAstro化を進めています、【速報】Astroは遅くなかった！ 悪いのは私でした・・・ 。実はAstroのバージョンはAstroに置き換えた時点…

Reactを生み出したFacebookが作ったReactプロジェクト作成ツールcreate-react-appのバージョンアップがほぼ止まった現在、Next.jsのcreate-next-appはReactプロジェクト作成ツールの有力候補です。以前の私は、どちらかというと Vite 推しでした。しかし、現時点や少し先を…

最近、スタートアップが鍵：人口5000万人に減っても2倍豊かな「日本4.0」を作る という記事が話題になってるようです。この記事は Coral Capital というベンチャーキャピタルのブログに書かれています、私も読んでいろいろと思うことがあったのでブログを書いてみました。スタートアップが鍵：人口5000万人に減って…

私も多くのソフトウェア開発者と同様に🦁ライオンの人にインスパイアされ、20年近くもテストを書いています。RSpecも初期の頃から使っていますが、最近になって大きな勘違いをしていた事に気がつきました。beforeEach in test code is for it and not describe Stable Di…

以前 Reactの新しいドキュメントreact.devは期待大です というブログを書きましたが、少し前に 日本語版のreact.dev がオープンしました。おめでとうございます！🎉🎉🎉そして、日本語ページ制作に関わった方々に感謝いたします。react.dev Stable Diffusion(mage.space…

安いWindows環境も求めて(2) Windows Azure の続きです。私の望むWindows環境をAzureでローコストに運用する方法の結論がでました。結論は仮想マシン（VM）のディスクのスナップショットのみを保存し、Windows環境が必要になったら、スナップショット → ディスク → 仮想マシンの手順で、仮…

安いWindows環境も求めて(1) Windows Azure の続きです。前回のブログを書きながら、ゲストOS(Windows)のシャットダウンと管理画面(Azure portal)の停止ボタンで課金が違うことに気がつきました。そこで 停止済み (割り当て解除) を試してみました。LookingforacheapW…

私は、開発等の仕事ではM2Pro Mac miniを使っていています。Macでの開発はまったく問題ないのですが、教育の仕事で時々Windows環境が必要になることがあります。大手企業やSIer系のお客様はWindowsを使っていることが多いです。ReactもRuby on RailsのWindowsで動きますが、たまに…

約1年前に書いたブログ ”〜〜アプリ”はもう利用できません と同様に自分専用アプリWebArchivesがもう利用できませんになってしまいました。開発ライセンスでデプロイしたアプリは有効期限が1年なので、デプロイしてから1年経つとアラートが表示され使えなくなります。解決方法は、再度コンパイルしデプロイすることです。早速…

初心者にプログラミングの研修を行うときは「エラーメッセージをちゃんと読みましょう。エラーメッセージは正しく間違いの指摘はしてくれませんが、間違い解決のヒントを与えてくれます」と話し、わざと間違ったコードを書いてもらいエラーメッセージの読み方を教えています。私自身は長年プログラマーをしているので、大抵のエラーメッセージは…

ChatGPTの登場に焦っている開発者のAI関連ブログ、第3弾記事です。過去に いまさらながら『ゼロから作るDeep Learning』を読んだ でディープラーニングの基本をPython(NumPy)のコード演習も交え学びました。そしてゼロから作るDeep Learning ❷を読んで頭が爆発した... で自然言語処理…

先週のZenStackはドキュメントは最悪だが良いライブラリーかもしれないに書いたようにZenStackは素晴らしいライブラリーなので、もう少し学んでみました。前回のアプリではZenStackの重要な機能であるZmodelは、ほとんど使っていませんでした。そこで今回はGet Started With Next.jsの例…

先々週の Next.jsのReact Server Componentsを試してみた を書くために色々と調べていたときに ZenStack というライブラリーを見つけました。このブログが初の日本語の記事かもしれません。😃ZenStackを使うとReact Server Componentsや Rimix(本ブログ) …

久しぶりに入力欄がたくさん並んでいる登録フォームをReactで作る事にになりました。少し前であれば、こういう場合はReact Hook Formやformik、react-final-formなどを使っていました。しかし今回の案件で使うべき理由が見当たりませんでした。Astro AIいらすとやが生成した画像ですReac…

React Server Components(RSC)はReact v18.0の目玉機能ですが今のところ実験的な機能です。React開発チームからリリースされた派手な機能はありませんが、Next.jsやHydrogen等で開発が進められています。今回Next.js 13.4でリリースされたApp RouterにRea…

Rails 7.0でフロントエンド(JavaScript)周りが一新されたという噂は聞いていたのですが、やっと数日前から勉強してみました。日本語の詳しい記事はなくて直ぐにはわかりませんでしたが、大前提としてRails 7.0で一新されたフロントエンド全体をHotwireと呼ぶようですHotwireには以下の2(3)つの…

暑い日が続きますね、夏バテしそうなので今回は軽い内容にしました。😅6月末にM2Pro Mac miniに変更したブログを書きましたが、1ヶ月以上使ってみましたので感想を書いてみます。結論としては大満足です。M2 Mac miniM2Pro Mac miniの良いところ早いMac miniの前に使っていたiMacとの速…

週末にプログラマー脳 ～優れたプログラマーになるための認知科学に基づくアプローチを読みました。私は長年プログラミング教育を行っていますが、この本が10年前に読めたら良かったなと思いました。教育を行うなかで、感覚的に感じていた事を、認知科学をベースに分析・考察されています。この本にかかれている概念や用語がプログラミング教…

ベテランのプログラマーは自分なりのコーディングスタイルやコードの美学を持っていると思いますが、まだ初心者の方やチームで開発する場合は基準になるコーディングスタイルガイドがると助かると思います。たとえばGoogle Style Guidesにはいくつかのプログラミング言語のスタイルガイドが書かれています。少し前のReac…

現在、ある仕事でSequelizeというNode.js用のORM(Object-relational mapping)を使っています。現在Node.jsまわりではPrismaというORMが人気なようですが、npm trendsを見ると現時点でもSequelizeの方がダウンロード数が多いようです。今回はじめてSeque…

今回は軽い記事を2つ書きます。1つ目は、いまさらながら『ゼロから作るDeep Learning』を読んだに続きゼロから作るDeep Learning ❷―自然言語処理編を読んだ感想を書きます。2つ目は、Reactアプリ内で環境変数を使う方法が以前の標準Create React Appと最近の流行Viteを使った開発環境…

以前、AWS Cognitoを試してみたが今回は見送ったという記事を書きましたが、最近も別のシステムでCognitoの検討を行いました。今回のシステムはすでにRDBにユーザー管理テーブルを持ちユーザー管理を行っているので、ユーザー管理テーブルからCognitoへの移行手段も考えなければいけません。Amazon Cogn…

先週の開発マシンをMac mimi変更記事の続きです。以前使っていたiMacは音が良かったです、普通に音楽を聴いていて問題ないです。その前に使っていたMacBook Proも小さなスピーカーながら私には十分なオーディオでした。ところがMac miniのスピーカーはペラペラな音です！ ひどい音です。😅PC audio …

メインの開発マシンを2019年製21インチiMacから最新のM2Pro Mac miniに変更しました。セットアップもほぼ終了し、このブログもMac miniで書いています。モニターが変わったのでまだ完全には慣れてませんが、アプリの動きがキビキビしていて気持ちいいですね。しかし、セットアップ段階でMac OSのクリーン…

少し前にテスト環境やテストコードの書き方の書き方に付いてのブログを書きましたが、最近あるアプリのUIテストを書いていました。一般論として、テストがあるとリファクタリング)を行った直ぐ後にコードの動作を確認でき、テストを書いておく事でリファクタリングしやすくなります。しかし今回気が付いた事は、コード（コンポーネント）がほ…

以前 React用Infinite Scroll（無限スクロール）ライブラリーを調べてみたという記事を書きましたが、今回UIコンポーネントのテストを書いていて[react-infinite-scroller](https://github.com/danbovey/react-infinite-scroller)を使う…

現在あるReactプロジェクトでコンポーネントのUIテストを書いていますが、思わぬところでハマり焦りました。以前JestまたはVitestとReact Testing LibraryでReactテスト環境の構築を書きましたが、サンプルアプリと本物のコードには、いろいろな違いがありテストも複雑になってしまいます。Astr…

今回はQwikの解説編です。まずは前回の復習ですが、Qwikは高速なWebアプリを構築できるフレームワークですQwikはReactの技術（JSX, Props, State, Hooks）が使われていて移行が容易そうですQwikのコードには$の付く特殊な関数が使われていますQwikSPAの欠点ReactやVueのような…

最近Qwikというフロントエンド・フレームワークの話題を目ににするようになってきました。ただしqwikをGoogleで検索すると、フロントエンド・フレームワークQwikの記事は2ページ目くらいで無くなってしまうくらいの量しかありません。新しいフロントエンド・フレームワークは次々と登場してきますが、SPA(single-…

空前のChatGPTブームですね！ このブログでは初めてのAI関連の記事です、ただしChatGPTではなく、数年間にわたり積ん読されていたゼロから作るDeep Learningをこの連休で読んだので感想を書きます。この本が出版された2017年は、DeepMind社の作ったAlphaGoが人間の凄いプロ棋士に勝ったことで…

前回のブログにReact Testing Libraryを使ったコンポーネントのUIテストを取り上げましたが、そこに至る前にReactのUIテスト環境作りで少し悩んだので、その事を書きます。vite-vitest_react DeepAIが生成した画像ですcreate-react-app の開発が止まってしまった・・・…

ある仕事のReactプロジェクトでJest + React Testing Libraryを使いコンポーネントのUIテストを書いていて、なぜかWAI-ARIA (Web Accessibility Initiative - Accessible Rich Internet Applications)を学ぶことになりまし…

EY-OfficeサイトのAstro化も終わり、すでににAstro版に置きかわりました。🎉実は公開寸前にブログのRSSフィードが無いことに気が付きました。最近はRSSはマイナーな存在かもしれませんが、私自身も使っていますし、昔からインターネットを使っていた人達は使っているかも知れませんね。調べてみるとAstroにもR…

小ネタです、JavaScriptで本日の日付をYYYY-MM-DD形式で得るコードは案外面倒です。本日2023年4月17日なら 2023-04-17 という文字列を得るコードはRubyならTime.now.strftime("%Y-%m-%d")、Pythonならdatetime.today().strftime("%…

昨日Astroはブログページ生成が遅いぞ ???というブログを書きましたが、その後コードを見直したところ遅い原因に気が付きました。そして修正したところ、たった11秒でビルドできるようになりました。❗❗I think the software called Astro is great DeepAIが生成した画像ですビル…

先週のブログで書いたように、このブログを含むEY-OfficeホームページのAstro化がほぼ出来たのですが、なんとビルド時間が14分もかかりました。🥺このブログを書くのにAstro版を使っていますが、最終レイアウトでプレビューしながらブログが書けるのは凄く快適です。（まだAstro版は完成してないので、最終サイト構…

以前 ブログのようなWebサイトを構築するにはAstroが良いかも というブログを書きましたが、中で『EY-OfficeのサイトをJekyllからAstroへの乗り換えは出来そうな気がします』と書きましたが、先週週末に着手しました。ブログのようなWebサイトを構築するにはAstroが良いかも の中ではブログの部分を中心…

Reactの新しいドキュメントhttps://react.devが登場しました❗まだ日本語ページはありませんが・・・興味があったので Quick Startを読んでみました、結論としては良いドキュメントだと思います。早く日本語ページもできると良いですね。React.dev https://react.dev より従来…

最近関わっているReactアプリでは良くあるようにAPIサーバーと通信しています。アプリの開発が進み扱うAPIの数も増えて来ると、APIが戻すエラーコードの処理で困るようになってきました。エラーの種類によっては処理や表示を変えないといけませんが、初期のコードではAPIサーバーのコードを読まないとアプリのエラー処理が書け…

フロントエンドの開発にはたくさんの有用なnpmパッケージを利用していると思います。npmパッケージのインストール等に使うパッケージマネージャーには何を使っていますか？npmでしょうか、それともyarnでしょうか。私はnpmを使っていますが、最近pnpmを知りました。とても興味深いパッケージマネージャーなので紹介したいと…

以前書いたReact用ステート管理2020 〜Recoilを試してみました〜の時点で、主なReact用ステート管理方法にはReactのuseStateのみを使う元祖ReduxRedux ToolkitReactのuseReducerとContextを使うMobXRecoilXstateなどがありました、元祖Redux以…

以前Reactの研修を受けて頂いた企業向けに、現在Reactプロダクトの開発支援を行っています。そこで、出た問題が実はReactの深い問題に触れていたので、解説記事を書きます。uncontrolled to controlled DALL·Eで生成したuncontrolled to controlledの画像現象問題…

Tailwind CSSの良さが少しわかった気がしたの続きです。前回は対応できなかったレスポンシブ・デザインやダークモードに対応してみました。Tailwind CSSレスポンシブ・デザイン先週時点でのアプリをiPhoneで表示すると以下のように、タブの幅が小さかったり左右の余白が大きすぎて対戦結果の表示が縦になってしま…

少し前から Tailwind CSS が話題になっているようです。しかし数年前にTailwind CSSの記事を読んださいに、MUI（以前はMaterial UIと呼ばれていました）で見栄えの良いボタンはボタンと書けば済むのに、Tailwind CSSではボタンなどと長々と書かなければいけないを知り。これはUIデザイン…

仕事でサンプルコードを書いていて、2つのReactアプリのプロジェクトでコードを共有したくなりました。あれ、どうするのが良いのかな？　と思いながらいろいろと試してみました。npm DALL·Eで生成したlocal npm packageの画像今回のコードa-projectとb-projectというReactアプリのプ…

ソフトウェアを設計するときには何らかの設計図を書くと思います。UML、ER図、データフロー図 ・・・などでしょうか？私も新機にシステムを作る場合や既存アプリの大規模改修時などには設計図を書きます。よく書くのは、UMLのユースケース図、データーベース設計用にER図、場合によってはUMLのコンポーネント図、アクティビティ図…

React Nativeの記事（1/2 、2/2、おまけ）は以前にも書きましたが、今回はMigrating our Largest Mobile App to React Nativeというブログを読んだ感想を書きます。記事のタイトルから判るように、ネイティブ・アプリからReact Nativeに書き換えたということで…

前回に続き新年のブログに書いた本を読む件ですが、Kindle Paperwhite (8GB) 6.8インチディスプレイ を買いました。やはり読書にはiPadではなく読書しか出来ないKindleだろうと思い、エイヤーと買ってしましたました。Kindle新しいKindle良いね！新年のブログに書いたように以前Kindle…

新年のブログに書いたように、今年は本を読み勉強したいと思っています。そこでお正月休みに読んだ技術評論社 WEB+DB PRESS Vol.13の**イミュータブルデータモデルで始める実践データモデリング**の読書メモを書いておきます。WEB+DB Press 130 技術評論社 WEB+DB PRESS Vol.13…

新年明けましておめでとうございます、本年もEY-Officeをよろしくお願いいたします。今年のお正月は三が日で終わった感じがありますので、昨年の振り返りと今年に付いて考えてみました。20232022年の振り返り昨年書いたブログを中心に振り返ってみました。リスキリング教育一昨年末から昨年始めに書けて某大企業でリスキリング…