はじめに先日、初心者でも簡単に参加できる GitHub チュートリアル 『First Contributions JA』を共同開発しました！ 振り返りも兼ねて、プロジェクトの背景や使用技術について、紹介していきます。 ▼ GitHub のリンク： なぜ First Contributions JA を構築したのか？さて、First Contributions JA には、次のような特徴があります： - React/ Next.js で構築されたWebサイト - 初心者向けのGitHubチュートリアル - オープンソースのプロジェクト 上記を踏まえて、プロジェクトの経緯は、主に２つあります。 （技術スタックは、後で詳しく説明します） 1. JavaScript/ React 学習コミュニティで、共同開発を提案した！以前、 「JavaScript/ React を学習するコミュニティを、期間限
Claude3.5、シンセサイザーつくれてすごい
import React, { useState, useCallback, useMemo } from 'react'; const AmbientSynth = () => { const [audioContext, setAudioContext] = useState(null); const [activeOscillators, setActiveOscillators] = useState({}); const initializeAudioContext = useCallback(() => { if (!audioContext) { const context = new (window.AudioContext || window.webkitAudioContext)(); setAudioContext(context); } }, [audioConte
「State of JavaScript 2023」公開。フロントエンドライブラリ利用率1位はReact、メタフレームワークはNext.jsなど、2万3500人のエンジニアが回答
JavaScriptに興味を持つ世界中のIT技術者2万3540人が回答したアンケートの結果をまとめた「State of JavaScript 2023」が公開されました。 回答者の国別分布を見ると米国が16％、フランスが7％、ドイツも7％、イギリス（UK）が5％、ポーランドが4％、ロシアが3％、カナダが3％などで、日本は2％（回答者280人）でした。 ここでは発表された内容から、多くの読者が興味を持つであろう、JavaScriptライブラリの人気など、結果の一部を紹介してみます。 フロントエンドフレームワークはReactが1位、2位にVue.js フロントエンドフレームワークの利用率ランキングはReactで、2位以下を引き離して8年連続1位、しかも利用率を伸ばしています。2位にはAngularを抜いてVue.jsが初めて入り、3位は昨年よりランクも利用率も落としたAngularとなりました
バックエンド視点で振り返るGraphQLを採用したプロダクト開発 - enechain Tech Blog
はじめに 技術スタック eScanチームにおけるGraphQLの使い方 開発フローの工夫 N+1問題の対応と注意点 エラーハンドリングの工夫 モニタリングの工夫 ドキュメンテーションを必須化するための工夫 その他の取り組み 振り返り 良かった点 難しかった点 今後の展望 最後に はじめに こんにちは、enechainでソフトウェアエンジニアをしている小沢です。 私が所属しているチーム(以降、eScanチーム)では、eScanという電力会社向けのリスクマネジメントシステムを開発・運用しており、その中でGraphQLを採用しています。すでにGraphQLを採用するメリット・デメリットについて様々なところで語られていますが、eScanチームでもオーバーフェッチが解消できる点、1リクエストで必要なデータをフェッチできる点などのメリットを享受するために採用しています。 今回は実際にGraphQLを採
Reactテスト駆動開発に一度挫折した人が、生成AIの力を借りて再挑戦する話 - Insight Edge Tech Blog
はじめに Insight EdgeのLead Engineerの日下です。 弊社ではフロントエンドのスクラッチ開発にReactを採用することが多いのですが、フロントエンドの保守性はしばしば課題となっています。 というのも、要求仕様が曖昧なPoC（Proof of Concept）の段階からMVP（Minimum Viable Product）として開発を進めることも多く、 ビジネス側ユーザの意見にも左右されながらアプリを改善していくため、画面のレイアウトやデザイン、画面遷移の変更が多発するためです。 こうした状況の中でスピードと品質を両立するためには良質なテストコードが不可欠なのはもちろん、 プロダクトコードとテストコードの双方とも、変化に対応しやすく作る必要があります。 過去にテスト駆動開発を挫折した要因 実は、筆者は過去にReactのテスト駆動開発の実践、および社内普及活動に挑戦したこ
newmoで活躍中の id:yaottiを訪問 | はてな卒業生訪問企画 [#10] - Hatena Developer Blog
![newmoで活躍中の id:yaottiを訪問 | はてな卒業生訪問企画 [#10] - Hatena Developer Blog](https://cdn-ak-scissors.b.st-hatena.com/image/square/ae8ff000a9f80353447c4315baf32d7dada6d46e/height=288;version=1;width=512/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fh%2Fhatenatech%2F20240618%2F20240618182821.jpg)
Kobe.tsとは TypeScriptとその周辺知識についての勉強会を開催していくコミュニティです。 なので、フロントエンドに限らず、node.js, Deno, Nest,js, Freshなどのバックエンドや、Firebase,Cloudflare,VercelなどのSaaS、npm,pnpm,Biome,tailwindCSS,Figmaなども取り扱うトピックの範囲です。 記事執筆時点でですが、立ち上げから3週間で既にメンバーが80人になりました。 神戸在住な方に限らず、ぜひメンバーになるボタンだけでも押していってください！！！ なぜ神戸？ 生まれてこのかた約30年、ずっと神戸に住んでいるからです。おそらくこれからも住み続けます。 そう断言できるのは、もちろん私が神戸を気に入っているからというのもありますが、職場が神戸にある妻と結婚したからです。 ソフトウェアエンジニアとしての性が
こんにちは、うしろのこです。直近1年ではVueから離れて、maja と呼ばれる組織管理基盤の新規プロダクトの開発をしていました。 プロダクトの話はこちら(maja)↓ note.st.inc 今回は、0->1における技術選定や開発中の工夫、結果どうだったかなどを書きます。 技術選定 初めに、前提条件は以下のような感じでした。 メンバーはReactの経験が豊富、フロントを触るのは多くて3,4人くらい 常にユーザー認証された状態で操作されるため、FE用のmiddleware的な層があるとうれしい toBアプリケーション せっかくなので使ったことのないものを使ってみよう、ということで、すでにWAFでの導入が進んでいたCloudflareの技術の採用をFEでも検討しました。少し触った感じではdeploy体験がよく、ローカル開発環境であるwranglerの出来も申し分なかったため、Cloudflar
サーバ側だけでフォーム画面をインタラクティブに！ 〜Hotwire を活用した「Ghost Formパターン」〜｜万葉
サーバ側だけでフォーム画面をインタラクティブに！ 〜Hotwire を活用した「Ghost Formパターン」〜 こんにちは、@nay3 です。 私はここ数年、仕事とプライベートの両方で Rails と Hotwire を使ってアプリケーション開発をしていますが、その中で、繰り返し使っているパターンがあります。 そのパターンは、とても便利なのですが、数ヶ月も間が空くと忘れてしまい、つい旧態依然としたコードから出発してまた同じところにたどり着く、ということを繰り返してしまいます。 実は、最近もまた繰り返してしまいました。 そこで、今後はすぐに思い出して再利用できるように、このパターンに「Ghost Form パターン」(※)という名前をつけて、記事化してしまうことにしました！ ※Ghost Form という名前については、レビュー協力をいただいた @tanaka51 さんの案を採用させていた
目次 目次 はじめに 企画LPの儚さ 企画LPをアーカイブする！ 仕様 開発について 技術選定 ちょっと技術の話 スクラム開発 ユーザーの反応 おわりに はじめに こんにちは！ ZOZOTOWN企画開発部・企画フロントエンド1ブロックの秋山です。ZOZOTOWNトップでは、セール訴求や新作アイテム訴求、未出店ブランドの期間限定ポップアップ、著名人コラボなどの企画イベントが毎日何かしら打ち出されています。私はそのプラットフォームとなる企画LPをメインに実装するチームに在籍しています。 チーム特性としては以下のようなものがあります！ クリエイティブコーディング寄りの実装をする機会に恵まれやすい 普段のLP案件内では、エンジニアよりも他職種（デザイナー、PM、ビジネス職）と連携することが多い 企画LPの儚さ 定常的なページと違って、開催期間が定まっている企画LPの命は儚いものです。月に20本ほど
Automatically replacing polyfill.io links with Cloudflare’s mirror for a safer Internet
Automatically replacing polyfill.io links with Cloudflare’s mirror for a safer Internet06/26/2024 polyfill.io, a popular JavaScript library service, can no longer be trusted and should be removed from websites. Multiple reports, corroborated with data seen by our own client-side security system, Page Shield, have shown that the polyfill service was being used, and could be used again, to inject ma
CloudFront Hosting Toolkitを使って静的Webサイト環境を作ってみた | DevelopersIO
手間をかけずにCloudFrontを使った静的Webサイトを作りたい こんにちは、のんピ(@non____97)です。 皆さんは手間をかけずにCloudFrontを使った静的Webサイトを作りたいなと思ったことはありますか? 私はあります。 過去にAWS CDKを使ってこの思いを実現したことがありますが、一からAWS CDKを作り込むのはなかなか大変でした。 そんな苦労はCloudFront Hosting Toolkitを使用すると少し解消されるかもしれません。 CloudFront Hosting ToolkitはCLIまたはAWS CDKでフロントエンドのホスティングとCI/CDパイプラインを用意するツールです。 今だとAmplifyを使えば良いのではないか? という声も聞こえてきますが、細かいカスタマイズを行いたい場合にCloudFront周りを直接操作したい場合があります。そうい
はじめに こんにちは、令和トラベルでフロントエンドエンジニアをしているyamatsumです。 令和トラベルでは、海外旅行におけるあたらしい体験を目指す海外ツアー・ホテル予約アプリ「NEWT（ニュート）」を提供しています。NEWTではWebアプリを提供しており、Webアプリのパフォーマンスにおいて、画像は非常に重要な要素です。特に、ページの読み込み速度はカスタマー体験に直結するため、画像の最適化は欠かせません。Next.jsのImageコンポーネントは、画像最適化を容易にし、Webパフォーマンスを向上させる強力なツールです。 この記事では、next/imageのコア機能を3つのセクションに分けて解説し、Next.jsで画像最適化を行う方法を具体的に説明します🗺️ ※ この記事はVercel Meeetup #1で共有した内容を記事にしたものです。 next/imageの主要機能 React
はじめに 現代の人に名著以外の本を読むような時間はない こんにちは、Watanabe Jin (@Sicut_study)です みなさんは何か新しい技術を学ぶときにどんなコンテンツを利用するでしょうか？ 最近ではUdemyなどの動画講座を利用する人が多いと思いますが、本を読んで学ぶという人もまだまだ多いのではないかと思います 今回は私がこれまで5年間読んできた150冊以上の中から厳選した30冊の本を紹介します。広く多くの人に役立つものから、特定の技術の書籍までどれを読んでもあなたの大切な一冊になるのでぜひ読んでみてください 現代人には時間がない なぜ働いていると本が読めなくなるのかという本が話題になりました 現代人は本を読む時間がなくなっています。 仕事に追われてしまい、プライベートで本を読む暇などなくなっているのです。 しかし、エンジニアは「技術職」なのでプライベートの時間でも学習をして
June 23, 2024 — Regardless if you specialize in React, Rails, Django, Next, Java, C#, or ObjectiveC, you probably use templates to start new projects. Templates generate a handful of files like readme.md, .gitignore, and main. They also initialize a handful of directories like src/ and tests/. What if it was even easier to make, edit and use these templates? Introducing Stamp, a mini-language (onl
GitHub - jsdotlua/react-lua: A comprehensive, but not exhaustive, translation of upstream ReactJS 17.x into Lua.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
It’s not just you, Next.js is getting harder to use I wrote a blog post the other day about how Next.js Middleware can be useful for working around some of the restrictions imposed by server components. This led to some fun discussions in the world about whether this was a reasonable approach or if Next.js DX was just... bad. From my perspective, Next.js’ App Router has two major problems that mak
はてなブログ独自の集計による人気記事のランキング。6月16日（日）から6月22日（土）〔2024年6月第4週〕のトップ30です*1。 # タイトル／著者とブックマーク 1 どうすれば相手の意見を変えられるのか──『エビデンスを嫌う人たち: 科学否定論者は何を考え、どう説得できるのか?』 - 基本読書 by id:huyukiitoichi 2 増田へのお返事（Mrs.GREEN APPLEの『コロンブス』について） - lady_jokerのはてなブログ by id:lady_joker 3 高度に発達したウォーターフォールはアジャイルと見分けがつかない - An Epicurean by id:Songmu 4 脳に収まるコードの書き方を読んだ。面白かった。 - Mitsuyuki.Shiiba by id:bufferings 5 Win95時代より1000倍速いはずなのにPCちっとも
RubyKaigi 2024 キーノートレポート Samuel Williamsさん「Leveraging Falcon and Rails for Real-Time Interactivity」 ～RubyKaigi 2024 2日目キーノート RubyKaigi 2024レポートの第二弾です。今回は2日目の、Samuel Williamsさんによる「Leveraging Falcon and Rails for Real-Time Interactivity」という基調講演です。本発表ではRubyの非同期IOや並行処理を前提としたリアルタイム処理、そしてタイトルにあるようにRailsとの連携が主な話題となります。 前提知識 Samuelさんは過去にRubyKaigi 2019とRubyKaigi 2023に登壇しました。 2019年のときは、TCP Serverにおける、よくあるfo
Render hooks とは、ReactにおいてカスタムフックからJSX式を返す設計パターンのことです。リンク先は私が当時在籍していた会社のテックブログに書いた記事で、当時の会社でこの設計パターンがハマる箇所に出会ったためアイデアを記事化したものです。ちなみに、Render hooksという命名は私ではなく当時の私の上司です。 私は当時から今までずっとこのパターンを推奨しているのですが、あまり流行る気配がありません。そこで、この記事では皆さんがこのパターンの考え方にもう少し納得できるように、render hooksパターンは普通のコンポーネントの拡張であるという見方をご紹介します。 Render hooksパターンの概要 Render hooksパターンは、UIの実装（JSX）と、そのUIに関連するロジック（たとえばステート）をまとめてカスタムフックから提供することを指します。簡単な例を
【初心者ハンズオン】ReactでTODOアプリを作ってデプロイしよう【Firebase/Shadcn/TailwindCSS】 - Qiita
【初心者ハンズオン】ReactでTODOアプリを作ってデプロイしよう【Firebase/Shadcn/TailwindCSS】TypeScriptFirebaseハンズオンReact はじめに 今回のハンズオンではReactをこれからやっていきたい人に向けてTODOアプリを作りながらReactの基本的な使い方から実際にアプリケーションをデプロイしてユーザーが使えるリリースまでを行えます。 アプリケーションはとてもシンプルなものですので、短時間で学習することが可能です 初心者向けに本記事は書いておりますので、丁寧にセットアップから紹介していきます。 JavaScriptなどの前提知識は不要で、HTMLとCSSの知識があれば行っていただけます またこのハンズオンでは最近人気がでているShadcn/uiを活用しており、学習した後に簡単にカスタマイズをしていただけるはずです。 ハンズオンだけでは使
はじめに リアルタイムでみんなの反応が見れるアプリ、作りたいですよね。 X や instagram など各種 SNS では、何かアクションがあれば通知に数字がつきます。 Slack や Chatwork でも同じですね。メンションされたらチャンネルに数字がつきます。 モンスターハンターは凄まじいです。 最大4名のプレイヤーで同じモンスターを狩るのですが、どこに誰がいるかリアルタイムで確認できます。 ディアボロスに追いかけ回されながら、半泣きで逃げ回っているとき、共闘しているはずのプレイヤーがホームから動かなかったり、明らかに素材集めに勤しんでいたらx意が湧きます。 このようなリアルタイム通信を実現するために、どのような方法があるか探したところ WebSocket WebRTC SSE(Server-Send Events) というものが見つかりました。 WebSocket を試したい 本当
Conformで作るWeb標準なフォーム
Conformの概要 Conformは、RemixやNext.jsのようなフレームワークをサポートしており、クライアントサイドとサーバーサイドのフォームバリデーションを同じ記述で書くことができるライブラリです。RemixやServer Actionsの台頭により、ZennでもConformを紹介する記事がいくつか投稿されています。 今回は「Conformを使うとWeb標準なフォームを作ることになる」という別の観点でConformについて紹介します。ReactではJavaScriptでフォームの状態を管理することが当たり前になっており、仮にフォームのマークアップが正しくなかったとしても入力〜バリデーション〜送信まで機能を作ることができてしまいます。 SPA時代からエンジニアになった自分のようなエンジニアは、正しいフォームのマークアップを知らないことが多いかもしれません。Conformが生成す
One Million Checkboxes
One million checkboxes that anyone can check Jun 25, 2024 Hi. It’s Nolen (eieio) from the future, a day and half after I posted this. Since launch, One Million Checkboxes has been played by over half a million people. We’ve checked something like 100 million checkboxes. I have spun up a lot more infrasture and made a lot of changes. My description of how the site works is out of date. I’m too busy
はじめに Google Chrome 126 から、組み込みの生成AI機能(Gemini Nano)が使えるようになったので、翻訳のデモサイトを作ってみました。 有効化できる環境とできない環境があるみたいです。私の環境でも、Chrome Canary 127で使えていたものが、突然使えなくなったりしました。 2024年6月24日現在、私の環境では以下の環境で利用を確認しています。Chrome dev (128.0.6535.2) では利用できていません。 mac OS Sonoma 14.1.1（23B81） Macbook Air M2 （2022） Chrome Canary 128.0.6553.0（Official Build）canary （arm64） 作ったサイト 左側に文章を入れて、セレクトボックスで言語指定をすると、自動で翻訳されます。動画内でも分かる通り、オフラインで動
案件でUIライブラリの shadcn/ui を利用しているのですが React Hook Form との連携に少しクセがあるので連携を深堀りしてみます。 shadcn/ui は React Hook Form に依存しているのでフォームライブラリは基本的にはReact Hook Form一択になるかと思います。 FormFieldコンポーネントを使って連携 連携方法のベースはshadcn/uiの公式サイトで解説されています。 公式サイトのコード 公式サイトでサンプルコードとして以下のような実装が提示されています。 "use client" import { zodResolver } from "@hookform/resolvers/zod" import { useForm } from "react-hook-form" import { z } from "zod" import
自ブログからの引用です。 概要 言うまでもなくプログラミングを書く場合は英単語を利用するのが一般的であり、普段それについて疑いを持つことはほとんどないのではないかと思います。私自身、新規プロダクトの立ち上げで設計する際 にも「日本語で書くか？」という議論した経験はありません。 しかしながら、DX(Digital Transformation)やDDD(Domain Driven Design)の潮流を考えると、多くの場面で単語の持つ細かなニュアンスへの重みが増してきていると感じます。 本記事では、日本語でプログラミングすることに関する周辺環境と個人的な見解をまとめます。 前提 想定読者 => 国内産業向けのサービス開発おいて日本人のエンジニアで構成された開発チーム 平均的なメンバーはTOEIC500~700点程度の所謂英語が読めるレベルのエンジニアで構成される 技術スタック => Webエ
import type { Meta, StoryObj } from '@storybook/react'; import Button from './Button'; const meta: Meta<typeof Button> = { component: Button, }; export default meta; ... 変換したい箇所と内容をまとめると以下の通りです。 @storybook/react の import 文に Meta を追加する export default のオブジェクトを meta 変数に変更し、型注釈を設定する 相対パスで import しているコンポーネントの型を指定する export default を meta オブジェクトに変更する コンポーネントの型が動的に変わりますが、変更内容は共通しているため、AST を使って一気に変換できそうです。
フロントエンドの状態管理ツールの１つである Recoil。状態管理したい変数を atom や selector に定義し、get や set、reset で、取得、更新、初期化する、というのが基本的な使い方なんだと理解しました。ただ、Recoil 初心者としては、useRecoilState や useRecoilValue などの React hooks との違いがいまいちピンと来なかったので、整理しました。 Recoil とは Recoil は React のための状態管理ライブラリで、コンポーネント間での状態共有を簡単にすることを目的としています。Recoil では、Atom と Selector、そしてそれらを利用するためのいくつかの hooks が提供されています。 Atom と Selector Atom: Recoil の状態管理の基礎となる概念で、管理したい変数の状態を定義
git add . git commit -m "コメント" git push origin main AWSコンソールからamplifyを開いてgithubからデプロイ その際のamplify.yml version: 1 frontend: phases: preBuild: commands: - cd amplifyapp - npm ci build: commands: - npm run build artifacts: baseDirectory: build files: - '**/*' cache: paths: - node_modules/**/*
モノレポ用ツールパッケージマネージャーが提供するWorkspace機能だけでも十分にモノレポを構成することができますが、モノレポ用ツールを使用するとより簡単にモノレポを構成することができます。また、モノレポ用ツールが提供するCache機能を使用するとBuildやCIなどをより高速に実行することができます。 JavaScript プロジェクトのためのモノレポ用ツールにはLerna、Nx、Turborepoがあります。 LernaLernaはオープンソースで開発、管理されています。オープンソースコミュニティだけでは管理が難しく、Nxに引き継がれました。 Lerna: https://lerna.js.org/現在もLernaを使用することはできますが、Nxに引き継がれたため、Nxが自分たちのツールほどLernaをサポートするかは確実ではないため、Lernaを使用するのであればNxを使用するか、
![[JavaScript] モノレポ(Monorepo)のためのツール](https://cdn-ak-scissors.b.st-hatena.com/image/square/1abe969d1a0e7850c493409c00e52d8aa591de06/height=288;version=1;width=512/https%3A%2F%2Fdeku.posstree.com%2Fassets%2Fimages%2Fcategory%2Fenvironment%2F2024%2Fmonorepo%2Fbackground.jpg)
堕天使っていいよね…。アルカナディアのルミティアが堕天使に！？「ルミティア ReACT-A」のレビュー - プラモデルを推すブログ byユネプラ
株式会社コトブキヤの新シリーズ「アルカナディア」から登場した「ルミティア ReACT-A」は、「ルミティア」が堕天したかのようなカラーリング。新規描きおろしの表情パーツが魅力のプラモデル。この記事では、その特徴と魅力を詳しくレビューします。 「アルカナディア ルミティア ReACT-A」とはどのようなキャラクター？ 「アルカナディア」とはどのようなブランド？ イラストレーターの「necomi」氏とは？ 「アルカナディア ルミティア ReACT-A」の価格・発売月・スケール・製品サイズ 「アルカナディア ルミティア ReACT-A」のノーマルモード 「アルカナディア ルミティア ReACT-A」のウィライズモード 「アルカナディア ルミティア ReACT-A」の表情パーツ 「アルカナディア ルミティア ReACT-A」の大型の翼 「アルカナディア ルミティア ReACT-A」の専用武器 「ア
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
「GitHub難しい!!」を30分で解決するサイトを共同開発しました🚀｜kazzyfrog
知っておくと仕事が捗る便利ツール17選 - Qiita
React Server Componentsを理解したい
Playwrightでメール配信のテスト自動化にチャレンジ！ - JX通信社エンジニアブログ
【useEffect】初回にも実行されて困るなら《何をキッカケに、どう更新されるか》を見直せ - Qiita
神戸でKobe.tsというTypeScriptコミュニティを立ち上げた話
Remix x Cloudflare Workersで0->1 - STORES Product Blog
リアルタイムで誰でも入力できる100万個ものチェックボックスを作成した猛者が登場
5分でできる！GitHub README プロフィール 💬 - Qiita
ZOZOTOWNの企画LPをアーカイブする！ - ZOZO TECH BLOG
画像最適化の舞台裏をのぞき見👀してnext/imageを使いこなす
読まないと後悔する技術書30選 - Qiita
Stamp: a mini-language for project templates
【実践Claude3.5 Sonnet】業務効率を上げるデータ分析＆自動スライド作成術｜ChatGPT研究所
It’s not just you, Next.js is getting harder to use
今週のはてなブログランキング〔2024年6月第4週〕 - 週刊はてなブログ
Samuel Williamsさん「Leveraging Falcon and Rails for Real-Time Interactivity」 ～RubyKaigi 2024 2日目キーノート | gihyo.jp
Render hooksをコンポーネントの拡張として理解する - Qiita
エンジニア2年目経験なし。1年で給料を2倍にしたキャリア戦略 - Qiita
みんなで粘土をこねる web アプリを hono で作った
Chromeの組み込みGemini Nanoで、完全オフラインで使える翻訳サイトを作った
shadcn/uiとReact Hook Formの連携を深堀りしてみる
Webエンジニアはそろそろ日本語変数名の利用を検討してもいいのでは？
大量のコードを TypeScript の AST で一気に置き換えよう
Recoil get/setとuseRecoilStateの使い分け
【AWS】amplifyでreactアプリをデプロイしたが404エラー - Qiita
[JavaScript] モノレポ(Monorepo)のためのツール