タグ

ブックマーク / qiita.com/potato4d (6)

  • Nuxt.js + TypeScript のアプリケーションで環境変数を安全に管理する - Qiita

    はじめに イマドキの SPA 開発だとアプリケーションの設定を環境変数で取り扱うことが非常に多くあります。 開発環境・番環境で変えたい API の baseURL、Google Analytics のトラッキング ID や Firebase の認証情報、ビルド後の成果物を上げる CDN の URL まで、ぶっちゃけ「大体の設定が環境変数で行われている」といっても過言ではない状態です。 ただ、割と環境変数は雑に使われます。いたるところから呼び出されます。いつか崩壊します。 なので、この記事では環境変数の利便性を残しながらも、可能な限り安全に環境変数を取り回す方法をご紹介します。 例によって例の如く、サンプル及び実現方法は Nuxt.js ですが、他の技術でも転用できるはずです。 この記事はちょこちょこ手伝わせてもらっている Omnis inc. での治安維持向上の一環で上がった話のまとめだ

    Nuxt.js + TypeScript のアプリケーションで環境変数を安全に管理する - Qiita
  • Nuxt.js v2.7.0 の変更点と注目のポイントまとめ - Qiita

    日 Nuxt.js v2.7.0 がリリースされました。 普段は大きな変更点がある場合を除き日語でまとめたりしないのですが、いくつか便利そうな変更点があったので簡単にまとめます。 tl;dr アップデートにおいて変わった主な変更は以下(# は該当の Pull Request) SSR 側での console.log が開発環境に限定してクライアントへと引き継がれるように #5673 store ディレクトリ内の新規作成がウォッチ対象に #5681 serverMiddleware のウォッチも改善 #5681 TypeScript プロジェクトにて Node.js v8.6 のサポートを廃止 #5691 今回のリリースについての公式情報 GitHub Release https://github.com/nuxt/nuxt.js/releases/tag/v2.7.0 Official

    Nuxt.js v2.7.0 の変更点と注目のポイントまとめ - Qiita
  • Vuexによる状態管理を含む最高に快適な Vue.js + TypeScript の開発環境を目指す話 - Qiita

    追記 2019/12/05 Vue 3.0 のリリースが現実的に近づいてきて色々と事情が変わっているので、話半分に聞いておいてください。 はじめに Patreon での支援募集をはじめました。この記事が良かった!という方は、今後の情報発信のためにもぜひぜひ支援お願いします。 https://www.patreon.com/potato4d Vue.js Advent Calendar 2018 年の管理役の potato4d です。昨年に引き続き、今年も Vue.js のアドベントカレンダーは他にもたくさんあるので、ぜひ #1 から追ってみてください。 12日目の今日は、 Vue.js + TypeScript での理想的な開発環境について考えてみたいと思います。 Vue.js における TypeScript 利用はまだまだ課題が多く、型の恩恵をうけるためのテクニックも複数存在しています。

    Vuexによる状態管理を含む最高に快適な Vue.js + TypeScript の開発環境を目指す話 - Qiita
  • Nuxt.js, Firebase, Stripe をフル活用してサーバーレスでJAMStackなECサイトを2日で開発した話 - Qiita

    Nuxt.js, Firebase, Stripe をフル活用してサーバーレスでJAMStackなECサイトを2日で開発した話stripeVue.jsFirebasedeprecatedNuxt 記事で紹介しているサービスの公式Twitterアカウントができました → @jslounge_info はじめに potato4d こと花谷拓磨です。 普段は ElevenBack という屋号のもと、フロントエンドを中心としながらも、デザインやサーバーサイドなどをも含めて作業することが多いのですが、屋号での活動の一環として、 JSLounge という渋谷で活動するハンズオン団体の運営を行っています。 その JSLounge にて過去に開催したハンズオン資料を入手できるサイトを構築することとしました。 通常、ハンズオンとなればその場でメンターがついて 1:1 で進めますが、 JSLounge の資

    Nuxt.js, Firebase, Stripe をフル活用してサーバーレスでJAMStackなECサイトを2日で開発した話 - Qiita
  • フロントエンドのバリデーションを hapi の joi で行うと手軽で便利 - Qiita

    Webフロントエンドの入力とバリデーションは、煩雑なのに手を抜きづらいという、なかなか難しいテーマとして長らく存在し続けています。 最近のSPA開発では、ReactVue向けに、専用のライブラリが提供されていることも少なくありません。しかしながら、それらは得てして特定のフレームワークに依存しており、かつ解決したい課題に対してオーべースペックであることが少なくありません。 そうして簡単なフォーム作成の時に使える丁度良いフレームワークはないか悩んでいたところ、サーバーサイドJS向けのバリデーションライブラリである hapijs/joi が非常にマッチしていること、そして、その joi が、ブラウザ向けに joi-browser として移植されていることを知り、実際に案件に投入したところ丁度良い塩梅で便利だったのでご紹介いたします。 Joi (オリジナルNode.js版) の特徴と使い方 Jo

    フロントエンドのバリデーションを hapi の joi で行うと手軽で便利 - Qiita
  • 普段Vue.jsでフロントエンド開発するときの構成と運用時のポイント - Qiita

    Vue.jsでSPAを開発する際、そのプロジェクト構成に迷うかたは多いようです。 今回はそんなかたのために、私が普段Vue.jsで開発するときの構成と、その構成化で開発するときのポイントを共有したいと思います。 追記 2019/12/05 追記 時代が大きく変わって求められる構成なども変化しました。 現在ではこの記事は参考にしないことをおすすめします 2018/01/30 追記 まずは Nuxt.js の利用の検討を Vue.js製のフロントエンド開発フレームワークである Nuxt.js がついに v1.0 のリリースを迎えました。SPA開発とSSR + SPAの開発両方を全面的にサポートしており、PWA対応などもプラグイン一つでできる上、ルーティングの自動生成やVuexストアのオートロードも可能と非常に強力なフレームワークとなっております。格的なSPA開発を開始するときは、まずは Nu

    普段Vue.jsでフロントエンド開発するときの構成と運用時のポイント - Qiita
  • 1