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

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

Androidアプリエンジニアからフロントエンドエンジニアになる際に効果的だった学習

こんにちは、介護事業者向け経営支援サービス「カイポケ」のフロントエンドエンジニアの setoh です。2022年12月から株式会社エス・エム・エスで働いています。 私は大学時代にAndroidアプリ開発を始め、就職後は一貫してAndroidアプリ開発を軸に10年以上のキャリアを積んできました。しかし心機一転、エス・エム・エスに入社後はこれまで全くの未経験であったフロント

KotlinエンジニアがFlutterに入門して1ヶ月でWebアプリケーションを作った話

KotlinエンジニアがFlutterに入門して1ヶ月でWebアプリケーションを作った話 こんにちは。Woven Payment Solution 開発グループの大杉です。 私たちのチームは、 Woven by Toyota において Toyota Woven City で使われる決済システムの開発を行っていて、普段はKotlin/Ktorによるサーバーサイドの開発をしています。 私たちは、Woven Cityを一緒に作っていく協力企業や社内のビジネスチームと

2023年新卒インターン フロントエンド編

はじめに 初めまして、株式会社ココナラの新卒第1号として4月からジョインしましたひびきです。 本記事では、ココナラ初の新卒として本格的にジョインする前に行なった内定者インターンについて書いていきたいと思います。 目次 自己紹介・スキルセット 入社した経緯 インターンについて インターンの目標について 実務 人間関係 インターンの内容について 出勤頻

EmotionでスタイリングしたReactをWeb Componentとして利用する

あいさつ 私たちの困りごと 原因はなんだろう? 解決策 おわりに あいさつ こんにちは。Product Team の冨田、阿波連、渡邉、鈴木、長田です。*1 本記事では、EmotionでスタイリングしたReactコンポーネントをWeb Componentとして出力しようとした時に、困ったことがあったので、解決方法をお教えします。 私たちの困りごと 私たちは、ReactコンポーネントをEmotionでスタイリング

ヘッドレスUIコンポーネントでいこう -- Radix UI + Stitches がいい感じ

こんにちは! 株式会社ココナラの法律相談事業部でWebエンジニアをしている 原井 です。 ココナラ法律相談 と ココナラエージェント という2つのプロダクトのWebフロントエンド・バックエンド開発を担当しています。 この記事は、フロントエンド開発に使うUIコンポーネントライブラリの技術選定をするシーンでのお話です。 私たちが何を課題に感じていたのか、どう

Intersection Observer APIを使ってスクロール後に下部メニューを表示させる

はじめに ページ上部に配置されたメニューバーをスクロースによって画面追従する際、通常は追従させる要素にstickyなどを付与して画面追従させるのが普通かと思います。 画面上部でついてくるこれです。 ですが、イレギュラーではありますが追従させる要素がスクロールによって画面から隠れた後、下部にその要素を配置するなどの要望があった際、window.scroll等を使

ChatGPTで爆速!10分でLT用のプレゼン資料の下書きを作成する

みなさんこんにちは、X イノベーション 本部ソフトウェアデザインセンターの徳山です。 いきなりなのですが、「ちょっとした」プレゼン資料の作成って意外と難しくないでしょうか。 特にプレゼンの機会がこれまであまりないと「構成や見た目、中身をどの程度のものを作ろうかな」と漠然とした不安に襲われないでしょうか(僕は襲われます)。 現在私のチームで

Laravel Viteを使ってTailwind CSSを導入する

こんにちは。配配メール開発課のmoryosukeです。 最新のLaravelではデフォルトのフロントエンドビルドツールがLaravel MixからLaravel Viteへと移行しました。 そこでTailwind CSS をビルドする手順を追いながらLaravel Viteに慣れていこうと思います。 Laravel Viteとは 事前準備 プロジェクト作成 Tailwind CSSを導入する 補足 最後に Laravel Viteとは Laravel ViteはLaravel用の高速なフロントエンド

Vueでpropsとslotを使って再利用コンポーネントを開発する話

こんにちは、KINTO Technologiesグローバル開発部でフロントエンド開発をしているクリスです。 普段フロントエンド開発でコンポーネントを開発する際はpropsを利用して必要な情報を渡す、という話はよく耳にすると思います。Angular, React, Vue, Svelteといった今よく使われているフレームワークではそれぞれの書き方でこの機能を実現しています。すべてのフレームワークを言

【MIIDAS Tech LIVE #1】を開催しました

こんにちはミイダス Tech Officeです。 ミイダス株式会社のテックチームが直近で開発した機能を現場のエンジニアから共有する「 MIIDAS Tech LIVE 」 第1回目の開催となる今回は3つのリリース情報をお届けしました。 採用マッチングサービス「ミイダス」は、独自の診断ツールで採用のミスマッチを減らす中途採用サービスです。メインの採用関連の機能に加え、診断や研修、

Svelteでユニットテスト - Svelte不定期連載-02

こんにちは(こんばんは)、Svelte不定期連載その2です。 過去の記事はこちら SvelteKit + Svelte を1年間くらい使ってみた知見など※SvelteKit メジャーリリース対応済み Svelteと他JSフレームワークとの比較 - Svelte不定期連載-01 今回はSvelteのユニットテストについて書いていこうと思います。 モジュールはこちら。 Vitest + jsdom + @testing-library/svelte の3つを使用して行います。 Vitest vite

新卒がエンジニアとしての一歩を踏み出すまで

こんにちは、見習いフロントエンドエンジニアのぱやぴです。 新卒として2022年4月に入社、9月に配属されもう早一年がたとうとしていることに驚きを隠せません。何より後輩が入ってくるということが最大の驚きです。 そこで今回は入社から執筆現在(4月)までの約1年間に何を行い、何ができるようになったのかを紹介したいと思います。 AGESTの新卒エンジニアはこうい

Svelteと他JSフレームワークの比較 - Svelte不定期連載-01

こんにちは(こんばんは)、始まりました。 Svelte不定期連載その1です。 前回 はざっくりとSvelteKitを動かすまで、を書いてみました。 (SvelteKitのメジャーアップデートに伴って内容もアップデートしましたのでよかったら一読ください) 今回は、 Write less code をコンセプトとしたSvelteと他のJSフレームワークで、それぞれ書き方にどんな特徴があるのかを比較してみます。 Svelt

ReactでuseIdを使い一意な文字列を生成し汎用コンポーネントのid重複を防ぐ

はじめに こんにちは WESEEK で yaml から css まで何でも書く haruhikonyan です。 フォームなどをコンポーネント化したときに同じページにそのコンポーネントを使うと id の重複に困ったりしませんか? そんな時に React が公式で提供している useId という hook を使うと解決するかもしれません。 しかし利用においては注意点があるので具体例とともに紹介したいと思います。 use

Tanstack Query を活用したフロントエンドアーキテクチャの紹介 ~ 持続可能な開発を目指して ~

こんにちは。医療プラットフォーム第一本部プロダクト開発室所属エンジニアの髙橋です。 普段の業務では、 医療 SaaS プラットフォーム CLINICS の医療機関向けアプリケーション(以下、CLINICS)の開発を担当しています。 CLINICS では、昨年 10 月頃から React コードベースのリアーキテクチャに取り組んでいます。 その取り組みの 1 つとして、非同期状態管理に関連する実
技術ブログを絞り込む

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

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