Cloudflare Pages・Vercel ・Netlify の違いや使い分けをまとめる
Vercel VercelはNext.jsなら特に設定しなくともSSRができる状態でデプロイできる。Nuxt.jsだとコミュニティが用意しているbuilderを使えばSSR対応アプリをVercelにデプロイできる。builderが用意されていないフレームワークでSSRを行うにはデプロイ周りで頑張る必要が出てくる。 VercelではちょっとしたWeb APIを用意したいときも、/apiディレクトリを用意してJSファイルなどを置いておけばまとめてデプロイしてくれる。 Netlify サーバーサイドで動かしたいスクリプトはNetlify Functionsで動かすことになるが、フレームワークごとに用意されているプラグインを使うことでまとめてデプロイができたりする。例えばnetlify-plugin-nextjsを使えばNext.jsでSSR対応したアプリを動かせるっぽい。またnetlify.to
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で新規サービスを立ち上げるときの観点（Router・CSS・認証・監視など/2023年末）
免責事項 社内向けに展開するように雑にまとめました Next.jsの知見が深くない人がリードしてPoCを立ち上げなきゃいけなくなったが、社内的にはNext.jsを推奨しているみたいな場面を想定しています なので自信ないところも多いですが割と断言するように心がけて書いています PoCの立ち上げ想定なので、jest/Storybookなど内部品質面についてあまり深く書くことを避けています ほぼ自分の知識だけで書いており私見も多いですし、そもそも自分自身がトップクラスの知識や視座を有しているわけでもないので、まずは以下の話を理解はした上で、踏襲するかどうかは別途他記事やGitHub、公式ドキュメントなどを漁って判断することを推奨 App RouterかPages Routerか 2023年末現在まだApp Routerは技術記事が足りてきている印象ではないため、社内でノウハウを積極的に貯めていく
@vercel/og を使ってブログに動的 og:image 生成を実装した | stin's Blog
Vercel で og:image の動的生成するなら一択先日 Vercel から HTML&CSS で画像を生成できるライブラリ @vercel/og が発表されました。 Introducing OG Image Generation: Fast, dynamic social card images at the Edge – Vercel それを使ってこのブログにもタイトルが埋め込まれた og:image を動的生成する機能を実装しました。Twitter 等でシェアするときにちょっとリッチになるのでワクワクしますね。シェアしてください(切望)。 過去に動的 og:image を諦めた話半年ほど前に、同じく og:image を動的生成してシェアのときに記事タイトル入りのカードがばーんと表示されるようにしたいと思って試行錯誤していました。 その時は node-canvas で画像生成す
vercel/og-imageを使ったブログOGPの簡単自動生成 - Qiita
この記事はDeNA 21 新卒 Advent Calendar 2020の8日目の記事です。 こんにちは、@p1assです。 皆さんはブログのOGP画像をどのように生成しているでしょうか？ 以前の私はGIMPを使って手動で作成していたのですが、手動で作るのは手間で、どうにかして自動化できないかと模索していました 今回は、そんな中見つけたvercel/og-imageというOSSを紹介します。vercel/og-imageを使えば、OGP画像を生成するサーバを簡単に作成できます。OGP画像の自動生成に興味のある方の参考になれば幸いです。 なお、この記事のスコープは『URLやクエリパラメータを指定すると画像が返ってくる』ところまでで、SPAでどう動的に表示させるかといった話は含んでいません。（私のブログがHugoを使って静的に書き出しているからです） OGP画像生成に求めるもの OGP画像生成
Next.jsアプリをVercelからGoogle Cloudに移行した話
ZennではフロントエンドにNext.jsを使っています。もともとはVercelで動かしていたのですが、2021年3月にGoogle Cloudに移行しました。今回は移行を決めた理由や、具体的な構成、移行作業などについて書きたいと思います。 なぜ移行したのか Next.jsのデプロイ先としてVercelは圧倒的に優れています。ISRやImage OptimizationといったNext.jsの強力な機能をサーバー側の追加設定なしで使用できますし、CDNでの静的ファイルのキャッシュなども特に意識しなくてもいい感じにやってくれます。 Vercel以外にデプロイするとなると、Next.jsの一部の機能がうまく動かなかったり、パフォーマンス・チューニングを自分で頑張る必要があったりと自分で面倒を見なければならない部分が多くなります。 しかし、Zennのケースでは以下のような理由からVercelから
vercelでの環境変数の扱いが便利になった
Vercel での環境変数周りでのあれこれ、ずっと苦しみ続けていたので自分なりのプラクティスをメモします。 辛さの原因は Vercel のアップデートのスピードが早く正しい情報にアクセスし辛いことが一因としてあるので、それをなくせたら良いなと思っています。 もしこのドキュメントが古くなっていたら Issues などからお知らせていただけると幸いです。 Next.js を前提とした解説になりますが、 Next.js の環境変数周りについては解説を省きます。 Vercel での環境変数周りがややこしいのは Next.js に起因しているものもあるとは思うのですが、話が長くなるので別の記事にて補足したいと思います。 (ビルド時・サーバー・クライアントで見える・渡せる環境変数や方法が変わる話) やりたいこと: フロント側から環境変数別にエンドポイントを切り替える Vercel は プレビュー環境と
Vercel の料金形態と内容についてまとめた - 2020冬
はじめに この記事は #EveOneZenn (Everyday One Zenn) vol.14 です。 Next.js などを手掛ける Vercel Inc.（旧 Zeit ）が運営しているサービス、Vercel（旧 Zeit Now）の料金形態とその内容についてまとめます。 なお、掲載内容は 2020/12/08 時点のものです。 （過去に別所で公開していた記事の加筆版です） Note: 2020/12/08 19:51 - Hobby プランは個人的かつ非営利目的な目的でのみ利用できる旨を追記 Note: 2021/02/06 - 禁止されている用途について追記 Note: 2021/02/11 - Hobby プランにおける広告を掲載した、個人ブログでの利用について追記 Note: 2022/02/26 - Hobby プランにおける広告掲載の利用不可について追記 前回： Ver
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
