注目のストーリー
テックブログ
htmlメールをダークモード対応させた
マーケティング業務も担うため、htmlメールの改修を行なったりもします。htmlメールの参考記事は少ない方(だと思っている)で四苦八苦したので、今後誰かのためにと思い、すごくざっくり、殴り書き的にやったことをまとめたいと思います。ダークモードへの挑戦実際のコード参考にしたサイトエンジニア募集中です絶賛ダークモードへの挑戦だいぶ前からダークモード対応したい方針はあったと記憶してますが、誰もやらなかったのでこの機会にやってみました。こんな感じでダークモードは実装できました。大きくいうと画像を変更するのと文字色を変更する、この2点です。実際のコードある程度土台になるコードに関してはstyleの...
CSS / Sass スタイルガイド
社内のコーディングルールについてそもそもの目的上記2点の目的を達成するためには?結論:他社のコーディング規約導入主なコーディング規約スタイルの宣言セレクタプロパティコメントCSSのフォーマットディレクトリ構成1-settings2-mixin3-base4-layout5-modules6-utility7-librayまとめ社内のコーディングルールについて創業から弊社は様々な開発メンバーと協働しシステム開発に勤しんできました。企業であれば当然だと思いますが、弊社はまだまだ小規模ということもありこの機会に社内外向けにコーディング規約をまとめてみました!そもそもの目的コーディング規約を作成...
Rails←React導入
弊社は創業からRuby on Railsを使用していましたが、創業から3~4年が経過した時点で、「あれ・・サイト表示重くない??」「画面遷移10秒くらい経たないと変わらないページあるよ・・」とちらほら社内外からご意見(クレーム)をいただくことがあり、じゃあフロントエンド改善するかという流れになりました。React / Vueどちらか導入したいよねということになったのですが、ベースがrailsということで、erb / slimなどのviewの中でreactを使用できるgemがあるということでreact-railsを採用しました。Gemの導入ファイルの準備Reactコンポーネントの作成Rai...
Reactにおける状態のリフトアップとコンポーネント設計の重要性
はじめに公式ドキュメントを参照してみる状態管理とコンポーネント設計の課題状態のリフトアップ(Lifting State Up)とはなぜリフトアップが必要なのか状態のリフトアップを使った実装例アプリケーションの構成コード例親コンポーネント:App検索バーコンポーネント:SearchBarフィルターコンポーネント:Filterリスト表示コンポーネント:ItemList実装のポイントサンプルコードにおける状態のリフトアップの適用なぜこの設計が効果的か状態のリフトアップによるメリットまとめコンポーネント設計の重要性単一責任の原則プレゼンテーションとロジックの分離状態管理を親コンポーネントに集約す...
Ruby on RailsでSendGrid(Web API)メール送信を実装
業務でSendGridのSMTPを用いてメールをユーザー宛に送信していたが、送信されるメール毎にカテゴリーを付与し、コンバージョン率を調査したいとの社内マーケからの要望を受け実装。そのため、SMTPでカテゴリーを付与しようとしたが、カテゴリー設定がSMTPではできないことが判明し、Web APIにて実装しようと思ったところ、意外と参考文献が少なかったので備忘録も兼ねて記事とします。ちなむと今回は、Web APIを用いてメール送信するところが難所なのではなく、カテゴリーを付与するところで詰まりました。また、今回APIの呼び出しに使用したのはsendgrid-rubyというgemになります。...
テックブログ始めました
はじめにこんにちは!READY TO FASHIONテックブログへようこそ。READY TO FASHIONの開発部門統括をしております高草木です。本ブログでは、READY TO FASHIONの開発部門に所属する技術者を中心に、弊社が使用している技術的な挑戦・学びを中心にアウトプットしていきたいと思います。READY TO FASHIONでは一緒に働くエンジニアを募集しています!ファッションに興味があるエンジニアのご応募お待ちしております!READY TO FASHIONテックブログの目的ITエンジニアの採用私たちは常に一緒に働いてくれるエンジニアを求めています。ファッション業界✖️エ...