🚀 Nuxt 2 is coming! Oh yeah!
Just 25 days after 1.4.0 release, Nuxt 2 is almost ready. Over 330 commits, 320 changed files, 8,200 additions, and 7,000 deletions not counting other nuxt repositories! OK, it seems LOTS of changes but don’t worry, we tried our best to have only a little amount of breaking changes and focus on stability, performance and better development experience. We just made a summary of the changes. 🏎 Webp
Nuxt.jsの学習（インストールからビルドまで） - Qiita
はじめに Nuxt.js（とVue.js）を使ってサイトを作る、を学習しました。 Nuxt.js初心者が、インストールからビルド、サーバーにアップするまでにしたこととその流れをまとめます。 前提 作業環境 PC：Mac（macOS Sierra） エディタ：Atom 前提知識 Vue.js -> ほぼ整備済のVue.jsプロジェクトを触った程度 Wordpress -> サイトを作る一通りの知識がある 今回使用したツールのバージョン Node.js -> 9.3.0 npm -> 5.6.0 Yarn -> 1.3.2 VCCW -> 3 Vue.js -> 2 Nuxt.js -> 1.0.0-rc11（学習の間にver.1.0.0が出ました🎉） aws-cli -> 1.14.22 vue-cli -> 2.9.2 作業前に導入済のツール Node.js npm Yarn Virtu
Vue.js / Nuxt.js を採用した Web 開発で得た知見 | rakuishi.com
2018 年に入ってからは Vue.js / Nuxt.js を採用した Web サイト開発に携わっています。ログイン機能がある Web サイトで、データは API サーバーを叩いて取得するという構成。最近のフロントエンド開発は、感覚としてはアプリ開発ですね。 Vue.js に加えて Nuxt.js を採用したのは SSR（Server Side Rendering）をしたいという理由に尽きます。SSR することによるメリットは、以下となります： Facebook や Twitter が OGP タグを正しく評価してくれる 検索エンジンがサイトを正しく評価してくれる 副産物として、ログインユーザー情報が描画されて返るため、クライアント側で描画されるまでの空白状態がユーザーに見えない この記事ではそんな Vue.js / Nuxt.js を採用した Web 開発で得た知見を紹介していきます。
Best Practices for Nuxt.js SEO
One of the biggest selling points of Nuxt.js is that it can help your application with Search Engine Optimization (SEO) and to rank better on Google. In this article, we’ll go over the best practices to make sure that your Nuxt application is set up properly to rank on search engines. Disclaimer: This article is not an SEO guide or a guide on how to rank well on Google. It’s a technical article on
Azure LUISとNuxt.jsでチャットボットを作る
どうも、shoheiです。 Nuxt.jsとAzure LUISを用いてカンタンなチャットボットの作り方をご紹介します。 仕事で使うことがあったので備忘録としてまとめます。 開発環境 macOS High Sierra 10.13.4 Google Chrome nuxt-community/typescript-template Nuxt.js TypeScript Azure LUIS Azure LUISとは Azure LUISとはMicrosoftが開発した自然言語処理を行うサービスです。 理解した自然言語に応じて結果を出力してくれます。 日本語対応済みであり、カンタンなチャットボットを作ることができます。 Azure LUIS IntentとEntity Azure LUISにはIntent(意図)とEntity(値)があります。 Intent(意図） Intent(意図）とは
Nuxt.jsとaws-amplifyでログインするだけ - Qiita
Nuxt.jsとAmazon Cognitoでユーザー登録、ログインを実装しました。 mode:'spa'です。 リポジトリ: nuxt-aws-amplify-sample 実装にあたり以下の記事とリポジトリを大いに参考にしました。 aws-amplifyをnuxt.jsで使ってみた aws-amplify-vue aws-amplify-react Cognitoの準備 ユーザープール作成 基本的にはデフォルトのままです。１ヶ所だけ変えています。 「属性」の「エンドユーザーをどのようにサインインさせますか」を「Eメールアドレスおよび電話番号」「Eメールアドレスを許可」に変更します。 これにより、メールアドレスでログインできるようになります。 ユーザープールを作成すると、「プールID」が発行されます。 「アプリクライアント」を開きます。「クライアントシークレットを作成」のチェックを外し、
Nuxt.js on Google App Engine（GAE) - Qiita
Nuxt.js on GAE Nuxt.jsは、Vue.js向けのSSR用フレームワークで日本語ドキュメントも充実しており、SSRしないページでも開発するのには十分な機能をもっているといえる便利なものです。 Nuxt.js - 日本語公式ドキュメント また、GAEとはGoogle App Engineの略で、一言で言うならば PaaSです。スタンダード環境、フレキシブル環境と呼ばれる2種類の環境があり、スタンダード環境は無料枠で利用ができます。 Node.js がスタンダード環境で利用可能に スタンダード環境では、Java,Python, PHP, Go のみ利用が可能でしたが2018年6月12日にNode.jsがサポートされました。 Google App Engineがスタンダード環境でNode.jsをサポート。パッチ適用は自動、カスタムドメインでのHTTPSも利用可能 つまり、今までは
Nuxt.jsとExpressでSPA×SSR×API Aggregationを実現した話
kubernetes初心者がKnative Lambda Runtime触ってみた（Kubernetes Novice Tokyo #13 発表資料）
Nuxt.jsでPWAを手っ取り早く本番環境で試す手順を雑に紹介する - Qiita
まずはじめに、現状ではNuxt2でPWAはうまくいきませんのでご注意を。 今回、開発環境は Docker for Mac、本番環境は Heroku を想定しています。 WindowsでVagrant上にDockerを立てる場合はローカルでは別途設定、オプション追加、パスの追加指定が必要となります。 まずは初期ディレクトリ、初期ファイルを作成します。 FROM node:9 RUN mkdir -p /nuxt COPY . /nuxt WORKDIR /nuxt RUN npm uninstall -g yarn && \ npm install -g yarn && \ chmod u+x /usr/local/bin/yarn && \ yarn global add nuxt vue-cli create-nuxt-app ENV HOST 0.0.0.0 EXPOSE 3000
NuxtのasyncDataで複数のHTTPリクエストを扱う - Qiita
asyncDataに限らないんだけど await Promise.all() 使うとキレイに書けるよねって話。 TypeScript x ES6 な感じ。 prefetch的な処理をキレイにかけるNuxtは最高だなと思います <script lang="ts"> import Vue from "vue"; import Component from "nuxt-class-component"; import Foo from "~/Foo"; import Bar from "~/Bar"; @Component({ async asyncData({ app, params }) { const id = _.get(params, "id"); // 2つのHTTPのレスポンスを受けてからページがレンダリングされる const [foo, bar] = await Promise.
Nuxtで実案件で開発するときに作ったオレオレプラグイン - Qiita
ここ数ヶ月はNuxt.jsで開発することが多いのですが、意外と~/pluginsディレクトリにいろいろ貯まってきたので軽めの共有です。 前提 mode: 'spa' で開発しています こうするとサーバーサイドレンダリング(SSR)はなくなります SSRの場合は nuxtServerInit というAPIを利用することでストアの初期化などが可能です SPAの場合は初期化処理を ~/plugins で実装することが可能です 名前からしてpluginsで初期化するのが正しいのかどうかあんまり自信ないですが、実装上はこれで可能です。 ~/plugins の挙動 （build後の状態はわからないですが）.nuxt/index.js を見ると、以下のような状態になっています。 // 略 import plugin0 from 'plugin0' import plugin1 from 'plugin1
データの取得
データの取得 Nuxt では、API からデータを取得する方法が 2 つあります。fetch メソッドまたは asyncData メソッドを使用できます。 Nuxt はコンポーネントの mounted() フックでデータを取得するなど、クライアントサイドアプリケーションにおける従来の Vue のデータの取得パターンをサポートしています。しかしユニバーサルアプリケーションでは、サーバーサイドレンダリング中にデータをレンダリングするために Nuxt 特有のフックを使う必要があります。これにより、必要なデータがすべて存在する状態でページをレンダリングすることができます。 Nuxt には、データを非同期に読み込むためのフックが 2 つあります。 asyncData。このフックは、 ページ コンポーネントでのみ使用できます。fetch とは異なり、クライアントサイドレンダリング中にローディングプレー
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://miobiki.com/nuxt-sns-component/
Setup
A guide to building a multilanguage website with Nuxt & Storyblok | Storyblok
「結局Nuxt.jsって何がいいの？」に対する回答 by potato4d
Nuxt.js ファーストインプレッション / Nuxt.js First Impression
オトナのVue.js〜Nuxt.js入門
GitHub - nuxt/todomvc: Nuxt.js TodoMVC Example
GitHub - nuxt/hackernews: HackerNews clone built with Nuxt.
