書いた契機 GitHub Actions上でテストを実行する際に、使い捨てのデータベースにアクセスしたいと思いドキュメントを読んでいた。 docs.github.com これを読んでいて「コンテナーからサービスコンテナにアクセスするのと、ランナーマシンからサービスコンテ…

タイトルで釣るの嫌なので結論をタイトルに書きました。 筆者の前提 募集ツイート なんでツイートで募集したのか 募集した結果 その後 筆者の前提 職業: 個人事業主のソフトウェアエンジニア (主にWebアプリケーション、フロントエンド) ポジション: 設計し…

下北沢で買った服を身にまとうMr_ozin 趣味 映画 今年は「ガーディアンズ・オブ・ギャラクシー:VOLUME 3」が有終の美を迎えてとにかく楽しかった。ジェームズ・ガンもMCUから卒業し、シリーズ自体も最後、つまみ者同士の卒業映画として完璧。 MCUがどんどん…

ライブラリの公式ドキュメントの細かいところを読んで手元のコードを直していると、ふと「特定ライブラリに依存したことしかできるようになっていないのでは?」と思う。 じゃあライブラリを一切依存しないのは難しい。簡単なものならできるかもしれないが、…

選定経由 Keychron Q1 HHKBを6年近く使っていて、壊れる予感も全く無かったが、それだけ使っているとマンネリを感じてしまう。 スペースキーを押した時の「ジャカジャカ」した鳴りが気になってきた。構造上仕方ないとは言え、タイピングが強めなので気になっ…

いつ本名がバレたのか Meta 社がサービスを開始した Threads のアカウントを取得し、ツイートした段階 Threads登録した mr_ozin だよ 本名出てるけど勘のいい人にはバレているし仕方ないよね— おじんさん (@Mr_ozin) 2023年7月6日 なぜ本名がバレたのか Inst…

なんで胃カメラを飲むことになったのか 近親者に胃癌の人が居たため。 胃カメラを飲む前には血液検査(ABC 検診)でピロリ菌に感染しているか調べていました。 幸いにもこの検診は陰性でしたが、近親者に胃癌の人が居たので安心のために胃カメラやろっか、とい…

筆者情報 今年からフリーランスとしてフロントエンドエンジニアをやっています。仕事では React + Redux Toolkit + TypeScript というごく普通の技術スタックです。 前職は受託開発会社で色々やっていましたが、直近1年はWordPressを触っていました。 Cloudf…

参画する前の状態 Web フロントエンド(主に React + TypeScript)を趣味で 2 年ぐらい触っていたけど、実務としてフロントエンドをがっつり触る案件に恵まれなかったという状況でした。 受託開発会社でWeb エンジニアとして 3 年ぐらい働いていましたが、どっ…

お断り これは自分がフリーランスエンジニア(個人事業主)として開業するために行った役所の手続きの記録です。案件の獲得のノウハウはありません。 概ねの場合、これで充分だと思いますが、不安なら市役所の窓口に聞けばだいたい教えてくれます。そこで確認…

Hasta la vista, baby 退職エントリーです。 2022/07/31 をもって 3年4ヶ月勤めた受託開発の会社を退職しました。 こういう内容を長々書くのはいかがなものか、という意見もありますが、他の人の退職エントリーを読んでて自分も転職の意思が言語化された経由…

概略 7 月末で 3 年間勤めた受託開発会社を辞めることにしました。 退職理由としては「実務上の開発経験がほとんど詰めず、雑用業務ばかりで、今後もそういうのに関われる可能性が低いため」です。 自分自身は Web 技術が好きで、特にフロントエンドの領域を…

Mr_ozin with Aeron Chair 感想 まだ2日しか使っていませんが、ゲーミングチェアを使っていた時の「ある程度座っていると腰の疲れが溜まって休憩したくなる」というのが無くなって、疲れが溜まらず、ずっと座っていられます。 座面のフレームがガッチリして…

取り組んだものは下記です。 notion.yumemi.co.jp 応募する予定はありませんが、フロントエンドの素振りの課題としては面白そうと思って取り組んでみました。 やってみた感想として、適切に作ろうと思うと意外に設計に頭を使うのと、Unit Test の経験値がな…

誰向け? 2022 年度内に Web フロントエンドポジションに転職したい自分の整理 エンジニアとして 4 年目だけど Web アプリの開発経験があんまりなくて詰みかけている 友人 その他、Web フロントエンドのトレンドをざっくり追いたい人 それぞれの技術の詳細は…

プログラミング勉強 全体 自分はフロントエンド得意だと思っていたのですが、「標準のHTMLのフォームでデータ送信するときってどんな感じでやり取りするんだっけ?」「mimeTypeやHeadersって知っているけどどういう仕組みだっけ?」「Web Workerって?シングル…

動機 アップロードした画像を使って画像を加工するなどの処理の場合、どのように取り出して取り扱うか、というのが全然整理できていなかったのでその整理を込めてサンプルコードを書いた。 File オブジェクトや addEventListener もあんまり書いたことがなか…

はじめに 静的コンテンツをCDNに乗せておくとアクセス時間が早い、という話ではなく、 Next.js を SG してブラウザで閲覧した時の挙動に絞っています。 TL;DR SGした際に、 getStaticProps() 経由で渡したコンテンツは _next/data/ ディレクトリ配下に JSON …

はじめに 静的コンテンツをCDNに乗せておくとアクセス時間が早い、という話ではなく、 Next.js を SG してブラウザで閲覧した時の挙動に絞っています。 TL;DR SGした際に、 getStaticProps() 経由で渡したコンテンツは _next/data/ ディレクトリ配下に JSON …

TL;DR ローカルのリポジトリに入っていない、外部の API から取得した画像の最適化をどうするか 結局、 Vercel なら外部 URL の画像も最適化して高速で配信できるので Vercel を選択した 経由 Next.jsの getStaticProps と getStaticPaths を使ったStatic Ge…

TL;DR 第一引数に四捨五入する値を、第二引数に小数点以下の桁数を指定する関数を定義する。 /** * Rounding number with digit * Example: * round(3.14159265359, 2) = 3.14 * @param {number} value * @param {number} digits default : 0 * @returns {nu…

動機 以前から React を自作しよう を見かけてやりたいと思っていたが GW でやっとまとまった時間が取れたのでじっくり取り込んだ。 React をよく個人的に使うので、その設計と実装を経験したほうが React への理解が深まるのでは?と思った。 TL;DR 作業結果…

プライムデーから2週間ぐらい経過したけど振り返る。 なんだかんだで合計3万円ぐらい買った。基本的に必要なものを買えたので満足。 Amazon Basicの10mm厚のヨガマット 自宅トレーニングの環境を改善するために買った。 ケトルベルを振ったりスクワットする…

TL;DR サンプルコードは下記です。サンプルで必要な箇所以外は極力シンプルにしています。 https://github.com/ryokryok/react-ts-jest-rtl React + TypeScript(with Webpack) Jest(ts-jest) React Test Library 前提 最低限の yarn または npm コマンドの使…

動機 毎回 npx create-react-app で React アプリを生成していて Webpack の勉強から逃げていたが、いい加減向き合いたいと思ったため。 昔 Webpack に入門しようとしたら難しいという先入観を抱いたので、できるだけシンプルに、一歩一歩づつ入門する。 最…

React Hooks で追加されたuseRefは最初は使いどころがよく分からなかったのですが、実践例を見つつサンプルを書いてみたら使いどころが掴めてきたのでまとめます。 前提 ReactのuseStateとuseEffectの使い方は覚えたけどuseRefについてはあまり公式例を見て…

toyokeizai.net プログラミング教育が学校教育でも始まるということや、人手不足だからスキルを身につけると稼げるとか、未経験から数ヶ月でエンジニアにとか、プログラミングが話題になってますね。 学習していた記録を思い出しながら早めに知りたかったこ…

仕事観と書くと身構える人が多いのでラフにした。 こういう話はキャリアステップを狙う人だけの話、と考える人もいるけど仕事と趣味を分けてて充実させたい人でも、むしろそういう人ほど、向いていないことを考えた方がいい。 向いていないこととは ここで言…

開発環境と他のサンプルページ見ていろいろ気が付いたこと。 ChromeではHttps環境でないとデバイスの傾きが感知できない サンプルページではスマートフォンでみると傾きが反映されていたのに、 開発環境で立てたローカルネットワークにアクセスしてみると、…

TL;DR React 360にて依存しているReactとReact NativeがHookに対応する前のバージョンのため、React Hookはまだ使えない。Issueには上がっている。 github.com github.com package.json も見てみると確かに対応する前のバージョンになっている。 "dependenci…