GitHub - gridsome/gridsome: ⚡️ [WIP] Build blazing fast websites with Vue.js & GraphQLYou signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session.
![GitHub - gridsome/gridsome: ⚡️ [WIP] Build blazing fast websites with Vue.js & GraphQL](https://cdn-ak-scissors.b.st-hatena.com/image/square/cd73519a02c9076f64756980c2707b71063489d2/height=288;version=1;width=512/https%3A%2F%2Frepository-images.githubusercontent.com%2F143078055%2F2e21a680-b669-11ea-8096-701d1f1600b6)
Style Guide | Vue Patterns
# Style Guide Official - Style Guide Vue.js Component Style Guide # Refactoring Refactoring Vue: Cleaning Up a List of Posts With Better Component Splitting and More ES6 Clean up your Vue modules with ES6 Arrow Functions Examples of Vue’s Clean Code Optimizing Performance with Computed Properties Simplify Your Components with Computed Setters Learn how to refactor Vue.js Single File Components wit
ZOZO大忘年会でFirebaseを使った1,000人規模のリアルタイムアンケートを制作した話 - ZOZO TECH BLOG
こんにちは！ ZOZOテクノロジーズ フロントエンドエンジニアの高橋（ニックネームはQ）です（@anaheim0894） 昨年12/26、毎年年末に行われる大忘年会（ZOZOCAMP2018）で、グループ会社も含めた1,000人規模でのリアルタイムアンケートを、FirebaseとVue.jsを使って制作しました。 当日会場にて弊社の昨年の事業紹介や、「楽しく働く」というコンセプトの動画を流し、動画の合間で質問をし動画と一体となるような演出を行いました。 その質問に対して全社員それぞれのスマートフォンで回答できるシステムを作ったので、その制作の裏側や、当日の様子などご紹介させていただきます。 まずは当日の様子の紹介 これを実現するまでの様子をご紹介いたします。 CAMP運営してくれている社員にもらった要件 CAMPの2週間前、運営の社員の方からこのような依頼をもらいました。 会場で、リアルタ
Gridsome - Build blazing fast websites with Vue.js and GraphQL
A Jamstack framework for Vue.js Gridsome makes it easy for developers to build static generated websites & apps that are fast by default 🚀 Get started Open-source MIT Licensed. GitHub (v0.7.23) CMSsAny Headless CMS, Contentful, WordPress, Drupal, Sanity.io, etc. DataAny APIs, Databases, AirTable, YAML, CSV, JSON, etc. MarkdownAny Git-based CMS, Forestry, Netlify CMS, Blogs, Documentation.
社内管理画面を Vue + Go で作る - Gunosy Tech Blog
広告技術部のUTと呼ばれている @mocyuto です。 普段は広告配信のバックエンドを主に担当しています。 今回は社内管理画面を作った話をお伝えしたいと思います。 はじめに 設計 バックエンド goa 構成 フロントエンド 構成 TypeScript Vuex Atomic Design まとめ はじめに Gunosyの管理画面ではRailsが多いですが、社内用管理画面を新規で作ることになり、Vue + Go のSPA（Single Page Application）で作ることにしました。 管理画面をVueとGoで作る事例は最近増えてきていますが、弊社でもすでにこの組み合わせで実績はあり、２つ目となりました。 今回の社内向けの管理画面の作成意図としては、ABテスト反映の高速化が目的です。 今までは、リリースフローは以下のようになっていました。 配信チームとロジックチームをまたいでファイル
Vue Patterns
GitHub PatternsComponent DeclarationComponent CommunicationComponent Events HandlingComponent Conditional RenderingDynamic ComponentFunctional ComponentRenderless ComponentCompositionPassing Props & ListenersHigher Order Component (a.k.a. HOC)Provider / ConsumerDependency injectionHandling ErrorsProductivity TipsUseful LinksFullstack Vue BookTranslations
デザインツールを導入したシームレス開発＆チームビルディング
DMM.comのプロダクト開発の現場で、次世代デザインツールを組織に導入し、モブデザイニングやプロトタイピングなどデザインワークを通したチームコミュニケーションの形成や、機能横断的な開発体制に向けた取り組みについて紹介します。 2018年5月11日に行われたデザインイベント「Design & Collaboration」での登壇資料です。 https://connpass.com/event/8544
Vue.js アプリケーションを Docker 化する — Vue.js
最終更新日: 2019年10月29日 簡単な例あなたははじめての Vue.js アプリケーションを素晴らしい Vue.js webpack テンプレート を利用して作成し、Docker コンテナで実行もできることを同僚に披露したいと思っています。 ではプロジェクトルートに Dockerfile を作成しましょう: FROM node:lts-alpine # 静的コンテンツを配信するシンプルな http サーバをインストールする RUN npm install -g http-server # カレントワーキングディレクトリとして 'app' フォルダを指定する WORKDIR /app # `package.json` と `package-lock.json` （あれば）を両方コピーする COPY package*.json ./ # プロジェクトの依存ライブラリをインストールする R
Vue CLIのプロジェクト管理UIがいい感じだった - Qiita
表示されました。日本語対応されてます！ 作成ボタンからプロジェクトを作成してみます。 どのディレクトリに作成するか指定できます。 画面下の「ここに新しいプロジェクトを作成する」ボタンをクリック。 プロジェクト名やパッケージマネージャ(NPM or YARN)などの指定ができます。 コマンドでやるよりわかりやすいですね^^ 「手動」を選択すると細かく機能選択できます。 詳細情報のリンクもあってとっつきやすいです。 各種オプション指定。英語だからなぁ。。。という方はGoogle Chromeの「日本語に翻訳」が出番ですよ！ はい。大体わかります。 次回同じ設定でプロジェクト作成できるようにプリセットも保存できます。 プロジェクト作成中。ここはコマンド実行と同じく時間がかかります。 vue ui コマンドを実行したターミナルです。 インストールが完了すると、プロジェクトの管理画面が表示されました
TypeScriptでVue.jsを書く – Vue CLIを使った開発のポイントを紹介
2018年8月11日に新しいメジャーバージョンとなるVue CLI 3.0がリリースされました。Vue CLI 3では、公式にTypeScriptをサポートし、 TypeScriptを利用するプロジェクトの生成に対応しました。これにより、TypeScriptでVueを気軽に試せるようになったということで、今回ちょっとどんなものか試してみることにしました。試した中でポイントとなりそうな部分をまとめてみたので紹介します。なお、私は普段はAngularでTypeScriptを書いているため、TypeScriptのクラス構文を使った説明になっています（クラス構文を使わなくても、TypeScriptでvue.jsを書くことはできます）。 目次 はじめに – Vue CLI + TypeScript TypeScript + Vue サンプル Vue CLIでTypeScriptプロジェクトを生成する
WebStormでVue.jsの快適な開発環境をつくる
追記(2019-02-15) WebStorm, vue-cliのバージョンが上がり状況が変わったので加筆修正 （特にJest回り） 概要 WebStorm上でVue.jsアプリケーションの開発するにあたって、そのままだと使い勝手がイマイチなところがあったので色々設定を追加したりいじったりしたらだいぶ快適になったというお話。 なお、本記事で作成したプロジェクトはGitHubで公開しているので、参考になれば幸いである。 IsaoTakahashi/web-storm-setup 追記(2019-02-15) 最新のmasterは2019-02-15に検証した3.4.0のものになっている なぜWebStormか もともとIntelliJを使っていて、自分の手になじんでいる。 VSCodeと交互に使用感を試した結果、やっぱり自分にはJetBrains製品が一番だと思った。特に自分の中で重要視して
Vue.jsとHTMLとCSSで3Dアクアリウムを作ってみた - Crieit
ブラウザで見ることができる3Dアクアリウムを作ってみました。 この3Dの実装は基本的にはHTMLとCSSだけで出来ています。canvasも使っていません。Vue.jsも使っていますが、魚を泳がせたり視点を変更するための用途のため、3D描画自体にはあまり関係ありません。 記事の最後に操作できるCodePenを配置してあるので読むのが面倒な方はそちらを見てしまってください（大泣きしながら）。 作り方 HTML HTMLは単にそれぞれの素材を配置しているだけです。 <div id="app" @mousemove="onMouseMoved" @touchmove="onMouseMoved"> <div class="container" :style="rotation"> <img class="bg" src="bg.jpg"> <img class="water front" src=
The Vue.js Cheat Sheet
The Vue.js Cheat Sheet▶︎ Common commands and instructions you'll use in your day-to-day Vue.js coding sessions Jul 10, 2018 → Download my free JavaScript Handbook! <!-- TOC --> DirectivesConditionalsWorking with form elementsModifying eventsMouse event modifiersSubmit an event only if a particular key is pressedKeyboard event modifiersLifecycle HooksBuilt-in componentsGlobal Configuration of the V
Vue Native
Vue Native is a framework to build cross platform native mobile apps using JavaScript
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Awesome UI component library
GitHub - willmcpo/body-scroll-lock: Body scroll locking that just works with everything 😏
Vue Numeric Input Component: Install and Play - Vue.js Feed
VueToolbox
Examples of vue-modal-dialogs
Vue CLI UIが想像以上に便利だった話 - Qiita
