「CSS」に関連する技術ブログ

企業やコミュニティが発信する「CSS」に関連する技術ブログの一覧です。

テックブログのデザイン刷新(実装編)

みなさん、こんにちは! 今回の記事は珍しく(?)以下のメンバーによる共同執筆となります。 金融ソリューション事業部 市場系ソリューション 1 部 寺山 X イノベーション 本部 AI トランスフォーメーションセンター 山田 さて、以前よりアクセスしていただいている方はお気づきかと期待していますが、10 月末に当ブログのデザイン( はてブ ロのテーマ)を刷

ミイダスのフロントエンドをNext.jsに移行した背景と課題

ミイダスのフロントエンド開発では、これまでReactとReduxを中心に、プロダクトや開発組織フェーズとその変化に対応するため技術選定を進めてきました。 そして2021年からスタートしたNext.jsへの移行計画「ミイダス2.0」プロジェクトの全貌について、フロントエンド開発を担当した後藤と松村、李に話を聞きました。 移行した背景や課題、今後の展望についてご紹介しま

Google Meetで誰がいないかをすぐに見つけだす拡張機能を作成した

はじめに こんにちは。入会システムチーム高畑と申します。 ニフティでは打ち合わせ等にGoogle Meetを使用しています。Google Meetで打ち合わせ開始時に誰がいて誰がいないのか、全員参加しているかを確認する時間が発生してしまうため、今回は予め作成したリストからMeet画面に出席していない人を表示するChrome拡張機能を作成しました。 Google Meetでは 出席機能 が提供さ

pure selectors must contain at least one local class or id

経緯 css modules ファイル内に、html セレクタを直接記述したらエラーに遭遇したので、原因と解説、解決方法を簡単にまとめました。 やったこと css modules ファイル内で、 <h1> タグ内の文字色を 黄色 にするクラス指定を追記。 import styles from '../styles/xxx.module.scss' export default function Home() { return ( <div className={styles.container}> <h1>Welcome to My app!</h1> // ここの

社内の非エンジニア向けに競プロ勉強会を主催した話

こんにちは!株式会社ペライチ のサーバーサイドエンジニアの福原です! つい先日、社内にて非エンジニアの社員に向けて競プロに挑戦してみる勉強会を主催しました。 本記事では勉強会開催の経緯や内容についてとその結果私が得られたものや提供できたものについてまとめます。 また非エンジニア向けの勉強会の中身について触れることで、弊社の開発チーム以外

Prettier の代替として Rome 触ってみた

Prettier の代替として Rome 触ってみた はじめに こんにちは、旅行 PF 部エンジニアの奥田です。 この記事では、Prettier の 10 倍速いと言われるRomeを触っていきます。 ここまで圧倒的な速度を喧伝されては気になるのは人の性…さっそく触っていきます! Rome とは フロントエンド開発のツールチェインを 1 つに統一することを目指しているプロジェクトです。 Babel,ESLint,webpack

【Yew】Rustでフロントエンド開発 - Rustのマクロを紐解く -

こんにちは、 電通国際情報サービス (ISID) 金融ソリューション事業部の大場です。 今回は、Rustでフロントエンドの実装ができるYewというライブラリを使って Markdown エディタを作った話をします。本記事は、Yewの内部実装に触れながらYewやRustのマクロの動作について理解を深めることを目的としています。これらについて詳しく知りたい方はぜひ本記事を参考にしていた

Vue Fes Japan Online 2022 に BASE から2名のエンジニアが登壇及び協賛します

2022/10/16(日)に開催される Vue Fes Japan Online 2022 で BASE に所属する2名のエンジニアが登壇します。 vuefes.jp BASE では 2018年頃から Vue.js を使ったプロダクト開発を行ってきており、これまでいくつか Vue.js に関連するテックブログ記事やイベントへの参加を行ってきました。 そして今回は Vue Fes Japan Online 2022 のスポンサーとなり、またひとつ Vue.js コミュニティへの貢献がで

より綺麗な CSS を書くためには

今回は、チーム開発などにおいて運用しやすくなる、エンジニアのための「より綺麗なCSSの書き方」を紹介します。 !important を使わない 余分な div は書かない CSS セレクタを深くしない HTML に style を直接指定しない 自分より外のコンポーネントに margin の情報を持たせない まとめ !important を使わない 例えば、以下のようなHTMLがあったとします。 < style > p { color : red !i

アクセシビリティ推進組織立ち上げ後半年間の動き

こんにちは。エンジニアの中島です。 2022年 4月からアクセシビリティ推進グループ(以下推進グループ)に在籍しています。 この組織は新設されたばかりで、まだ出来て半年の組織になります。 そのため、部署の目指すべきゴールイメージや、それを図るための指標といったものを作るところから始めることになりました。 本記事はそういったところについて共有させ

CakePHP2からCakePHP4へのバージョンアップ 〜其の2 Cake2とCake4の共存環境編〜

はじめに こんにちは。株式会社ペライチ のエンジニアリングマネージャーの三井と申します。 ペライチではオフショア開発の立ち上げからオフショアでの開発プロジェクト推進をしています。オフショアの概要につきましては以下に簡単な紹介記事がございますので合わせてお読みいただけますと幸いです。 https://qiita.com/mitsui_peraichi/items/a13bee395da3281c8622 ペライチでは保

【Salesforce】 Build Your Own (LWR) テンプレートを利用してみた

こんにちは。ISID CIT事業部の熊倉です。 本記事では、 Salesforce の Summer'21アップデートで正式リリース となったExperience Cloudの新しいテンプレート 『Build Your Own (LWR) テンプレート』 について紹介したいと思います。 Experience Cloud は Salesforce が提供しているWebサイトを構築できるサービスで、カスタマーサイトやFAQサイトといった Salesforce の他サービス(主にService Cloudです

世界共通のデザインシステム開発にStorybookを導入した

初めに KINTOテクノロジーズでフロントエンドエンジニアをしているクリスです。普段は多国籍のメンバーが在籍しており、チーム内のコミュニケーションは雑談でも技術的な話でも主に英語で行っているグローバル開発チームに所属して、様々な国に向けて現地サービス及びその裏で利用する管理画面を開発しています。同時に複数のプロジェクトを開発する際は、いか

ZOZOTOWN Webフロントエンドリプレイスにおける CSS in JS の技術選定で Emotion を選定した話

はじめに こんにちは。ZOZOTOWN開発本部フロントエンドの菊地( @hiro0218 )です。 現在、 ZOZOTOWN ではWebフロントエンド技術のリプレイスプロジェクトが進行しています 1 。本記事では、WebフロントエンドのリプレイスでCSS in JSの技術選定をした際の背景や課題についてご紹介します。 既存技術スタックの課題 リプレイス以前の環境は、Classic ASPのテンプレートエンジンに依

Nuxt3にStorybookとTailWindCSSを入れるまで

こんにちは。最近PCを買い替えましたたけろいどです。 Nuxt3にStorybookとTailWindCSSを入れるまで はじめに Nuxt3、RC1おめでとうございます。 本リリースまでが待ち遠しいです。 ちょうど社内用ツールの開発があったのでNuxt3を導入しStoryBookなどのエコシステムを入れてみました。 Nuxt2であればモジュールが存在しますので簡単にセットアップできますがNuxt3はまだその辺りが充
技術ブログを絞り込む

TECH PLAY でイベントをはじめよう

グループを作れば、無料で誰でもイベントページが作成できます。情報発信や交流のためのイベントをTECH PLAY で公開してみませんか?