［速報］Google、Geminiベースの新WebIDE「Project IDX」をオープンベータで公開 Googleは同社の最新生成AIであるGeminiをベースとした新しいWeb IDE「Project IDX」をオープンベータとして公開しました。 Project IDXは、モバイルやデスクトップなどのマルチプラットフォームに対応したフルスタックのWebアプリケーションを、さまざまなフレームワークや生成的AIの支援などを活用して効率的に開発するための、Webブラウザから利用可能な統合開発環境です。 これまでその存在は発表されていましたが、招待されたユーザーのみが利用可能でした。 We want to make generative AI accessible to every developer on the planet. That’s why we’re making Gemini
はじめに 先日開催されたTSKaigi 2024にて配信チームとして、オンライン配信のスタッフをしていました。 当日の各トラックの配信運営や総合的な環境構築などは他のメンバーを中心に行っていただきましたが、自分は配信画面のデザインや配信に乗せる情報管理用のシステムをコツコツ作っていたのでその紹介をさせていただきます。 情報管理用のシステムといってもローカルマシン上で動く簡単なもので、NodeCGと呼ばれるNode.js向けの配信画面管理用のフレームワークを利用しました。 NodeCGとは NodeCGは先ほど紹介したようにNode.jsとブラウザ技術で動的な配信画面を作成したり、管理画面を提供してくれるフレームワークです。 配信レイアウトとダッシュボードはブラウザ上で動作し、ダッシュボードで編集した情報を配信レイアウト側にWebSocketでリアルタイムに反映したり、WebSocketサー
こんにちは、ファインディ株式会社でフロントエンドのリードをしております 新福(@puku0x)です。 この記事では、転職サービス Findy の開発チームにおける開発生産性の向上に対する取り組みをご紹介します。 以前の状況 モノリスの解体 開発基盤の刷新 コンポーネント設計の刷新 テストの拡充 CI の高速化 改善の効果 まとめ 以前の状況 2020年頃の Findy は Ruby on Rails と React のモノリス構成で作られていました。 機能の増加に従いコードが複雑化し、しだいに開発スピードが伸び悩むようになりました。 ここで Findy Team+ で算出した当時のリードタイムを見てみましょう。 2020年のFindyのリードタイム 上記のグラフから次のことがわかります。 改修が本番に適用されるまで 約1週間 かかる プルリクエストがレビューされるまで 約5日 放置される
「とほほのWWW入門」管理人の杜甫々氏が、これまでの経歴と、「とほほのWWW入門」執筆時に気を付けていること、自身の趣味について話しました。全2回。前回はこちらから。 今まで勉強してきた言語 杜甫々：今日はYAPC、Perl（のイベント）なので、プログラミングに関してのことをちょっとしゃべります。 （スライドを示して）今までこんな言語の勉強だけしてきました。よく使う言語はC言語が最初で、C++、そこから掲示板を作っていた頃はPerl。そこからPHPに移って、今はPython、JavaScriptが多いですかね。あとはたまにAWKをまだ使っています。 Perlの好きなところ、今後サポートしてほしいところ （スライドを切り替えて）えっとー…。謝ります（笑）。 （会場拍手） ずいぶん昔にPerl入門を書いたんですが、ほったらかしになっていて。今回このお話をいただきまして「それじゃあ、やはりいかん
この本の概要 E2Eテスト（End-to-End Testing）とは，システムの端から端（End-to-End）まで，全体を通して行うソフトウェアテストを指します。本書ではE2Eテストを「ユーザーの視点でWebシステムの動作を確認する自動テスト」として定義し，E2Eテストをこれからプロジェクトに導入しようとしている人，すでに導入しているがパフォーマンスや保守性で課題を感じている人を対象に，E2Eテストのフレームワークとして近年人気が急上昇しているPlaywrightをツールとして，その目的からモダンなノウハウまで，E2Eテスト初心者の方にもわかりやすくハンズオンを交えながら解説します。CIへ組み込む方法やユニットテストとの棲み分けなど，E2Eテストを実際の開発現場に投入するうえでの知見も数多く紹介します。 こんな方におすすめ E2Eテストをこれからプロジェクトに導入しようとしている人 す
こんにちは、VPoEの北川です。 今回はトレタで現在使用している技術スタックについて紹介します。 創業時から稼働している予約・顧客台帳サービス「トレタ」から現在の注力事業のモバイルオーダーサービス「トレタO/X」までをあらためて振り返ってみると、まるで異なる技術スタックになっているので歴史的な背景などを辿りながら紹介していきます。 技術スタックの変遷 予約・顧客台帳「トレタ」 会社名にもなっている予約・顧客台帳の「トレタ」は創業当時から稼働している築11年ほどのシステムです。 サーバーサイドにはRubyとRubyOnRailsで作られた巨大なコードベースのAPIサーバーがあり、予約台帳のiOSアプリやウェブ予約などのWebアプリケーションなどが利用しています。 長年このモノリシックなシステムを成長させてきたので、以前からトレタを知ってくださっている人にはトレタはRubyの会社と認知されてい
TSKaigi 2024 で話した「Prettier の未来を考える」という発表のスピーカーノートです。スライドは こんにちは、今日は「Prettierの未来を考える」というタイトルでお話させていただきたいと思います。 鈴木 颯介と言います。ユビー株式会社でプロダクト開発エンジニアとして働きながら、筑波大学でパソコンの勉強をしています。オープンソースソフトウェアが好きで、今日お話するPrettierのメンテナーをしたり、トランスパイラのBabelのコミッターをしたりしています。最近はWebKitのJSエンジンにたくさんパッチを投げたりしています。 私が働いているユビーは、TSKaigiのGold Sponsorをさせてもらっています。ブースがあります。ユビーのグッズの他に、Prettierのステッカーも配布しておりますので、興味がある方はぜひお立ち寄りください。 まず、Prettierにつ
Google、フルスタックのWebアプリホスティング環境「Firebase App Hosting」パブリックプレビュー開始。AngularとNext.jsをサポート
Googleは日本時間5月15日と16日に開催したイベント「Google I/O 2024」で、Webアプリケーションのホスティング環境を提供する新サービス「Firebase App Hosting」のパブリックプレビューを発表しました。 Firebase App HostingはGitHubと接続することで、開発者がコードをGitHubにプッシュすると自動的にFirebase App Hostingにコードが取り込まれます。 取り込まれたコードはCloud Buildで自動的にビルドが行われて静的なコンテンツがレンダリングされ、動的なコンテンツはCloud Runにデプロイされ、Cloud CDNでコンテンツがキャッシュされることで、自動的にWebアプリケーションがデプロイされます。 対応するフレームワークはAngularとNext.jsです。いずれも手動での設定をすることなく、Fire
Google I/O 2024で発表されたFirebase App HostingでNext.jsのSSRを試す
先日のGoogle I/O 2024でFirebaseの新機能が発表されました。 これを読んでいて気になったのが、App Hostingという機能です。どうやらAngularとNext.jsのSSRをサポートしてくれるようになったようです。 自分はboobyというOSSコントリビュートしやすそうなリポジトリを探せるサービスを過去にリリースしています。 これのホスティング先として最初に検討していたのがFirebase Hostingでした。が、「？SSRどうやって動かすんだ？」と思いながらデプロイのための調査をしていたところ、どうやらCloudRunなどのサーバーサイドランタイムも使いながらでなければ動かせないということに行きつきました。 これまでやってきたCSRのHostingと異なり色々と手間が増えるなという結論に至り、結果初期構築が楽なVercelにデプロイすることにしました。当時の奮
Googleは2024年5月14日（米国時間）、Webベースの統合開発環境（IDE）「Project IDX」のβ版を提供開始した。 GoogleはProject IDX（以下、IDX）を2023年8月に立ち上げた。IDXは、「Google Cloud」上の事前設定済みの仮想マシン（VM）で動作する。開発環境をセットアップする手間をかけずに、フルスタックのマルチプラットフォームアプリケーション開発ができるAI（人工知能）支援型ワークスペースだ。 幅広いフレームワーク（Angular、Flutter、Next.js、React、Svelte、Vueなど）、言語、サービスをサポートし、さまざまなGoogleサービスと連携し、開発ワークフローを効率化できる。開発者は、さまざまなプラットフォームにわたって高品質なアプリケーションを迅速、簡単に構築し、リリースできる。既存のGitHubリポジトリとそ
JSer.info #693 - 次の記事では、Remix v3はReact Router v7としてリリースする予定という話が紹介されています。 Merging Remix and React Router | Remix RemixとReact Routerは、Viteとサーバ以外はほぼ同等の機能になってきています。 そのため、React RouterをRemixにマイグレーションするのではなく、React RouterをアップデートするだけでRemixの機能を使えるようにしたいという話が書かれています。 既存のRemixアプリは、import先のパッケージをreact-routerに変更するだけで動く予定とのことです。 この意思決定の詳細は、Xでも書かれています。 https://x.com/ryanflorence/status/1791479313939976313 React
TSKaigi2024の資料まとめ
はじめに 2024年5月11日に行われたTSKaigiの資料まとめです。 Track1 フロントエンドもバックエンドもインフラも… 全てをTypeScriptで統一したらこうなった！ TypeScript化の旅: Helpfeelが辿った試行錯誤と成功の道のり 新サービス Progate Path の演習で TypeScript を採用して見えた教材観点からの利点と課題 PMF達成の立役者！Full TypeScript Architecture の選定背景と構成 TypeScript 関数型バックエンド開発のリアル TypeScript の抽象構文木を用いた、数百を超える API の大規模リファクタリング戦略 Step by Stepで学ぶ、ADT(代数的データ型)、モナドからEffect-TSまで ハードウェアを動かすTypeScriptの世界 TypeScriptとGraphQLで実
Google、AI搭載クラウド開発環境Project IDXのベータ版を待機リストへの登録なしで利用可能に Gootleは2024年5月16日、同社の年次イベント「Google I/O 2024」にて、現在ベータ版として公開されているクラウド開発環境「Project IDX」が、待機リストへの登録不要で利用できるようになったことを発表した。 Start Building with Project IDX Today -Project IDX Blog Project IDXはWebブラウザから利用可能なクラウド上の統合開発環境で、Web、Android、iOSなどのマルチプラットフォームアプリ開発が可能で、アプリをCloud Runにデプロイする。GeminiベースのAIによる開発支援機能も装備されている。Angular、Astro、Flutter、Go、Next.js、Python/
JSer.info #694 - Next.js 15 RCがリリースされました。 Next.js 15 RC | Next.js React 19 RCに対応、React Compilerを実験的にサポート、Hydration Error表示の改善が行われています。 また、Fetch/GET Route Handler/Client Routerをデフォルトでキャッシュしないように変更、Partial Prerenderingのincrementalオプションを追加などの変更も行われています。 そのほかには、遅延処理をするnext/afterを追加、create-next-appのアップデート、非推奨だった@next/fontのサポート削除などが行われています。 SolidStart 1.0がリリースされました。 SolidStart 1.0: The Shape of Framewor
Today we are excited to share the next milestone in the evolution of Angular! Over the past three releases we’ve introduced a lot of new features and improvements. This time we focused on polishing the work we shipped by graduating many of the new APIs to stable, addressing common developer requests, and experimentally releasing one of the most desired roadmap projects: zoneless change detection.
FirebaseのバックエンドをGoogle Cloud SQLと接続「Firebase Data Connect」発表。AI用のベクトルサーチも可能に
FirebaseのバックエンドをGoogle Cloud SQLと接続「Firebase Data Connect」発表。AI用のベクトルサーチも可能に Googleは日本時間5月15日と16日に開催したイベント「Google I/O 2024」で、モバイルアプリケーション向けプラットフォーム「Firebase」の新機能として、バックエンドデータベースをGoogle Cloud SQLと接続する「Firebase Data Connect」を発表しました。 Firebaseが提供するバックエンドデータベースはNoSQLデータベースですが、Firebase Data Connectを利用することでFirebaseのバックエンドを通じて、Google Cloudが提供するCloud SQL Postgresデータベースサービスに接続できるようになります。 これによりクライアントアプリケーション
Google I/O 2024 is here, and just like in previous years, we have many new products and features to tell you about. But first, a look back. For years, millions of you developers have been using Firebase to accelerate your app development and run your apps with confidence. From Realtime Database to Remote Config, we’ve been obsessed with helping you speed up and simplify your work so that you can m
Reactでのダイアログの開閉制御については以前、別のエントリーで書きました。 ダイアログもアラートも、Reactで子コンポーネントの開閉管理を実装するVue3でも、何か簡単に書ける方法はないかと試行錯誤して、ちょっといい感じかな？という方針を見つけたので、備忘がてら技術ブログに書いておきます。 使いやすいダイアログAPIとは太古の昔より、便利なダイアログ機能というのは、呼び出し元はダイアログの開閉状態とか細かい制御は気にせず、必要な情報を渡して、結果だけもらうというものです。JavaScriptのブラウザのAPIにもありますよね。 const result = confirm("今日はいい天気でしたね") // OKのときはtrue console.log(result) これはVisual Basicとかでもなんでも同じですね。ただし、JavaScriptだとconfirm()、ale
戦史の探求 戦史の情報を整理し探求するサイトです。 古今東西の全てを対象とし、特に戦況図や作戦図に着目しながら戦略・作戦・戦術について思索します。 本資料は2024年前期にロシア軍内の一部で配布されたマスキロフカ（情報工作）の現場ノウハウの1つで、偽装網（カモフラージュ・ネット/カバー）で車両や陣地（塹壕、掩体壕、等）を隠蔽する際の注意事項を示している。小技１つで視認性が大きく変わり、敵に発見され砲撃/航空攻撃を受けるリスクが減少する。逆に言うと、兵士が怠りがちなポイントに関する教訓集でもある。 各手法は基本的には従来の教本で記されているものであった。（参照：2015, МАСКИРОВКА ВООРУЖЕНИЯ, ТЕХНИКИ И ОБЪЕКТОВ）つまり訓練においては各々はやったことがあるし、広く多くのことが書かれている。だが、そこには広く様々なパターンが各章ごとに焦点を絞り書かれて
モダンフロントエンドの境界線(2024年春)
あなたのモダンフロントエンドはどこから？ モダンフロントエンドとは、最新の技術とトレンドを取り入れた開発手法を指します。しかし、「モダン」とは一体どこから始まるのでしょう？Reactを使っていたら？クラウド上にHostingしていたら？最新のNextJSじゃないとダメ？人によって意見が分かれると思います。この記事では、2024年春時点で、どういう点を満たしていれば「モダン」なフロントエンドと言えるのか、自分なりにまとめています。 AltJS：TypeScriptによる静的型付け JavaScriptの柔軟性は開発者に多くの自由を与えますが、その自由が時にバグや予期しない動作を引き起こすこともあります。これに対して、TypeScript（TS）は静的型付けを導入することで、コードの信頼性とメンテナンス性を大幅に向上させる言語として、AltJSの地位を確立しています。 10年前、2014年頃の
I often envy those who can accurately estimate the time their tasks will take, particularly the seemingly small ones. Experience has taught me that it’s these ‘simple’ tasks that are often the most deceptive. What appears to be a 15-minute fix can unexpectedly turn into a bizarre edge case, transforming a supposed one-line code change into a day-long hunt for answers on the Wayback Machine. And ye
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
［速報］Google、Geminiベースの新WebIDE「Project IDX」をオープンベータで公開
TSKaigiは配信画面もTypeScript製だったという話
Findy転職フロントエンドの開発生産性を向上させるためにやったこと - Findy Tech Blog
「説明サイトとリファレンスサイトの両立を目指したい」 「とほほのWWW入門」管理者・杜甫々氏が執筆時に気をつけていること
［入門］Webフロントエンド E2E テスト――PlaywrightによるWebアプリの自動テストから良いテストの書き方まで
Next.jsとGoを使っていきます - トレタ開発者ブログ
TSKaigi 2024 Prettierの未来を考える スピーカーノート
Google、WebベースIDE「Project IDX」のβ版を提供開始
2024-05-19のJS: Remix + React Router = React Router、State of HTML 2023
Google、AI搭載クラウド開発環境Project IDXのベータ版を待機リストへの登録なしで利用可能に | gihyo.jp
2024-05-26のJS: Next.js 15 RC、SolidStart 1.0、Angular v18(zoneless)
Angular v18 is now available!
What's new in Firebase at I/O 2024
Vue3でモーダルダイアログの起動をいい感じに実装する | フューチャー技術ブログ
【陣地隠蔽における偽装網の現場ノウハウ＿2024年＿ロシア軍】 : 戦史の探求
Emil Dziewanowski - Technical Artist