フロントエンド

こんにちは。技術広報のsakutaroです。 2025年5月23日(金)・24日(土)に開催された TSKaigi2025 に、弁護士ドットコムは Silverスポンサー として協賛しました。 本記事では発表した内容と参加したエンジニアによるセッション視聴レポートを振り返りいたします。 最後にイベント告知もありますので、ぜひ見ていってください。 クラウドサイン エンジニア ツノが登壇！ セッション情報 TSKaigi2025セッション視聴レポート 堅牢なデザインシステムをつくるためのTypeScript活用 by @takanoripe 機能的凝集の概念を用いて複数ロール、類似の機能を多く含む…

約6年ぶりにフロントエンド開発に携わっています。その学び気付きメモです 学び あらためて、フロントエンドには気にすべきことが非常に多いと感じました。 デザイン 操作感 コンポーネントという構造的な考え方 加えて、既存の処理を改修する際には、以下の点にも特に注意が必要だと気付きました。 コードの背景にあるコンテキストの読解力 特にユニットテストの充足度が不明な場合、その処理が何を保証しているのかを把握する理解力 さらに、技術面でも使用言語や周辺ツールのキャッチアップが求められ、学習負荷は決して小さくありません。 6年前の時点でもすでに自分はメインプレイヤーではありませんでしたが、現在は当時以上に…

はじめまして、こんにちは！ MyTalent開発チームのフロントエンドエンジニア・田中です😎 今日は「Mockoon」というローカル環境でお手軽にモックサーバーを立ち上げることができるアプリケーションをご紹介したいと思います！ mockoon.com Mockoonとは Mockoonは2017年に登場したAPIモックサーバーをローカルで簡単に作成・実行できるオープンソースのアプリケーションです。 API開発やテストにおいて、実装が先行しがちなフロントエンドに対しバックエンドでの実装がされていない場合や、外部APIへの依存を避けたい場合に非常に役立ちます。 GUIベースで直感的に操作でき、環境…

前回はブログ記事をマークダウンで書けるようにする実装を見ていきました。 maimux2x.hatenablog.com 次は記事中の任意の場所に画像を埋め込めるようにする部分を見ていくと書いてたのですが、先にEmber.jsでブログ投稿画面のプレビューをできるようにする部分の実装を見ていきたいと思います。 画像のようにタブがあって、ブログ記事を書く部分とプレビューできる部分を作りました。 Rails のみでプレビューをできるようにする場合、Hotwire で TurboFrames や Stimulus を使って実装する形になると思うのですが、Ember.js ではすでにブログ記事を表示する役…

前回、ActiveStorage を使って画像を1枚添付するやり方について見ていきました。 maimux2x.hatenablog.com 今回はその続きで、ActiveStorage を使って複数枚の画像を添付できるようにしていきたいと思います。 まず、Rails 側を修正していきます。 # app/models/post.rb class Post < ApplicationRecord has_many_attached :images # 変更 # 省略 validates :images, content_type: [ "image/png", "image/jpeg" ] end…

今回は Rails と Ember.js で作っているブログアプリで記事を作成・更新する際に画像を添付できるようにしていきたいと思います。 最終的には記事をマークダウンで書いて、その中の任意の箇所に画像を挿入できるようにすることを目指していて、その前段階の実装です。 前回はトーストメッセージの実装について書きました。 maimux2x.hatenablog.com ActiveStorageを使って画像を1枚添付できるようにする 画像添付にあたっては Rails の ActiveStorage を使っていきます。 railsguides.jp ここでは ActiveStorage の細かな導入…

今回はEmber.jsでトーストメッセージを出す部分を見ていきます。 前回の記事はこちらです。 maimux2x.hatenablog.com トーストメッセージの実装では当初、Rails のように画面遷移をベースに考えてしまってパラメータをトリガーにするなどちょっと迷走したりしました...。 Rails の場合、画面遷移時(リダイレクト時)に flash メッセージを出すことが簡単に対応できると思います。 しかし、Ember.js などの SPA を実現するフレームワークでは画面遷移がありません。 つまり、Rails の flash がサーバーからクライアントへの通知を実現しているのに対して…