タグ

Nuxtに関するunieye51のブックマーク (6)

  • 【完全ガイド】ゼロからしっかり理解したい人向けのNuxt.js入門 | アールエフェクト

    文書ではVue.jsのフレームワークであるNuxt.jsを使ってアプリケーションの開発を効率的に行いたいという人を対象にNuxt.jsのインストールを行った実環境を利用して動作確認を行いながら基機能の説明を行っています。 Vue.jsのシンプルなコードで記述していますがVue.jsの知識があることを前提に説明を行なっているためVue.jsを知らない人には少し難しい内容になっています。Nuxt.jsを使いこなためにはvue.jsを理解する必要があるのでNuxt.jsを学習する前にVue.jsを先に学習することをお勧めします。 動作確認を行っているNuxt.jsのバージョンはv2.15.7です。現在はNuxt 3のRelease Candidateを利用することができます。最新バージョンのNuxt 3のチュートリアルではないので注意してください。Nuxt 3がリリースされたのでNuxt 3

    【完全ガイド】ゼロからしっかり理解したい人向けのNuxt.js入門 | アールエフェクト
  • Vue.js製フレームワークNuxt.jsではじめるUniversalアプリケーション開発

    Vue.js製フレームワークNuxt.jsではじめるUniversalアプリケーション開発 花谷拓磨 Vue.jsでUniversalなSPAを開発できるフレームワークであるNuxt.jsのバージョン 1.0のリリースがいよいよ近づいてきました。 稿では、シングルページアプリケーション(以下 SPA)開発によって生じた問題を解決するために生まれたサーバーサイドレンダリング (以下 SSR)を中心に、Vue.jsでの開発を強力にサポートするNuxtについて、その魅力と基的な使い方をご紹介いたします。 Nuxt.jsとは? Nuxt.js(ナクストと読みます)はReact.jsベースのSSR用フレームワークであるNext.jsに触発されて作成された、Vue.jsベースのフレームワークです。 特にUIの描画サポート に主眼をおき、SSRをはじめとした様々なサポートを行ってくれるものとなります

    Vue.js製フレームワークNuxt.jsではじめるUniversalアプリケーション開発
  • Nuxt.js プロジェクトを Firebase Hosting にデプロイして公開する方法 - UPDATE

    どうも、こうすけ(@kosuke_upd)です。 今回は、Nuxt.js で作成したアプリケーションを Firebase Hosting にデプロイして公開する方法を解説します。 一つひとつ手順を説明していきます。早速順番に見ていきましょう。 当記事では、Nuxt.js で作成したアプリケーションを Firebase Hosting にデプロイする部分に焦点を当てて解説します。Nuxt.js プロジェクトを作成する方法については下記記事で詳しく解説しているので、必要に応じて参考にしてみてください。

    Nuxt.js プロジェクトを Firebase Hosting にデプロイして公開する方法 - UPDATE
  • Nuxt.jsのAuth認証の設定(バックエンド設定含む) | アールエフェクト

    文書ではNuxt.jsのモジュールnuxtjs/authを使い、Tokenを利用したJWT(JSON WEB TOKEN)のAuth(認証)の設定を行っています。Nuxt.jsでJWTの認証を行うためにはバックエンドが必要になります。バックエンドにはNodeのExpress.jsを使って構築します。文書を読むことでNuxt.js環境下でTokenを利用したユーザ認証の設定手順の流れを理解することができます。 Tokenを使った認証の設定が行えることを書の目的としているため入力フォームのデザイン、バリデーションやセキュリティについての説明は行っていません。特にセキュリティについてはJWTの設定方法がわかった後にしっかりと勉強してください。 Express.jsを使ったバックエンドの設定については一緒に記述すると文書が長くなるためまたフロントエンドにNuxt.jsを利用した場合のみ利用で

    Nuxt.jsのAuth認証の設定(バックエンド設定含む) | アールエフェクト
  • SPA開発未経験者によるNuxt.jsを使った自社サービス開発の裏側

    2019年1月30日、株式会社Re:Buildが主催するイベント「【Nuxt.js/Vue.js】スタートアップ企業導入事例」が開催されました。近年注目を集めるNuxt.jsやVue.jsを実際の開発現場でどのように活用しているのか、スタートアップ4社が集い、自社の取り組みを語ります。プレゼンテーション「SPA開発未経験者によるNuxt.jsを使った自社サービス開発」に登壇したのは、株式会社リビルドの嘉数侑起氏。講演資料はこちら SPA開発未経験者によるNuxt.jsを使った自社サービス開発 嘉数侑起氏(以下、嘉数):みなさん、こんばんは。「SPA開発未経験者によるNuxt.jsを使った自社サービス開発」というタイトルで、プレゼンさせていただきます。株式会社Re:Buildの嘉数と申します。よろしくお願いします。 こちらがアジェンダです。 今回、Nuxt.jsをこれから導入しようと検討し

    SPA開発未経験者によるNuxt.jsを使った自社サービス開発の裏側
  • Universalモード(SSR)のNuxt.js + 異なるサブドメインのAPIという構成でクッキー認証とCORSを実現する | Hypertext Candy

    この記事では、サーバーサイドレンダリングする Universal モードの Nuxt.js フロントアプリと、それとは異なるサブドメインで運用される Web API という構成でクッキー認証とCORSを実現する方法を紹介します。 Nuxt でアプリケーションを構築する場合、サーバーサイド(というかデータ取得部分)は Web API になるでしょう。そして Web API での認証といえば JWT を用いたステートレスなトークン認証が一般的かと思います。しかし JWT を LocalStorage に格納する実装は脆弱なアンチパターンであると主張する記事や以下参考リンクの記事を読み、フロントエンド + Web API な構成でもクッキーで認証を行い CORS でクロスサイトなアクセスを防ぐ実装パターンを考えてみました。 今回の実装パターンは以下の記事を参考にしました。 独自ヘッダをチェックす

    Universalモード(SSR)のNuxt.js + 異なるサブドメインのAPIという構成でクッキー認証とCORSを実現する | Hypertext Candy
  • 1