Nuxt: The Intuitive Vue Framework
<script setup> useSeoMeta({ title: 'Meet Nuxt', description: 'The Intuitive Vue Framework.' }) </script> <template> <div id="app"> <AppHeader /> <NuxtPage /> <AppFooter /> </div> </template> <style> #app { background-color: #020420; color: #00DC82; } </style> Static or Dynamic, the choice is yoursDecide what rendering strategy you need at the route level. By leveraging the hybrid rendering, you ca
nuxt.jsにおける「components」ディレクトリの規約（案） - Qiita
nuxt.jsでは、特殊な事情がない限り３つのディレクトリにコンポーネントファイルが格納されます。layouts pagesディレクトリについては公式ドキュメントを参考にし、残りのcomponentsディレクトリについてオリジナルの規約（整理方法)を定めてます。後々喧嘩にならならないように。 /layouts /pages /components <- オリジナルの規約について 規約はいいすぎ？以下は至極基礎的な案なので、みんな仲良く話し合えばいいと思います。 格納するファイル componentsディレクトリに格納するのは、「再利用可能」もしくは「複数回利用」するコンポーネントと定めます。 再利用可能なコンポーネント 他プロジェクトでも流用する可能性がある 他プロジェクトでも必ず作成するから置き場を固定したい 複数回利用するコンポーネント UIに関するコンポーネント カテゴリ単位で使い回
Nuxt利用プロダクトでIE11と仲良くするためのE2E - メドピア開発者ブログ
フロントエンドなエンジニアの皆さま、ご機嫌いかがでしょうか。 唐突な質問ですが、Internet Explorer 11というブラウザはお好きでしょうか。勿論大好きであられるかと存じ上げます。Webの歴史をまさにその身をもって築き上げてきた由緒正しきブラウザであります。唯一無二の王道です。昨今は様々なブラウザが溢れてあそばせております。しかし所詮それは一時的なこと。やがて全人類は母なるInternet Explorer 11の元へと還っていくことでしょう。 我々が目指したこと Internet Explorer 11（以下、IE11）を目にすること、操作すること、その他あらゆる接点を限りなく減らしつつ、プロダクトがIE11でも動作可能なことの検証と保証を行いたい。 これを成し遂げるエンジニアリング的な手段、つまりIE11環境でのE2Eテストを自動化することを目指します。 環境 自動化を行う
@nuxt/componentsを使って、コンポーネントのimport文を不要にする - くらげになりたい。
Nuxt.jsの公式ツイッターを見てたら、いい感じのモジュールがあったので、試してみたときの備忘録。 Introducing @nuxt/components ✨ No need to import your components anymore 🎩 ✅ Scan and auto import components ✅ Multiple paths with customisable prefixes and patterns ✅ Lazy loading support ✅ Hot replacement ✅ Support for library authorshttps://t.co/lCJ5wySJXQ pic.twitter.com/cnmQvAhG5I— Nuxt.js (@nuxt_js) May 18, 2020 @nuxt/componentsの主な機能としては 自動
タベリーを支えるアーキテクチャ - Koichi Ishida blog
目次 アーキテクチャ フロントエンド・バックエンドアーキテクチャ 分析アーキテクチャ レコメンデーションアーキテクチャ 最後に 「タベリー」は株式会社10Xが提供するパーソナルな献立を推薦するアプリです。iOSとAndroidとWebで提供しています。先日、プレスリリースで「オンライン注文機能リリース」と「2.5億円の第三者割当増資を実施したこと」をお知らせしました。献立作成、献立からの買い物リスト作成、買い物リストをネットスーパーで注文、料理を作るということがタベリー１つでできます。特にこの「オンライン注文機能」はいままでネットスーパーの商品を１つ１つ選択して注文していたものを、自動でカートに追加し注文できるのでとても便利です。 10Xではよりよいチームを目指しメンバーを募っています。エンジニアも募集しています。チームがどのように開発しているかは社長の矢本さんが書いた「10Xなプロダクト
Nuxt.js with TypeScript and Composition API - Qiita
はじめに この記事は Nuxt.js Advent Calendar 2019 6日目の記事です。 皆さん、Composition API 使ってますか？ Composition API は現在開発中で、2020年1Qにもリリース予定の Vue.js 3.0 からデフォルトで搭載されることになっている新しいコンポーネントの実装方法です。Composition API を使うことで、散らかりがちだった実装を一箇所に固めることができたり、今まで組み合わせにくかった TypeScript との連携が比較的やりやすくなったりします。Vue.js 2.x にもプラグインとして導入すれば今すぐ使い始めることができるようになっています。 この記事では、その Composition API を Nuxt.js に導入し、さらに TypeScript を使ってなるべく1型の力を借りて型安全なフロントエンドを
Nuxt.jsのPage ComponentのStorybook化 | tsuchikazu blog
これは、Nuxt.js Advent Calendar 2019 1日目の記事です。 今の職場では、Vue Fes 2018で発表した 1年間単体テストを書き続けた現場から送る Vue Component のテスト の通り、Storybook + reg-suit を利用したVisual Regression Testingを今でも継続してやっています。 Storybookの本来の用途である、いわゆるcomponentのカタログとして使うよりも、pageなど大きな粒度のcomponentの見た目のテストのためにStroybookを利用しています。これはテストに利用するということを考えると、設計の可動域を確保し今後のリファクタリングなど変更のしやすさを考えると、より大きな粒度のテストにしておいたほうがよいだろうという判断をしています。(もちろん、それだけで全てのテストケースを網羅するのではな
Nuxt.jsでもFunction APIを使う
<template> <div> <div>{{ `x: ${x}` }}</div> <div>{{ `y: ${y}` }}</div> </div> </template> <script lang="ts"> import Vue from 'vue' import { ref, onMounted, onUnmounted } from '@vue/composition-api' export default Vue.extend({ setup() { const x = ref(0) const y = ref(0) const update = (e: MouseEvent) => { x.value = e.pageX y.value = e.pageY } onMounted(() => { window.addEventListener('mousemove', u
うちのチームにおけるTypeScriptの付き合い方
MVPは最低限の機能しか作らないので、ブラッシュアップするのが前提にある。 なので変更しやすい方がいい
Nuxt TypeScript
Code completion One of the biggest advantages of TypeScript is its code completion and IntelliSense. IntelliSense provides active hints as a code is added. Type safety Types increase your agility when doing refactoring. It’s better for the compiler to catch errors than to have things fail at runtime. Code quality Types have a proven ability to enhance code quality and understandability. Large team
Vue.js SEO Tips | DigitalOcean
While we believe that this content benefits our community, we have not yet thoroughly reviewed it. If you have any suggestions for improvements, please let us know by clicking the “report an issue“ button at the bottom of the tutorial. Search Engine Optimization, or SEO, is a crucial part of any website or web app. Applications and sites that are not easily indexed by search engines or poorly opti
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://builtwithnuxt.com/
GitHub - acidjazz/tv-toast: Programmatic toasts for Nuxt.js powered by Tailwind CSS
Storybook Integration for Nuxt
Singlelink - The open-source Linktree alternative
Quick way to implement darkmode in Nuxt.js & Tailwindcss — Corona Virus Tracker
Release v2.12.0 · nuxt/nuxt
GitHub - pimlie/nuxt-memwatch: Quickly watch real-time memory stats of your nuxt app
GitHub - danielroe/typed-vuex: 🏦 A typed store accessor for vanilla Vuex.
Nuxt.js And TestCode
