「CSS」に関連する技術ブログ
企業やコミュニティが発信する「CSS」に関連する技術ブログの一覧です。
全356件中 61 - 75件目
2023年新卒インターン フロントエンド編
2023/05/16
ブックマーク
はじめに 初めまして、株式会社ココナラの新卒第1号として4月からジョインしましたひびきです。 本記事では、ココナラ初の新卒として本格的にジョインする前に行なった内定者インターンについて書いていきたいと思います。 目次 自己紹介・スキルセット 入社した経緯 インターンについて インターンの目標について 実務 人間関係 インターンの内容について 出勤頻
ヘッドレスUIコンポーネントでいこう -- Radix UI + Stitches がいい感じ
2023/05/12
ブックマーク
こんにちは！ 株式会社ココナラの法律相談事業部でWebエンジニアをしている 原井 です。 ココナラ法律相談 と ココナラエージェント という2つのプロダクトのWebフロントエンド・バックエンド開発を担当しています。 この記事は、フロントエンド開発に使うUIコンポーネントライブラリの技術選定をするシーンでのお話です。 私たちが何を課題に感じていたのか、どう
Ruby 2.7に飽きたから秋田からRuby 3移行した話
2023/05/11
ブックマーク
Ruby のロゴについて 自己紹介 Ruby 3への移行 脱Refile 過去の先駆者 開戦 問題その１ 画像のURLがS3のエンドポイントになっている問題 問題その2 移行対象のレコードが大量問題 問題その3 画像が荒くなる問題 幾多の障害を乗り越え その他gemの更新 ついにRuby3へアップデート １番の影響 Ruby 3へのバージョンアップを終えて 最後に 自己紹介 2023年1月1
Intersection Observer APIを使ってスクロール後に下部メニューを表示させる
2023/05/09
ブックマーク
はじめに ページ上部に配置されたメニューバーをスクロースによって画面追従する際、通常は追従させる要素にstickyなどを付与して画面追従させるのが普通かと思います。 画面上部でついてくるこれです。 ですが、イレギュラーではありますが追従させる要素がスクロールによって画面から隠れた後、下部にその要素を配置するなどの要望があった際、window.scroll等を使
【Playwright 入門】Playwrightで始めるE2Eテスト
2023/05/09
ブックマーク
はじめに こんにちは！フロントエンド開発課の koki _matsuraです。 この記事では、E2Eテスト フレームワーク として用いられるPlaywrightのインストールといくつか基本的なテストコード、最後に 拡張機能 についてもご紹介させていただきます。これからPlaywrightでテストを書きたい人、E2Eテストに少しでも興味を持っていただける方に読んでいただけると幸いです。 目次は次
あなたが今！やるべきことがわかる「LIFULLアクセシビリティガイドライン」を公開しました
2023/04/28
ブックマーク
こんにちは、フロントエンドエンジニアの嶌田です。 アクセシビリティは今まで以上に大きな関心を寄せられるトピックになってきたように思います。個人で関心がある人、企業のなかで周りを巻き込み推進しようとしている人、すでに組織全体での取組みに変わりつつある企業など、状況は様々だと思います。弊社はというと、内側からの推進活動は広がりを見せつつ
超進化したAI「ChatGPT」が生み出す無限のクイズをライブ配信してみた
2023/04/27
ブックマーク
こんにちは、テリーです。2023年1月に急速に認知度が高まったAI、ChatGPTは世界で瞬く間に広がっています。急激に変わっていく社会には期待と不安の両方を感じる人もいるでしょう。携帯電話が出た時も、スマートフォンが出 […]
Laravel Viteを使ってTailwind CSSを導入する
2023/04/27
ブックマーク
こんにちは。配配メール開発課のmoryosukeです。 最新のLaravelではデフォルトのフロントエンドビルドツールがLaravel MixからLaravel Viteへと移行しました。 そこでTailwind CSS をビルドする手順を追いながらLaravel Viteに慣れていこうと思います。 Laravel Viteとは 事前準備 プロジェクト作成 Tailwind CSSを導入する 補足 最後に Laravel Viteとは Laravel ViteはLaravel用の高速なフロントエンド
Vueでpropsとslotを使って再利用コンポーネントを開発する話
2023/04/25
ブックマーク
こんにちは、KINTO Technologiesグローバル開発部でフロントエンド開発をしているクリスです。 普段フロントエンド開発でコンポーネントを開発する際はpropsを利用して必要な情報を渡す、という話はよく耳にすると思います。Angular, React, Vue, Svelteといった今よく使われているフレームワークではそれぞれの書き方でこの機能を実現しています。すべてのフレームワークを言
ReactでuseIdを使い一意な文字列を生成し汎用コンポーネントのid重複を防ぐ
2023/04/10
ブックマーク
はじめに こんにちは WESEEK で yaml から css まで何でも書く haruhikonyan です。 フォームなどをコンポーネント化したときに同じページにそのコンポーネントを使うと id の重複に困ったりしませんか？ そんな時に React が公式で提供している useId という hook を使うと解決するかもしれません。 しかし利用においては注意点があるので具体例とともに紹介したいと思います。 use
フロントエンドパフォーマンス改善に取り組んだ話
2023/04/05
ブックマーク
こんにちは。エンジニアの北島です。普段は LIFULL HOME'S の売却査定領域 でエンジニアリングを担当しています。 今回は既存アプリケーションのパフォーマンス改善に、フロントエンドの観点から取り組んだ話をします。 経緯 弊社のサービスで プライスマップ という AI 査定による不動産価格を地図上で一気に見られるサービスがあります。 このサービスは 2015 年にロー
MLOpsマルチテナントクラスタへのArgo CDの導入と運用
2023/03/30
ブックマーク
はじめに こんにちは。ML・データ部MLOpsブロックの築山（ @2kyym ）です。 MLOpsブロックでは2022年の上期から Argo CD の導入に着手しました。本記事ではArgo CDの導入を検討した背景から導入のメリット、また導入における公式マニフェストへの変更点や、運用において必須である認証や権限管理など、具体的な手順についてご紹介します。少しでもArgo CDの導入を検討している
アクセシビリティ改善中！ LIFULL HOME'S スマートフォンサイト
2023/03/30
ブックマーク
フロントエンドエンジニアの嶌田です。株式会社 LIFULL でプロダクトのアクセシビリティ向上をミッションとして活動しています。 本日は、不動産・住宅情報の総合サービスである LIFULL HOME'S のスマートフォンサイト において、過去半年間で実施したアクセシビリティ向上施策をご紹介します。ご紹介する施策のうちいくつかは、内容を掘り下げて実装コードを交えて解
コーディングほぼ未経験の私が新規サイトを制作できるようになるまで
2023/03/29
ブックマーク
本記事は 2022年度 新人卒業記念Week 4日目の記事です。 🌸 3日目 ▶▶ 本記事 ▶▶ 5日目 📚 はじめに 1.Udemyでのオンライン学習 2.実務での修正作業 3.新規ページ作成 大変だったこと①：参考となるコードやパーツがない 大変だったこと②：クラス名や共通要素を一から考えなくてはいけない まとめ はじめに 初めまして、入社一年目の小嶋です！現在はWebディレクターを
Pythonの”Streamlit”でアプリをデプロイするまで
2023/03/09
ブックマーク
はじめに こんにちは! そろそろエンジニア2年目が終わり、3年目を迎えることに恐怖している新垣修一です! 今回はPythonWebフレームワークの一つであるStreamlitを使用して、アプリを作成してみます。 最近技術系の記事を見るとフロントエンドの知識なしで早くアプリを作成できるStreamlitというフレームワークの存在を知り、少し触れてみたいなと思い今回の記事を書かせて