はじめに Next.js には Private folders という機能があります。 Next.js の App Router では、以下のように _ で始まる名前にすることでルーティングから除外されます。 (基本的に page.js や route.js でないとルートとして認識されないようにはなっているので、Private folders を使わなくても以下の例では除外されている) pages/ ├─ dashboard/ │ └─ _components │ └─ button.tsx # ルーティングから除外される └─ page.tsx # /dashboard はルートになる Nuxt には同じような機能はありませんが、とある機能を使うことで同じようなことが実現できます。 Nuxt のルーティングについて Nuxt は File-based routing をサポートしており
はじめに こんにちは、がんがんです。 2024 年 6 月に Nuxt v3.12 がリリースされました。 Nuxt v3.12 の目玉としては Nuxt4 のリリース準備が進んでいること、現環境で Nuxt4 のマイグレーション実験を行えること が挙がられると思います。 Nuxt4 へのマイグレーション実験はこちらの記事で実験されています。合わせてご覧ください。 そんな v3.12 のリリースノートの中に今まで見たことなかったモジュール名が記載されていました (以下ブログ記事の引用) 📜 Nuxt Scripts auto-install We've been gradually working to release Nuxt Scripts. It's currently in public preview, but we're near a public release, so w
SPA におけるアクセシビリティ課題について シングルページアプリケーション（SPA）は、1つのHTMLファイルに対してJavaScriptとWeb APIを活用して、ユーザーに素早いページ切り替えの体験を提供するウェブアプリケーションの一形態です。 しかし、SPAにはアクセシビリティの課題があります。例えば、視覚障害のあるユーザーが使うスクリーンリーダーという支援技術ではページが遷移したことを認識できないことがあります。これは、JavaScriptを使ってページを切り替える際に発生する問題です。 具体的には、ユーザーがあるページから別のページへ移動した際、スクリーンリーダーが新しいページに移動したことを認識しないことがあります。 この問題を解決するために、JavaScriptとWAI-ARIAという技術を使って、Route Announcerという方法があります。これを活用することでペー
ANDPADフロントエンドエンジニアの小泉です。 昨年の夏頃、担当したプロダクトで新規リポジトリでの開発を立ち上げる機会があり、Nuxt 3 を用いて構築を行いました。 アップデートではなく新規で Nuxt 3 サイトを構築するのは業務としては初めての経験だったのですが、Vue 3・Nuxt 3 の様々な機能によって、型安全な状態を保ったまま快適な開発を進められ、かつ3ページの全体実装を約7営業日で形にすることができました。 この記事では、「いま新規サービスのゼロからの立ち上げにNuxt 3を選択するとどんな嬉しいポイントがあるのか」という実例をご紹介できればと思います。 担当したプロダクトについて ANDPAD資料承認 | 製品のご紹介 2023年10月にリリースされた「ANDPAD資料承認」という、資料の申請・承認を一元管理する機能のフロントエンド開発を担当しました。 ただし、紹介サイ
2023年は Vue.js および Nuxt のアップデートがとっても活発な一年でした。 これだけ多くの、そして多様な進展があると、1年を振り返っておかないと何があったか忘れてしまいそうです。 というわけで Nuxt, Vue.js, Vite 関連の情報をピックアップして🏃♂駆け足で振り返ってみます。 （数が多かったので、おもに公式周辺のアカウントから告知されたものが中心です。漏れがあったらすみません。教えていただければ追加します） 🗓2023年1月 2022年の春先に正式に Vue.js 3 がデフォルトのバージョンとなり、2022年11月に Nuxt 3.0 がリリースされました。 年が明けて2023年1月の主だった情報です。 🔼Nuxt 関連 2023年1月17日に公開された Daniel Roe @danielcroe氏による公式ブログ記事 Nuxt: A vision
設定ファイルと app.vue だけのごく質素なプロジェクトが生成された（こんな感じ）。前はもっと色々なファイルがあった気がする。慣れている人には余計なものがなくてよさそうだが、Nuxt を初めて使うような場合は途方に暮れそう。 公式ドキュメントに貼られている動画の内容を再現していく。 0:53 まずは通常通りにコンポーネントを作る。 これはマークダウンの文字列を HTML にパースして表示するコンポーネントで、変換には markdown-it というファイルサイズが大きいライブラリを使う。 <script setup lang="ts"> import MarkdownIt from 'markdown-it'; const md = new MarkdownIt(); const string = `# my component - markdown list - rendered a
CQRS+ES の力を使って効果を感じる / Feel the effects of using the power of CQRS+ES
CTO室プラットフォーム開発チームの山口(@igayamaguchi)です。 プラットフォーム開発チームではさらに内部でプロジェクトチームが分かれており、私はフロントエンド改善チームというチームでリーダーをしています。 フロントエンド改善チームでは主に一休.com、Yahoo!トラベルのフロントエンドの改善を行っております。 今回は一休.com、Yahoo!トラベルで使用しているNuxtのバージョンを2から3にアップグレードしたお話をさせていただきます。 一休.com、Yahoo!トラベルではトップページや検索ページ、ホテル・旅館の詳細ページなど主要なページのフロントエンドはNuxtで開発されています。 NuxtのバックエンドにはGo+gqlgenでGraphQLのサーバーを立てており、NuxtからはApolloを使用してバックエンドと通信を行っています。 このNuxtのバージョンは2とな
Nuxt 2.16.0 is the first minor release since Feb 15, 2021. The focus is mostly on releasing the latest fixes and enhancements that have been present in nuxt-edge for some time. ✨ Highlights upgrade to PostCSS 8 default to core-js v3 ... full details below ⚠️ Breaking changes In this PR we only support Node 14+. This is mostly an issue for dependencies, which we need to keep updated for security re
This past year has been an exciting one. Looking into the new year, there is a lot we have planned as a team and we'd love to share it with you. Nuxt: A vision for 2023This past year has been an exciting one. Looking into the new year, there is a lot we have planned as a team and we'd love to share it with you. ✨ This past year has been an exciting one, with the release of Nuxt 3 and Nitro and the
はじめに Nuxt3の安定版がリリースされ、しばらく経った。現在筆者もNuxt3を活用しているプロジェクトがある Nuxt3は以前の2系にも増して更に強力な機能を公開しており、快適な開発体験を提供してくれる 代表的な機能としては Auto-imports Data-fetching utilities Zero-config TypeScript support Universal rendering (Server-side rendering and hydration) といったものがある。またNitroという新しいサーバーエンジンが導入され、より高いパフォーマンスでのレンダリングが可能になった そしてNuxt3では2つの新しいAPIであるuseFetchとuseAsyncDataが導入されている(useLazyFetchとuseLazyAsyncDataも含めれば4つ)。useFe
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
