WRITINGS / 記事数 36
記事一覧
このブログとQiitaで公開した記事を、最初に公開した日付の順で並べています。
タグを選ぶ
複数選択・AND検索使用したことのないパッケージマネージャーを比較してみた
npm・pnpm・Bunを実際のプロジェクトで比較し、速度だけでなく厳密性やCIでの扱いやすさから選び方を考えます。
JavaScriptバージョンを全部見返してみる
最終更新: 2024 02 11 ※ 親記事にも記載 この記事を書くにあたって、カジュアル面談やフロントエンジニアと話す際Next.jsのバージョンを強く意識することがあり、 特定の言語やライブラリのバージョンを把握していると話の伝わりやすさ・相手のレベル感がわ…
2023年振り返り
技術関連 フロントエンド Next.js v13からv14の進化適応、プロダクションコードへの反映 NextのPage RouterからApp Routerへの移行 途中からリーダーとなったプロダクトがNextのv12であったため、先ずv13.3へのアップデート…
vanilla-extractでGoogle Fontsを使う
App Routerアップデート当時はほぼCSS Modules一択だったため ブログ・本業ではCSS Modulesを使用していたが、以下の辛みがあった。 熟練者ほどネストを推奨しない記事が多く、独自クラス増えがち 規約で縛れていないため、初心者はネストしたク…
ブログのNext14対応+App Router対応
社用プロジェクトでは自分主導ですでにプロダクトのApp Router化をすませていたため、 ぱっとできるだろうという感覚がありブログのApp Router化を進めたところ数時間で終了した。 巷に転がっている「とりあえず"use client"をつけまくる」方式は…
Reactで迷ったこと①: function or アロー関数
基本的には参考文献を引用し、Reactを触り始めた人でも参考にできるよう解説を簡略化する目的でまとめている。 前提 React・NodeJSチュートリアル程度は終わっている TypeScriptの型についてチュートリアルレベルの理解はある 関数コンポーネントは…
AsyncIteratorでデータを一括ではなく順次取得する
TypeScriptでAsyncIterableIteratorを使おうとしたら見たことない記述が多かったのでまとめた。 AsyncIteratorとは？ AsyncIterableIteratorは、JavaScriptのイテレーターを非同期処理に対応したもの…
開発時によく使うコマンド忘備録
よく使うコマンドまとめ 基本的にNode.jsの開発ではあまり多くのコマンドは必要なく、ビルド・テスト・ フロントならrun devやlinter等の少ないコマンドが理解できていれば問題ない。 開発を続ける中で調べて便利だなと思って使っているコマンドがいくつかあ…
macOS Ventureアップデート後gitでエラーが出る
macのOSアップデート時には結構発生するっぽい 1. git自体は過去インストールしており /opt/bin には入っている 2. バージョン確認のためgitコマンドを実行するとxcrun: errorが出る おそらくOSのバージョンとxcodeが紐付いており…
カスタムフックの作り方を1から考える
カスタムフックの作り方を１から考える カスタムフックとは? React Hooksを利用した共通関数 状態を閉じ込めて、更新後の状態だけ受け取れる APIによる初期値fetchを閉じ込めて、取得後の状態だけ受け取れる Reactの一部なので、状態だけでなくcom…
Reactの子コンポーネント内でTwitterCardを設定する
TwitterCardを始め外部のサイトに情報を伝えるため タグを利用したい場合があります。 React(Next)内では親となるコンポーネントの タグ内で タグ設定を行うことが多いですが、 グローバルな位置にない子コンポーネントから タグ内に設定をしたい場合が…
npmモジュールの更新チェックを自動化する
開発を実施している中でnpmを使用していると、依存しているモジュールの更新が発生した場合 多くのプロジェクトでははGitHub上でdependabotAlertが出てから対応することになります。 加えて現在ではクラウドを使用しない開発は稀であり、クラウドの仕様変…
SwiftUIのList型とArray型
SwiftUIのList型とArray型 配列型 TypeScript等と同じ形で定義できる配列は普通に存在する。 forEachなどのメソッドも生えているため操作イメージはほぼ変わらず。 List型 RealmSwiftというライブラリで使用する特殊配列型。…
Wowza API v1.6->v1.9で認証方法を変更する
配信関連のタスクとして、wowzaのAPIアップデートを実施した際に記事がなかったため記録。 wowzaとは？ Wowza WebRTCを使用しストリーミング配信を実施できるソフトウェア cloud・Streaming Engineを利用し自鯖での運用が可能。…
2022後半振り返り
技術関連 9月に転職して現職に就いたため、今年の後半は環境が大きく変わった。 リモートである部分は変わらなかったので(一部でなく完全にはなったが)、 macbookをクラムシェルで使うためにTrackPadとかAirPods Proとか周辺諸々を揃えたので出費も…
2022年前半振り返り
前からだいぶ間が空き、昨年末～今年まで本気でフロントエンド周りの知識UPに努めてきたので振り返り、 今後きちんとアウトプットしていくことも含めて記録を残します。 blogに関して理解しやすい形で記事を公開ようとしてnotionに下書きアウトプットしまくっておりそ…
TypeScriptの使用をNuxtで強制するために
Nuxt + TypeScript 構成のプロジェクトに関わることがあり、主にバグ中心のリファクタリング・構造化を実施した際 Any が許容されていたり、何故か型が使用されていないモジュールがあり大変でした。 そのため、できるだけ TypeScript の使用を…
Nuxt + TypeScriptの現場開発感
Nuxt + TypeScript の環境でフロント～バックエンドまでトータル開発をしたのでその時の所感。 良かった所 コンポーネント単位の開発に順応しやすい(Nuxt) 1 コンポーネント内に Html・JavaScript・Css(Sass)が纏められている…
2021年水準のJavaScriptを学ぶ最速パターン
年度替わりの 3 月までに基礎固めをしようと思ったため、2021 年現在で JavaScript を学ぶために 最短アプローチはどうすればよいか？を振り返りと方針がためを含め纏めました。 勉強するドキュメントについて とりあえず書いて覚える ※0 からの学習者向…
2020年に身につけた技術まとめ
今年はレガシー系 SIer 企業から転職し、モダン技術を選択できる会社のエンジニアとして働くことになった。 設計開発が 8:2 から現在では 2：8 / 1：9 ほどの割合になっているため、開発力についてはかなり向上できた。 インフラ的知識や構造化などの知識も身…
GatsbyにおけるGraphQLの役割について
Gatsby における GraphQL の挙動について、公式チュートリアル・参考サイトで得られる情報は 順番に学習することを想定しているため、ピンポイントでの理解が難しくなっている。 差別化のため、この記事では 何をしたいときにどこを触るか という逆引き形式で…
【Node.js】TwitterAPIのRateLimitとcursorに気をつけろ（新しいタブで開く）
Twitter APIをNode.jsから扱う際のRate Limitとcursorによるページングの注意点をまとめた記事です。
このサイトへ収録 2026年8月2日
自分がReactを選ぶべきだと思うただ1つの理由
今後何を勉強するかを分析して、対応幅が広くなりそうな React をやろうと思った。 Vue と同じくフレームワークだったり Cli ツールだったり色々あるので、 React 内の各ツールと Vue を比較しながら React をやる方向に考えを持っていくために…
2020年最新技術とそれに関する知見
最近 Twitter で流れてきて気になった単語。 単語レベルではすべてシェアがフラットに見えるので、Qiita の直近一ヶ月記事件数がどれくらいか？ というある程度意味のある観点で調べてみて将来的にどうなのか、触れるべきかどうかを考える。 2020/10/23…
[JavaScript]なろうランキングをAPIで一括取得する
API が使える環境があり、定期的にそれを使っているならちょっとコード化するだけで やりたいことが数秒短縮できる、みたいな記事です。 やろうと思った経緯 夏頃ステイホームの暇さに煽られ、kindlePaperWhite を購入しました。 暇つぶしに「小説家になろ…
Firebaseプロジェクトのデプロイ先変更を行う
既存のプロジェクトと同じ構成(自分は vue)の開発を進めたい時、 clone してきたプロジェクトのデプロイ先は以前設定していた箇所となっているため、 firebase init した後 firebase deploy を実施してもデプロイ先は動的に変更されな…
個人開発のマネタイズを見据えた開発方針
個人開発の方向性としてよく見られるものについてまとめと今後目指すべき所のメモ的なまとめ 各項目とも A が一番難しい・大変なものになり、正直全部 A の物を開発するのであれば、 企業等で取り組むレベルなのでどこで妥協できるかを見ながら作る方向性を決める必要がある…
JavaScriptで関数をobject形式にして使用する
JavaScriptで複数のモジュールを組み合わせて使用しており、設計上の理由で変数を特定のモジュールに入れないといけないが、 メインモジュールからそのモジュールを参照すると変数がクロージャのため undefined になってしまう。 上記をケアするため cla…
UWSCを使用しエビデンス取得を自動化する
過去のプロジェクトにて、テスト時のエビデンス取得については選択範囲を切り取ると クリップボードに貼り付けられ、対象箇所にマーキング後保存するツールを使用していた。 特に Excel への貼り付けが必要なくフォルダへ格納しても良い場合、1 操作で自動化できると よ…
使ったことがないDockerを使う気にさせる使用事例（新しいタブで開く）
Dockerをまだ使っていない人に向けて、導入によって解決できる身近な開発課題を紹介した記事です。
このサイトへ収録 2026年8月2日
TypeScript入門Q&A（フロントエンド初心者向け）（新しいタブで開く）
フロントエンド初学者がTypeScriptで疑問に感じやすい点を、Q&A形式で整理した記事です。
このサイトへ収録 2026年8月2日
一年で使うようになった技術・ツールを3〜4行で説明する（新しいタブで開く）
一年間で新しく使い始めた技術やツールを、短い説明とともに振り返った記事です。
このサイトへ収録 2026年8月2日
Angularのプロジェクトをとりあえず動かすためのFirebase連携（新しいタブで開く）
AngularプロジェクトをFirebaseと連携し、公開できる状態まで進める手順をまとめた記事です。
このサイトへ収録 2026年8月2日
Redmine + GitLabのプロジェクト管理はどうだった？（新しいタブで開く）
RedmineとGitLabを組み合わせたプロジェクト管理を実践し、運用して感じたことをまとめた記事です。
このサイトへ収録 2026年8月2日
Angularのインストールとプロジェクト作成（新しいタブで開く）
Angularの開発環境を準備し、新しいプロジェクトを作成するまでの基本手順をまとめた記事です。
このサイトへ収録 2026年8月2日
Udemyで1年目Java開発者がPHP入門してみた（新しいタブで開く）
Java開発者として一年目の視点から、Udemyを使ってPHPとLaravelを学んだ記録です。
このサイトへ収録 2026年8月2日