こんにちは、XI本部プロダクトイノベーションセンターの瀧川亮弘です。 現在、Next.jsのStatic Exportsにより、Webサイトの構築を行っています。 本記事ではStatic Exportsのi18n(多言語)対応の実装方法を紹介します。 Static ExportsはNext.jsのアプリケー…

こんにちは、X（クロス）イノベーション本部 ソフトウェアデザインセンター セキュリティグループの大西です。現在、TypeScriptとReactを使ってWebアプリを開発していますが、フロントエンドの実装を任された際にLinkifyとMUI(Material UI)を合わせて使う場…

電通国際情報サービス、オープンイノベーションラボの比嘉康雄です。 今回は、Expoの公式チュートリアルをやっていきたいと思います。 プロジェクトの作成 Download assets Install dependencies アプリの実行 コードの編集 テキストの文字色の変更 イメージ…

電通国際情報サービス、オープンイノベーションラボの比嘉康雄です。 今回は、Expoに入門します。 Expo とは、開発者が React Native 単体で開発した場合に意識しないといけなかったネイティブ部分を隠蔽して、アプリケーション本体の開発をより Web アプリ…

こんにちは。Xイノベーション本部ソフトウェアデザインセンターの陳です。 この記事ではNext.jsのgetServerSidePropsの利用でハマったことについて話します。 Server-side Rendering（SSR）とgetServerSideProps Server-side Renderingはリクエストごとにサ…

みなさんこんにちは、X イノベーション本部ソフトウェアデザインセンターの徳山です。 本記事は電通国際情報サービス Advent Calendar 2022 12月9日の記事です。 ISID に入社して1 ヶ月ばかりですが、今まで携わってこなかった技術領域に触れる機会が増えそ…

本記事は電通国際情報サービス Advent Calendar 2022の8日目の記事です。 執筆者は Xイノベーション本部 AI トランスフォーメーションセンター所属の山田です。 この記事では先日（2022年11月中旬）に安定版がリリースされた Nuxt 3 について紹介します。 な…

はじめに Cypress 導入、操作手順 テストコードの実装方法 お気に入りポイント TypeScript対応 Custom Commands cypress/support/commands.ts cypress/support/e2e.ts fixture cypress/fixtures/users.json cypress/support/e2e.ts ハマりポイント iframe ド…

こんにちは。ISID コミュニケーションIT事業部 瀧川亮弘（あきひろ）です。 プロジェクトにてStorybookを利用しています。 Storybookの概要と基本的な実装方法をお伝えできればと思います。 Storybookとは？ 一言でいうとUIのカタログです。また、それを作成…

皆さん、こんにちは。Xイノベーション本部ソフトウェアデザインセンターの陳 欣瑩です。 デザイナーが作ったデザインカンプを実現するのが大変！という悩みを抱えているエンジニアは多いでしょう。 フロントエンド開発をラクにするために、世の中にはデザイ…

電通国際情報サービス、クロスイノベーション本部、オープンイノベーションラボの比嘉康雄です。今回取り上げるのはTailwind CSS。 Tailwind CSSは、最近人気急上昇のCSSフレームワークです。 メジャーなBootstrapなどのフレームワークは、あらかじめ見栄え…

こんにちは、ISID デジタルビジネス推進室の浦本です。好きな食べ物は生八ツ橋です。 本記事は 電通国際情報サービス Advent Calendar 2021 の24日目の記事です。 はじめに 皆さんは、npmでインストールした依存パッケージを定期的に更新されていますか？ 「…

本記事は電通国際情報サービス Advent Calendar 2021の 13 日目の記事です。 執筆者は 2021 年新卒入社の XI 本部 AI トランスフォーメンションセンター所属の山田です。 はじめに React Hooks とは useState useState を使うユースケース useEffect useEffe…