ラクーングループのサービスのフロントはreactやVue.jsに順次更新していっています。その中で様々な問題が発生しますが、 その中でも、私が最も多く受ける相談が「値を変更したはずなのに、画面に反映されない！」というものです。 今回は反映されないパターンをreact、Vue.jsそれぞれでいくつか再現して、なぜ反映されないのか解き明かしていきます。 準備 サンドボックスであそんでみる rea
2025.4.22
Storybook駆動開発を知っていますか？ ページ全体をいきなり作るのではなく、「ボタン」や「モーダル」、「入力欄」などのUI部品を先に個別に作るという開発スタイルがあります。 こうしたUIパーツをひとつずつ作って確認できるツールが、Storybook（ストーリーブック）です。 この記事では、Storybookとは何か、Storybook駆動開発の考え方やメリット・デメリットなどを紹介してい
2025.4.11
みなさんは普段、イラストレーターを使用したai入稿のチェックにどれくらいの時間をかけていますか？ 今回はイラレで使用できる「入稿時のチェックを自動化するスクリプト」の作成方法を紹介します。 スクリプト作成の目的 入稿前チェックでは誤字脱字など定量的でないチェックも必要となりますが、一方で「ドキュメントのカラーモードがCMYKか」「フォントはアウトライン化されているか」など定量的なチェックも多々
2024.11.5
エンジニアの皆様は、ログイン機能が必要なサイトの「ログイン方法」の要件として何を思い浮かべますか？ 多くの方はID/パスワードでの認証を一番に思いつくのではないかと思います。 ID/パスワード認証はポピュラーな認証方法ですが、パスワードの漏洩からの不正アクセスのリスクや忘れてしまったときの不便さがあります。 そこで今回は、Passkey認証のできるサイトの作り方をフロントエンドの実装にフォーカスし
2023.4.28
今回は私が最近担当した案件で苦労した、type="file"のinputの値と全く同じ形式のデータを０から作る方法と、データをフォームでアップロードする方法各種について書いていこうと思います！ input type="file"について 基本的にinput type="file"の値というのは、type="text"などのほかのinput要素と違い変更したり設定したりすることはできません。 も
2023.4.26
新しく追加されたdialogタグの特徴に触れつつ弊社のサイトで使われているモーダルをつくってみます。 対応ブラウザ 執筆時のSafariバージョンが16.xxのため、気になるのはSafariくらいでしょうか。 ブラウザ バージョン Safari 15.4 Safari ios 15.4 Chrome 37 Firefox 98
2023.3.28
最近データ移行の仕事をする機会があり、その調査の中で見つけた、Oracle Databaseで手軽に柔軟にデータ登録する方法を紹介したいと思います。 具体的には、Oracle SQL Developerコマンドラインと呼ばれる、Oracle SQLcl（以降、SQLcl）でJavaScriptを利用した方法です。 SQLclは依存関係が少なく比較的導入が簡単で、利用プログラマが多いJavaScri
2022.4.5
フロントエンドに React/Vue.js を採用する機会が多くなってますが、まだまだ jQuery が現役のところも多いと思います。 今回は過去に JavaScript を触った経験がある方を対象に ES2015（ECMAScript 2015、ES6） 以降で変わった点をいくつかまとめてみました。 const let ES2015 従来は変数宣言に var を使用してきましたが、const
2022.3.28
シーケンス図を書く機会があり、その際に使用した便利なjavascriptライブラリがあったので２つご紹介します。 エクセルやパワーポイント等で図や矢印を綺麗に引くのが苦手な人でも、テキストで書けば綺麗に図を作成できます。 1. js-sequence-diagramsで図を書く js-sequence-diagramsはシーケンス図をテキストで表現できるjavascriptのライブラリです。
2022.2.17
ここ最近デザイナーや新人さんからjQuery・jsの質問を受けたりヘルプで代わりに作成したりという業務がぽつぽつと出てきました。 直近であった失敗の反省も兼ね、jsを使う機会は少ないけど少しかじってる状態の人にjQueryを教えた時つまずきやすいと感じた点を私なりにまとめたいと思います！ 失敗談 まず実際に社内で起こった失敗事例を紹介します。 とある案件で上の画像のような追従ボタンを実装
2021.4.4
今回はe2eのテスティングフレームワークであるCypressを導入したので、その導入についてのお話です。 なぜCypressを導入したのか URIHOのお客様に使用していただいている画面はSPAで構築してあります。そのためSPAに対応したe2eのツールが必要になりました。今まではseleniumを使用していたのですが各個人の環境の設定が手間、SPAで使用するとなるとDOMが出現するまで待つとい
2021.3.1
一般的にエクセルの内容をプログラム的に変化させるにはVBA / マクロを使用すると思いますが、モジュールを活用してjavascriptでエクセルの編集が出来るのは簡単だし便利だなぁと思ったので、今回はnode.jsのpackageのxlsx-populateを使用してエクセルを編集してみました。 この記事ではnode.jsを使用する為、実行環境はnode.js公式からダウンロード・インストールを
2021.1.12
