iimon TECH BLOG

iimonエンジニアが得られた経験や知識を共有して世の中をイイモンにしていくためのブログです

React・Node.js・CloudflareWorkersでRustから作成したWASMを動かす

こんにちは!iimonでCTOをしているもりごです。 本記事はiimon Advent Calendar 2024最終日の記事となります! 今年はふるさと納税で沖縄に沢山寄付をしたので、沖縄の名産品を食べるのが毎日の楽しみとなっています。 今回、フロントエンド・サーバーサイド…

Bun + Vite を使って速度を比較してみる!!

こんにちは!株式会社iimonでフロントエンジニアをしているおくしまです! 本記事はアドベントカレンダー24日目の記事となります! ■はじめに Bunのアイコンが可愛くて興味を持ち、調べてみたところ、処理速度が速いとのこと。ますます気になってきました! …

JavaScriptの基礎と向き合う

よろしくお願いします!エンジニアのideです。 こちらはアドベントカレンダー23日目の記事になります! 今年は体のあちこちに痛みを感じることが多かったので、来年こそは健康に過ごせる一年になるといいなと願っています。 さて、今回は今年やってきたこと…

クリスマスカードを作りましたのでお送りします。

みなさまHappy December! どうでもいい話ですが、私は12月が1年の中で1番好きな月です。 街の雰囲気とか、冬らしさが出てきて「雪降らないかな〜」と勝手にワクワクする感じがなんともいえないのです!(先日ちょこっと降ったらしいのですが見逃しました。。…

アラフィフでも関数型をあきらめない!「関数型ドメインモデリング」で再入門してみた話

はじめに まずは戦う相手を見定めよう 戦術はいかに まずは関数を知る しゅ、しゅ、出力がないだってぇ!? 型=値の集合とはなんぞや? まとめ おわりに 参考 はじめに 本記事はiimon Advent Calendar 2024 21日目の記事となります! こんにちは!DDD…

JavaScript配列の重複削除でつまづかない!Set・Mapを徹底比較(Lodash・Ramdaも少し紹介)

こんにちは!株式会社iimonでエンジニアをしている、Javascript勉強中の「まるお」です。 本記事はアドベントカレンダー20日目の記事になります! 本記事の内容 filter・Set・Mapを使った重複削除の方法 オブジェクト配列の重複削除の実装方法 パフォ…

歴史を感じつつ、クロージャで遊んでみた(JavaScript編)

こんにちは!株式会社iimonでフロントエンジニアをしている「ひが」です! 本記事はアドベントカレンダー19日目の記事になります! 先日夢で「メリークロージャマス!!!」と叫んでスベる夢を見ました。 冬だからか、みなさん冷たかったです(現実では…

TypeScriptシングルトンパターン設計について

typescriptシングルトンパターン設計について

GASでOpen Weather MapAPIとMesasging APIを使って、日々の天気情報をLINEに通知させる

はじめに・やりたいこと APIを利用するにあたっての準備 Messaging APIの設定準備 OpenWeatherMapAPIの設定準備 GASでスクリプトを組む まとめ 参考 こんにちは! iimonでフロントエンドエンジニアを担当しているたくふぉんです! だんだんとクリスマス…

MySQLで全文検索機能を試したら実行速度が遅かったので調査してみた

◼️ はじめに ◼️ 前提条件 マシン環境 データベースについて ◼️ データ挿入に関して ◼️ 100万レコードでLIKE検索(前後の部分一致)と全文検索の比較 LIKE検索 全文検索 ◼️ EXPLAINで実行計画を確認 LIKE検索のEXPLAIN結果 全文検索のEXPLAIN結果 ◼️ EXPLAIN AN…

SQLマスターへの道 (INNER JOIN、LEFT JOINでのデータ集計)

はじめに 結合とはなに?? 内部結合 外部結合 それぞれのメリットと適しているケース 内部結合のメリット 内部結合のデメリット 内部結合を選ぶべきケース 外部結合のメリット 外部結合のデメリット 外部結合を選ぶべきケース 基本構文 実際に使ってみた 注…

ヘッダーを固定した縦横スクロールを実装する

はじめに こんにちは、株式会社iimonでフロントエンドエンジニアをしている木村です。本記事はアドベントカレンダー14日目の記事になります!cssって奥が深いですよね。勉強した気になっても自分の思い通りに一発でなってくれたことがありません。そんな中で…

レスポンスが文字化けしたのでエンコードについて調べた

はじめに こんにちは!株式会社iimonでフロントエンドエンジニアをしているかとうです! 本記事はiimonアドベントカレンダー13日目の記事となります!✨ サーバーから送信されたデータがShift_JISでエンコードされている場合、そのままだとJavaScriptで扱えな…

TypeScriptのUtilityTypesについて調べてみた

■はじめに ■ユーティリティ型とは? ■Partial< Type >型 ◆説明 ◆どんなときに使えそう? ■Required< Type > 型 ◆説明 ◆どんなときに使えそう? ■Readonly< Type >型 ◆説明 ◆どんなときに使えそう? ■Record< Keys, Type >型 ◆説明 ◆どんなときに使えそう? ■…

React でToDoListを作ってみた!

はじめに コンポーネントの構成について 準備 Headerの実装 Itemのスタイル実装 Itemの実装 Footerの実装(チェックボックスに状態を持たせる) Footerのチェック機能 Footerの削除機能 まとめ 参考文献 はじめに こんにちは、iimon新卒エンジニアの「…

Web業界のゲームチェンジャー!?今更だけどSvelteに入門してみた

はじめに こんにちは、株式会社iimonでフロントエンドエンジニアをしている「みよちゃん」です。 本記事はアドベントカレンダー10日目の記事になります! 自分が参画しているプロダクトでは普段FWを使っていないのですが、せっかくのアドベントカレンダーな…

Webサーバの仕組みについて入門してみた(Python実装)

はじめに 株式会社iimonでSREエンジニアをしているhogeです。 本記事はiimonアドベントカレンダー9日目の記事となります。 今回の記事は技術的な棚卸しとして、普段大変お世話になっているWebサーバがどういった仕組みで動いているのかを実装しながら深堀り…

FirestoreRestAPIをWebアプリケーションで楽に使えるようにしておきたい

はじめに iimonでエンジニアをしている腰丸です。 最近業務でFirestoreRestAPIを使用する機会があったので、使い方を考えてみました。 通常のSDKを用いたコーディングと比べて、そのまま使おうとすると実行したい操作ごとにリクエストやレスポンスの処理を記…

ローカル(仮想環境)にBINDをたててdigコマンドを投げてみた

はじめに 環境構築編 インストール 設定 設定の反映 確認編 digコマンドの実行 終わりに はじめに 株式会社iimonの木暮です。 今回は実際に構築した権威サーバへクエリを送ってレスポンスを確認するところまで行います。 今回の記事は、調べれば類似の記事が…

Panda CSSの基本的な使い方と導入手順

こんにちは! 株式会社iimonにてエンジニアをしております、分割マスターのほでぃです。 この記事はiimonアドベントカレンダー6日目の記事です。 今回はCSSフレームワーク「Panda CSS」を紹介します。 この記事ではPanda CSSの利点や基本的な使い方について…

フロントエンドのテストを書きたい!

はじめに テストの種類 テストレベル テストタイプ テスト戦略 Reactのテストで個人的に躓いたところ UIコンポーネントのテスト Reduxを使っている場合 @mui/x-date-pickerを使用している場合 MUIのコンポーネントでテーマを使用している場合 カスタムフック…

PlaywrightでE2Eテストを書いてみる

はじめに、株式会社iimonでエンジニアをしている須藤です。 最近フロントエンドを触る機会が多く、E2Eテストについて気になっていたので、 今回はPlaywrightでE2Eテストを書いてみようかと思います。 本記事はiimonアドベントカレンダー4日目の記事となりま…

師走だし自宅サーバを構築した話をしてもいいんじゃないかな

nkmさんよりバトンを受け取りました! 株式会社iimonにてフロントエンドエンジニアをしております、まつむらです!エンジニア人生で初めてのアドベントカレンダー参加です! いつもの勉強会とは違って、変なことを書いても良いと言われたような気がしたので…

JavaScriptのシャローコピーとディープコピー詳細解説:実践的な使い方と注意点

はじめに シャローコピーとディープコピーの基礎 オブジェクトの参照の仕組み シャローコピーとディープコピーの違い シャローコピーの3つの方法 それぞれの特徴 Object.assign()が配列に適さない理由 疎配列(sparse array)の扱い 配列メソッドの継承問題 …

エンジニアリングマネージャーのスキル - ピープルマネジメント編 -

はじめに EMのスキルとは ピープルマネジメントのスキルとは 傾聴力 アイスブレイク 質問力 共感力 舐められ力 まとめ はじめに こんにちは! 株式会社iimonのエンジニアマネージャー、まつだです。 iimon2年目のアドベントカレンダー初日ということでそれに…

spyOnでの監視やmockテスト解説

こんにちは。iimonでエンジニアをしている林と申します。 mockについての解説記事を過去3回に渡って書いてきましたが、 spyを最近多用しているのでspyについても纏めてみました。 今回の記事は前回までの記事の知識を前提に記載させて頂きます。 よろしくお…

React Mapメソッド使う際に引っかかった話

はじめに map()を使う際に起きた問題 React の再レンダリングの仕組み map()メソッドでkeyをindexにするのを避けたい まとめ 参考 はじめに こんにちは、iimon新卒エンジニアのみやこしです、最近業務でreactを使うことが多くなり、reactをお勉強中です…

お手軽にBasic認証のパスワードを自動更新する方法

はじめに はじめまして、SREチームのhogeです。 検証環境にBasic認証をかけて簡易的なアクセス制限をかけることがあるかと思います。 Basic認証とはいえ、以下のような理由からパスワードを定期的に更新することが望ましいです。 パスワードが長期間使い回さ…

再帰がわかればマージソートがわかった

1. はじめに 本記事は、私が学生時代にアルゴリズムを学ぶ上で苦手に感じてしまった原因である「マージソート」についてです! 【本記事でわかること】 再帰の仕組み マージソートで配列を並び替える方法‍‍ 【前回の記事】✨ JSでソートを知る ✨ 基本のソート…

○○に依存しつづけてはや6年〜Dependency Injection(依存性の注入)〜

はじめに エンジニアリング文脈での依存とは DIのメリット 依存性を注入する方法 DIコンテナとは 使いどころのヒント はじめに こんにちは! 株式会社iimonのエンジニアマネージャー、松田です。 突然ですが皆さん、何に”依存”してますか? 私は恥ずかしなが…