並び順

ブックマーク数

期間指定

  • から
  • まで

1 - 40 件 / 47件

新着順 人気順

Remixの検索結果1 - 40 件 / 47件

  • Ajaxから始まった一つの時代の終わり

    最近の流れを見ていての感想文なので、ideaとして投稿します。筆者のバックグラウンドとしては、Remixの商業記事を書いたり、App Routerの商業記事を書いたりしている人です。 さて、筆者は2022年の秋から、社内システムではありますがRemixをプロダクション運用しています。また、Next.jsのApp Routerについても、パラダイムとしてはRemixにインスパイアされた部分が多い[1]おかげで、順調にキャッチアップできています。 RemixとApp Routerは、ルーティングとデータフェッチを高度に統合しており、Progressively Enhanced SPA(PESPA)と呼ばれることもあるそうです。PESPAについては、次の記事が話題になりましたね。 このPESPAであるRemixを実運用する中で、フレームワークの手触りが近年触ってきたものと大きく違っている点があっ

      Ajaxから始まった一つの時代の終わり
    • You Don't Need Next.js | ドクセル

      [beta] Next.jsクイズ2 • <p>にはなにが表示されるでしょうか? /app/page.tsx "use client"; import { useCallback, useEffect, useState } from "react"; export default function Home() { const [date, setDate] = useState(); const fetchDate = useCallback(async () => { const response = await fetch("/api"); const data = await response.json(); setDate(data.date); }, []); useEffect(() => { fetchDate(); }, [fetchDate]); return ( <

        You Don't Need Next.js | ドクセル
      • ssig33: "最近最小限のReactアプリを作るのに使ってるもの についてとりあえずメモしとく。 ##..."

        新人声優 +81-9014502501 mail@ssig33.com 0088-7709-7529 it/it. my opinion may be not my own. but my fate is my own. 最近最小限のReactアプリを作るのに使ってるもの についてとりあえずメモしとく。 前提: デカいフレームワークは使わない next.js, Astro, Remixは使わない。next.jsとAstroは大好きなのだが、社内向けとか個人用とか小さいアプリに使うにはあきらかに恐竜であると思う。Remixは大好きではない。 前提: SSRしない SSRもSSGもISGもしない。CSRでいい。SSRしたいならReactをそもそもぶん投げたほうが(個人レベルなら)いいと思ってる。それがほしいならPHPやRails でええ。今更RailsでView書きたくないとか思うかもしれない

          ssig33: "最近最小限のReactアプリを作るのに使ってるもの についてとりあえずメモしとく。 ##..."
        • SPAの歴史とRemix SPAモードという到達点 / the SPA's chronicle reaches to remix

          Niigata 5分 Tech #4と、モニクル社の社内LT大会で喋ったやつです https://niigata-5min-tech.connpass.com/event/307076/

            SPAの歴史とRemix SPAモードという到達点 / the SPA's chronicle reaches to remix
          • 一休レストランで Next.js App Router から Remix に乗り換えた話 - 一休.com Developers Blog

            このエントリーは一休.com Advent Calendar 2023の15日目の記事になります。 CTO 室の恩田です。 現在は一休レストランのフロントエンドのリアーキテクトを手がけています。 今日はその中で Next.js App Router から Remix に乗り換えた話をご紹介したいと思います*1。 背景 6日目の記事で香西から紹介させていただきましたが、2023年10月に一休レストランのスマートフォン用レストラン詳細ページをリニューアルしました。 一休レストランの Rust バックエンドが正式リリースされました。https://t.co/7N4VGv5ej9 このページのスマートフォンビューはバックエンドが Rust で書かれた GraphQL になってます— naoya (@naoya_ito) 2023年10月4日 ちなみにフロントエンドも、旧バージョンは Nuxt v2

              一休レストランで Next.js App Router から Remix に乗り換えた話 - 一休.com Developers Blog
            • Why I Won't Use Next.js

              You’ve got a new project to work on. Or you’ve got an existing project you’re motivated to upgrade to a more modern approach. Or perhaps you’re dissatisfied with your current modern framework or second-guessing yourself and you’re investigating alternatives. In any case, you’ve got a decision to make. There are lots of “modern” frameworks to choose from. Even if you’re not facing this choice right

                Why I Won't Use Next.js
              • 次世代フレームワークRemixで簡単なフルスタック開発を体験する - RAKUS Developers Blog | ラクス エンジニアブログ

                はじめに こんにちは。フロントエンド開発課に所属している新卒1年目のm_you_sanと申します。 最近話題のRemixを使って、シンプルなTodoアプリを作成する方法をご紹介します。 Todoアプリの作成を通じて、簡単なフルスタック開発を体験していただければと思います。 はじめに プロジェクトの作成 モデルの定義 Root Routeについて ルーティングについて 一覧画面の作成 新規追加画面の作成 編集画面の作成 削除機能の追加 まとめ プロジェクトの作成 はじめに以下のコマンドを実行して、プロジェクトを作成します。 ※Node.js v18以上、npm v7以上がインストールされていることが前提です。 npx create-remix@latest --template remix-run/indie-stack 今回はindie-stackというテンプレートを使用しています。 この

                  次世代フレームワークRemixで簡単なフルスタック開発を体験する - RAKUS Developers Blog | ラクス エンジニアブログ
                • Next.js に対する Kent C. Dodds の批判と、Lee Robinson のアンサーの要約

                  Next.js に対する Kent C. Dodds の批判と、Lee Robinson のアンサーの要約 はじめに 10 月 26 日に Next.js Conf が開催されましたが、それと前後して Kent C. Dodds (以下 kentcdodds と呼びます) と Lee Robinson (以下 leerob と呼びます) がそれぞれ という記事を公開しました。前者はタイトルの通り、Testing Library の作者であり、Remix の共同創業者の一人でもある開発者兼教育者 kentcdodds が、Next.js を使わない理由について述べたものです。そして後者は、Vercel の VP of Developer Experience である leerob が、主に前者に対する反論を述べたものです。筆者は両方の記事を公開後すぐに面白く読み、そしてどちらにも頷けるところ

                    Next.js に対する Kent C. Dodds の批判と、Lee Robinson のアンサーの要約
                  • 個人開発アプリをRemix + Cloudflare D1に移行してみた

                    この記事は『blessing software 夏のブログリレー企画』の5日目の記事です。 昨日はasukaさん(@a_skua)の「Flutterを用いたWeb開発の今後について考える」が公開されました。 次回はKanonさん(@samurai_se)の「私がエンジニア勉強会を作り、ブログリレーを主催するまで」です! はじめに 以前、Type Challenges Judgeという、type-challengesのオンラインジャッジを作りました。 Type Challenges Judgeは、type-challengesの問題の回答の正誤判定を行ったり、自分がどれくらい正解したかや、他の人の回答が確認できるアプリです。 このアプリをRemix + Cloudflare(Pages、D1)に移行してみた[1]ので、やったことについて書こうと思います。 技術スタックについて Type Ch

                      個人開発アプリをRemix + Cloudflare D1に移行してみた
                    • Remix入門: フロントエンドもバックエンドも爆速開発を実現する次世代Webフレームワーク

                      こんにちは!Acompanyのマッケイです! この記事は Acompany5周年アドベントカレンダー 11日目 の記事です。 今回はAcompanyのプロダクト開発でも活用しているRemixを開発環境で使ってみた所感を書いていこうと思います。 Hello,Remix Remixは、Reactをベースとしたフルスタックフレームワークです。 Reactを魔改造して色々できるようにしようぜ、という昨今のモダンフレームワークに習うように、RemixもReactに厚化粧をした"React"フレームワークです。 書き心地はそのままReactですが、気づいたらサーバーサイドのコードを書いており、気づいたらデータベースをいじっているというなんとも不思議な経験ができるフレームワークです。 フルスタックフレームワークを使っているというよりは、Reactで開発しながら、サーバーサイドの処理も同時に書けるのがRe

                        Remix入門: フロントエンドもバックエンドも爆速開発を実現する次世代Webフレームワーク
                      • Why I'm Using Next.js

                        We want the default build output of Next.js to work well when self hosting, and also well on Vercel. And guess what? They're the same output. Well, almost. Let me clarify. It took us a while at Vercel to figure out the correct format and boundary between open source framework and infrastructure platform. Our philosophy is called framework defined infrastructure. And critically, the specification t

                          Why I'm Using Next.js
                        • フロントエンドのキャッチアップ大変だよねという話 2023

                          はじめに この記事は GENDA Advent Calendar 2023 13日目の記事です。 株式会社GENDA FE/BEエンジニアの shinnoki です。今年は自分にとって色々と変化のあった年で、年初にはアーリーのスタートアップでCTOを務めておりましたが、ご縁があり8月にGENDAに入社いたしました。 最近社員インタビューも公開されて入社の経緯なども触れていただいたため、興味があればぜひご覧ください。 今年は個人的にあまり最新技術のキャッチアップができていなかったことを差し引いても、フロントエンド界隈では激動の1年だったのではないでしょうか。 最新技術のキャッチアップが大変なのはフロントエンドに限ったことではなくどの領域においても発生する話ですが、フロントエンドは特に大変だよねという話は周囲からもよく聞くため、感覚として間違っていないと思います。 これらとどう付き合っていくか

                            フロントエンドのキャッチアップ大変だよねという話 2023
                          • Remix の SPA モード

                            Remix の SPA モード 2024.01.14 Remix は React のフルスタックフレームワークで、Web 標準に基づいた API で構築されていることが特徴です。Node.js のようなサーバーサイドの JavaScript 環境で動作することを前提としています。しかし、現実の世界ではサーバーを用意せずに、静的なファイルをホスティングするだけの環境で Web アプリケーションを構築することが有効な場合も多くあります。このような需要を満たすために、Remix v2.5.0 から実験的に SPA モードが導入されました。 Remix は React のフルスタックフレームワークで、Web 標準に基づいて構築されていることが特徴です。例えばデータのミューテーションはクライアントからサーバーの API をコールするのではなく、HTML のフォームを使って行うといます。また Resp

                              Remix の SPA モード
                            • Remix vs Next.js - React Japan

                              私たちに最も寄せられる質問は次のようなものです: RemixはNext.jsと一体どう違うの? この記事では私たちはこの質問を答えるべきのようです!私たちはこの議題をストレートに、そして何の感情的な議論なしに言及していきたいと思います。もしあなたがRemixのファンになってくれていて、この記事を見て、今すぐにでもNextよりもRemixの方がすごいぜ 😎、と自慢するようなツイートをしたい気持ちが出てきたとしても、もしできれば、自慢するというような形ではツイートをなるべくしないようにお願いしたいです。私たちは Vercel で働いている方々と Vercel が立ち上がる前から友達です。そして、彼らのやっていることはとても素晴らしく、私たちは彼らを尊敬しています。 ただ、勘違いをしてほしくないのは、私たちはRemixはNext.jsよりも優れている特徴があると思っています。(そうでなければ、

                                Remix vs Next.js - React Japan
                              • 私がエッジを使う理由

                                Workers Teck Tolks in Osaka #1

                                  私がエッジを使う理由
                                • RemixでWeb標準を学んだ1年間 / First year with Remix

                                  フロントエンドの技術選定 ~2023を振り返る~ Lunch LT での発表資料です https://findy.connpass.com/event/306714/

                                    RemixでWeb標準を学んだ1年間 / First year with Remix
                                  • 一休レストランで Next.js App Router から Remix に乗り換えた話 / Migration from Next.js App Router to Remix

                                    一休レストランで Next.js App Router から Remix に乗り換えた話 / Migration from Next.js App Router to Remix

                                      一休レストランで Next.js App Router から Remix に乗り換えた話 / Migration from Next.js App Router to Remix
                                    • 検索システムのフロントを SSR・Remix で作り直した - Unyablog.

                                      かなり昔に Elasticsearch ベースの検索システム(Heineken)を作っていた。 Elasticsearch で部内 Wiki 検索高速化 - Speaker Deck 特に更新せず数年動かしていたのだけど、サーバーの置き換えに伴って Kubernetes に置きたいよねという話になり、ついでに Elasticsearch も新しくしたいよね、となった結果、現状のフロントエンドだと最新の Elasticsearch では動かないということがわかった。 nonylene.hatenablog.jp フロントエンドの改修が必要なわけだが、ここでフロントエンドの構成を見ると… FlowType create-react-app PureComponent Bootstrap 3 古すぎる!絶対アップデート難しいし触りたくない技術しかない。 フロントまわりの構成を変えたいとずっと思っ

                                        検索システムのフロントを SSR・Remix で作り直した - Unyablog.
                                      • Remix + Cloudflare Workers + D1 + KV + Queue + R2 + DOで簡単なアプリを作る

                                        Remix + Cloudflare Pages/WorkersをベースにD1とKVと組み合わせた構成で作るアプリの解説は巷に結構あるが、それらに加えてQueueやR2なども合わせた参照実装みたいなものが見当たらなかったので作った。 このアプリの機能は下記。 Googleアカウントを用いたOAuthログイン セッション管理にKV,ユーザー管理にD1を使う はてブのようなブックマーク機能(基本的なCRUD) URLとコメントを入力してD1へデータ登録できる URLの先のページからOGPを取得して登録 QueueのProducerとConsumerを使って非同期にタイトルと画像を取得 取得した画像はR2にアップロードする URLごとにブックマーク数を管理する Durable Object(DO)を使う。 Cron Trigger ついでに追加。アプリ的には不要だがせっかくなので設定だけしておく

                                          Remix + Cloudflare Workers + D1 + KV + Queue + R2 + DOで簡単なアプリを作る
                                        • Next.js 13 vs Remix: An In-depth case study

                                          Next.js 13 vs Remix: An In-depth case studyLast updated on 29 Sep 2023 by Prateek Surana   •   - min read When it comes to building web applications, React has been at the forefront for a while now, and its adoption continues to grow. Among the most common approaches to building web applications with React, Next.js stands out as one of the most preferred options. Next.js has also been in the limel

                                            Next.js 13 vs Remix: An In-depth case study
                                          • Next.js vs. Remix - A Developer's Dilemma

                                            The React ecosystem is a bustling landscape, brimming with frameworks promising to revolutionize web development. Today, we’ll be diving into two popular contenders: Next.js and Remix. Next.js is one of the most popular React frameworks used for server-side rendering. It’s been there for a significant time, and it provides an exceptional developer experience with all the features developers need.

                                              Next.js vs. Remix - A Developer's Dilemma
                                            • 【ハンズオン】RemixでTODOアプリを作ってReactの違いを体感しよう【TypeScript/Supabase/TailwindCSS】 - Qiita

                                              【ハンズオン】RemixでTODOアプリを作ってReactの違いを体感しよう【TypeScript/Supabase/TailwindCSS】TypeScriptハンズオンRemixtailwindcssSupabase はじめに Reactを使っていてステートがクライアントとサーバーで辻褄が合わなくなった そんな経験がReactをある程度使ったことがある人はおそらく経験したことがあるはずです。 Reactにおいて状態管理は誰でも使いやすく直感的である半面、クライアントとサーバーの状態を意識する必要が有ります。 どのタイミングでステートの変更をサーバーでも行うのか難しく思う場面もしばしばあります。 今回は最近巷でReactと並んで見かけるようになったRemixについてハンズオン形式で学べるような記事を書いていきます。 ハンズオンを通してRemixの特徴であったり、SupabaseやTail

                                                【ハンズオン】RemixでTODOアプリを作ってReactの違いを体感しよう【TypeScript/Supabase/TailwindCSS】 - Qiita
                                              • Remixを使い始めた話 | Money Forward Kessai TECH BLOG

                                                こんにちは、23卒の新卒エンジニアのfujinoです。今回は弊社のサービスでReactのフレームワークであるRemixを使い始めた話をしようと思います。 背景 弊社では今までVue.jsのフレームワークであるNuxt.jsを用いてフロントエンドを実装していました。 これは、採用当時は生のhtmlが使えるのが良いと思っていたことや、Vue.jsの経験のあるフロントエンジニアがチームにいたことが理由でした。 しかし、最近ではTypescriptとの親和性や、コミュニティの大きさなどの理由からReactの方が勢いがあるように感じます。 弊社でも少し前からReactに移行することを決定し、現在進行形でNuxt.jsからReactへの移行プロジェクトを進めています。 Reactの主要なフレームワークとして、Next.jsとRemixが挙げられます。 両者の違いとして、Next.jsはSSG(Stat

                                                  Remixを使い始めた話 | Money Forward Kessai TECH BLOG
                                                • 最近流行りのRemixとCloudflareをキャッチアップするために一個アプリ作った話

                                                  TL;DR 無駄な買い物チェッカーを作ったよ!緊急度,重要度,欲求度,代替可能度の4軸から無駄かどうかを判断するよ フロントエンドではRemixで開発、フォームライブラリはConformがよかったよ Cloudflareは最高でした。 はじめに どうも、やまぐちです。 エンジニアの皆さん、技術のキャッチアップってどうやってますか? とりあえずチュートリアルやってみますか? 技術ブログを読むだけで済ましていますか? この辺りどうもモチベーションが湧かないんですよね。チュートリアルやっても身についている感覚がないんですよ。 最近Xのタイムラインを眺めていると、React界隈では今はRemixが流行りらしいし、ついでにCloudflareも、安い、速い、便利、で個人開発でめっちゃナウくてイケてるらしいじゃないですか。 んー、モダンでナウい、イケてる技術スタックを使えるようになりたい!! そんな時

                                                    最近流行りのRemixとCloudflareをキャッチアップするために一個アプリ作った話
                                                  • SPA モードのRemixを GitHub Pages にデプロイする

                                                    SPA モードの Remix を GitHub Pages にデプロイする方法が Remix のアカウントでポストされていたので、ふとそのリポジトリを見てみると、GitHub Actions を使った GitHub Pages へのデプロイが簡単に行えるようになっていて驚いた。 このポストを見ると GitHub Actions から提供されている Action など知らなかったものがいくつかあったので、Remix SPA モードのデプロイ方法など含め、内容を紹介したい。 動作確認した環境 関連がありそうな依存を記す。 "dependencies": { "@remix-run/node": "^2.8.1", "@remix-run/react": "^2.8.1", "@remix-run/serve": "^2.8.1", "react": "^18.2.0", "react-dom"

                                                      SPA モードのRemixを GitHub Pages にデプロイする
                                                    • [すべて無料]Remix+Cloudflare Pagesでブロクシステムを作成する | 空雲 Blog

                                                      上記構成で作りました。 バックエンドとフロントのビルドを統合したかったので、GraphQL サーバは、Remix に載せる形になっています。この構成の凄まじいのは、ローカル環境からコマンドを実行して約 17 秒で、CloudflarePages にビルド込みでデプロイされることです。 Next.js から Remix への移植理由 もともと React のフレームワークは Next.js を使っていました。しかし商利用も可能で制限がゆるい Cloudflare Pages をインフラとして使いたかったので、相性の良い Remix に移植することにしました。 一応 CloudflarePages でも Next.js は動くのですが、私の Blog システムで Edge 設定を行うと、謎のビルドエラーが出ました。配置したファイルの数を減らすと内容に関係なく何故かビルドが通ります。容量的に問題

                                                        [すべて無料]Remix+Cloudflare Pagesでブロクシステムを作成する | 空雲 Blog
                                                      • 揚げたての息子を唐揚げにつまみ食いされる、、妊娠中に思い描いてた光景だ今が人生で1番幸せかもしれん→「サトゥルヌスさん!?」

                                                        ゴンザレス白 @white_rice_wins キーボード、カーソルの位置バグって文章前後するみたいな現象あって今回もそれなのか単純に寝ぼけてたのか不明 息子よ健やかに…… 2024-02-22 19:40:34

                                                          揚げたての息子を唐揚げにつまみ食いされる、、妊娠中に思い描いてた光景だ今が人生で1番幸せかもしれん→「サトゥルヌスさん!?」
                                                        • Remixで個人開発をしたので技術スタックを紹介

                                                          しおりモ! まずは開発しているサービスの紹介をします。 「しおりモ!」は本に関するメモをいい感じ(当社比)に記録するためのサービスです。元々読書中に気に入ったセリフや後から読み直したい箇所を手帳や他のサービスにメモしていました。しかし、あとで見返すときにどの本のどのページか分かりづらい/検索がしづらかったので、自分が使いやすいサービスを開発することにしました。一応本についてのメモとは謳っているものの、通常のメモ帳サービスとしても使えるはずです。 まだ初期機能(メモの追加、編集、削除と検索)の実装が終わった段階です。これからも細かい機能追加を色々したいとは思っています。ただ、とりあえず自分で使う分には最低限のところは終わったので、あとはのんびりやっていくつもりです。SEO対策とかOGPの設定はしていません。 よかったら使ってみてください。 メモの作成 メモの検索 メモの編集 Remix せっ

                                                            Remixで個人開発をしたので技術スタックを紹介
                                                          • Remix v2へアップデートした時のメモ

                                                            Remixを使って作ったアプリケーションをRemix v2へアップデートした時のメモです。 Remix v2 | Remix マイグレーションガイド: Upgrading to v2 | Remix アプリケーションは Remix + Cloudflare Pages で動かしてるアプリ。 serverBuildTargetの変更 結構前にテンプレートから生成したアプリだったので、それぞれのビルドターゲットの設定方法が変わっている。 V2では、この初期値が結構変わるので、次のページを参考にしてビルドターゲットに合わせたものを設定する。 serverBuildTarget Cloudflare Pages向けのビルドをするので、remix.config.jsに次のように設定する。 この設定はV1でも動くので、まずはこれで動かす。(future.v2_devが有効である必要はあったのかも。忘れ

                                                              Remix v2へアップデートした時のメモ
                                                            • Remix ❤️ Vite

                                                              Today we’re excited to announce that unstable support for Vite is available in Remix v2.2.0! Now you get all the benefits of Vite’s lightning fast DX ⚡️ out-of-the-box when using Remix. Try it out now! # minimal server npx create-remix@latest --template remix-run/remix/templates/unstable-vite # custom Express server npx create-remix@latest --template remix-run/remix/templates/unstable-vite-express

                                                                Remix ❤️ Vite
                                                              • TanStack Routerで型安全かつ効率的なルーティングを実現

                                                                TSKaigiにて使用した資料です。 https://tskaigi.org/talks/ytaisei_ Reactを用いたSPA開発においてフレームワークの採用は時にtoo muchになります。 しかし、Next.jsやRemixのFiled-Basedなルーティングは開発体験が良いです。 私たちはSPA開発においても型安全でFile-Basedなルーティングを求めています。 今回はそのような状況においてTanStack Routerが有力な候補になることを、その特徴とメリットに触れながら解説します。 次の特徴を紹介します。 - 型安全でシンプルなルーティング - File-Basedなルート生成 - バンドルサイズを軽減するCode Splitting - Search Paramsによる状態管理

                                                                  TanStack Routerで型安全かつ効率的なルーティングを実現
                                                                • Remix Vite is Now Stable

                                                                  Today we’re excited to announce that support for Vite is now stable in Remix v2.7.0! After the initial unstable release of Remix Vite, we’ve been hard at work refining and extending it over the past few months with help from all of our early adopters and community contributors. Here’s what we’ve been up to: Closed 75 issues and merged 136 pull requests related to Vite. Migrated the website you’re

                                                                    Remix Vite is Now Stable
                                                                  • type-safe とプログレッシブエンハンスメント、アクセシビリティヘルパーを備えたフォームライブラリ Conform

                                                                    type-safe とプログレッシブエンハンスメント、アクセシビリティヘルパーを備えたフォームライブラリ Conform 2024.02.18 Conform は React 向けのフォームライブラリです。type-safe であること、Web 標準を利用したプログレッシブエンハンスメントや、アクセシビリティヘルパーを特徴としており、Next.js の Server Actions や Remix に対応しています。

                                                                      type-safe とプログレッシブエンハンスメント、アクセシビリティヘルパーを備えたフォームライブラリ Conform
                                                                    • RemixでFormライブラリ入れるならConformがオススメなんで使ってみてほしい

                                                                      Formライブラリは数あれど、何がいいかなとか経験からReact Hook Formとか使ってる方向けにもし Remix使うなら ってことでConformというライブラリをオススメする記事です。 前提条件 Remixの細かい処理方法などは説明しません 各ライブラリのインストール方法などは記載しません 完成コードはこちらを参考にしてください RemixでのFormライブラリ候補 RemixもReactのフレームワークなんでReact向けに作られていたら使えるのは使えます。例えば候補としては以下が挙がるでしょうか。 各ライブラリについて詳しくは書きませんが、前2つはReactであれば使えるのでRemixも同様に使えます。最後のRemix Validated FormはRemixならば結構ググったりしてもヒットするし、Remixが出た当初もRemixとの親和性とライブラリが少なったことも相まって

                                                                        RemixでFormライブラリ入れるならConformがオススメなんで使ってみてほしい
                                                                      • Remixで古き良き通信体験を取り戻そう──データ取得とデータ更新について解説

                                                                        対象読者 Reactの基本を修めている方 通信回線が弱いユーザーにも高速に表示できるサイトを作りたいエンジニア WebブラウザとNode.jsという異なるランタイムをそれぞれキャッチアップするのが辛くなってきたエンジニア 前提環境 筆者の検証環境は以下の通りです。 macOS Ventura 13.4.1 Node.js 20.4.0 NPM 9.7.2 Remix 1.18.1 Webサイトと通信の歴史 これまでの連載で、Remixの基本的な考え方や、頻出する使い方について解説してきました。今回からは、個別の機能にフォーカスして解説していきます。今回は、通信に関する機能の解説として、データ取得とデータ更新について解説します。 さて、Web標準とプログレッシブエンハンスメントを大切にするRemixは、通信においても可能な限り、ブラウザの基礎的な機能に肉付けする形でユーザー体験をよくするため

                                                                          Remixで古き良き通信体験を取り戻そう──データ取得とデータ更新について解説
                                                                        • 2024-02-27のJS: Firefox 123、Remix 2.7.0(Remix Vite is Stable)、2023年のNode.jsまとめ

                                                                          JSer.info #682 - Firefox 123がリリースされました。 Firefox 123.0, See All New Features, Updates and Fixes Firefox 123 for developers - Mozilla | MDN <template>要素がshadowrootmode属性をサポート、Date.parse()の互換性向上、103 Early Hintsのrel=preloadをサポートなどが含まれています。 また、実験的な機能としてWeb Codecs APIをサポートが追加されています。 Remix 2.7がリリースされました。 Remix Vite is Now Stable | Remix Remix 2.7ではSPAモードがStableに、baseオプションのサポート、Remix ViteがCloudflare Pages

                                                                            2024-02-27のJS: Firefox 123、Remix 2.7.0(Remix Vite is Stable)、2023年のNode.jsまとめ
                                                                          • OK!行くよー!

                                                                            喜多ー!郁代ー! YouTube(たぶんスマホ縦画面対応):https://youtu.be/iV6WlELTf2E

                                                                              OK!行くよー!
                                                                            • [すべて無料]Remix+Cloudflare Pagesでブロクシステムを作成する

                                                                              画像の最適化の場合、1600*1600 ぐらいの画像を変換すると高確率で CPU 制限に引っかかります。また、外部サービスを呼び出すようなコードを書いた場合、並列アクセス時にデッドロックしないように気をつける必要があります。 また、Worker サイズはバックエンドで動く JavaScript や wasm を圧縮したときのサイズです。Pages で Assets として配るファイルは計算に入れません。このサイズがどうにもならない時は、Worker を分離するしかありません。 必要な機能 画像最適化機能 別になくても困らないのですが、あったほうがページが軽くなるので推奨事項です。Cloudflare には有料での画像最適化サービスがありますが、無料というのが大前提なので却下です。 画像変換は自分で作らなくともライブラリが世の中に一通り揃っています。その手のライブラリ類はほとんどが C 言語

                                                                                [すべて無料]Remix+Cloudflare Pagesでブロクシステムを作成する
                                                                              • 2023-09-22のJS: Remix v2、Safari 17、TypeScriptドキュメンタリー

                                                                                JSer.info #661 - Remix v2がリリースされました。 Release v2.0.0 · remix-run/remix Remix v2 | Remix React 17のサポート終了、Node.js 14/16のサポート終了されています。 オプションやデフォルトの動作の変更が含まれますが、 V1からの移行はv2_*フラグを使うことで機能を一つずつ有効化して移行できるようになっています。 Upgrading to v2 | Remix ルーティングのディレクトリ構造のデフォルトがFlat Routesに変更されています。 Flat Routes · remix-run/remix · Discussion #4482 2.0.0ではv2_*フラグの削除、remix.config.jsの設定やコマンドの変更などが含まれています。 Safari 17.0がリリースされました

                                                                                  2023-09-22のJS: Remix v2、Safari 17、TypeScriptドキュメンタリー
                                                                                • Remix 2.7で安定版となったCloudflare PagesのVite対応の実現方法を読み解く

                                                                                  Remix 2.7がリリースされました。この2.7からは今までunstableであったVite対応が正式版として採用されたバージョンとして登場しました。 この2.7以前はunstableであったものNode.jsのランタイムでは動作するものが提供されていましたが、Cloudflare Pagesでの動作するものは提供されていませんでした。しかし、2.7のリリースと同時にCloudfalre Pagesで動作するものがリリースされたということで何が変わって、どう対応しているのかというのを調べた結果を纏めておきます。 2.7.0のリリース後にいくつかのバグが修正されているので、2.7.0ではなく移行のバグ修正版を使用することをオススメします。 また、Vite版への移行は公式にドキュメントがあるので合わせて読むと理解が深まると思います。 初期package.jsonの違い まずは、従来版とVit

                                                                                    Remix 2.7で安定版となったCloudflare PagesのVite対応の実現方法を読み解く