Vue.jsで作成された、ちょっと面白くて役立ちそうなサービス

2020-05-16
vue.jsnuxt.js
    

目次

概要

Vue.jsで作成されたプロジェクトを紹介しているサイト 「made with vue.js 」があります。

面白くて役立ちそうなツールやサービスをまとめてみました。

UIコンポーネント

VueSocial

ソーシャルサービスのボタンを作成するVueのコンポーネント

image.png

CKEditor 5

リッチテキストエディタのコンポーネント

image.png

Vue.Draggable

ドラッグ&ドロップのコンポーネント

Vuetable 2

データテーブルのコンポーネント。demo

image.png

vuejs-datepicker

vueのdatepicker

Kalendar

Vueのカレンダーコンポーネント

image.png

Vue Apexcharts

SVGベースのグラフ可視化コンポーネント

image.png

Vue.js Google Charts

VueのGoogle Charts

image.png

vue-cart

ショッピングカートのプラグイン

image.png

WebIDE

VSCode風WebIDE

image.png

vue-github-activity

GitHubのアクティビティを表示するアプリ

image.png

vue-moment

時間系の処理を行うライブラリのmoment.js のVue版

image.png

テーマ系ライブラリ

VueBase

FireBaseライクなテーマを提供するコンポーネント

image.png

Vuestic Admin

管理画面系のコンポーネント

image.png

Vue Material Admin

マテリアルデザインのコンポーネント

image.png

Vue CRUD

SPAのCRUDアプリのテンプレート

サイト・サービス

MyOngoingsCalendar

アニメのタイムスケジュールを表示するサイト

image.png

CrashTested

安全なヘルメットを比較できるサイト

image.png

Metal Map

世界各国にいるメタルバンドを地域ごとに紹介しているサービス

image.png

Playlister.me

YouTube動画のプレイリストを簡単に作成できるサービス

image.png

ReleaseAlert

映画のリリース日をリマインドしてくれるサービス

image.png

tuneIn

音楽を見つけるアプリ

image.png

vuetube

Vue関連の動画を集めたサイト

image.png

Faviator

ブラウザ上でfaviconなどを作成するサービス

image.png

ツール

Postwomen

APIのパラメータのビルドを補助しリクエストを投げるテストツール。

Postmanのブラウザバージョン的なやつ。

image.png

DrawSQL

データベースの関連図を可視化するサービス

image.png

Labnotebook

機械学習等の実験データを可視化するツール

image.png

VivifyScrum

アジャイルツール (スクラムボード)

image.png

ShapeForMe

3Dプリント用モデルの作成ツール

image.png

Periodicity

Vueで作られた周期表。マウスホバーすると元素の詳細情報を表示する

image.png

drawmote

スマホでディスプレイにお絵かきするアプリ

image.png

Asciiur

アスキーアートをコレクションしたサイト

image.png

DBFS-Explorer

image.png

vue-s3-dropzone

AWS S3にコンテンツをアップロードするサービス

Avatar URL Generator

親しみやすい感じのアバターを作成してくれるサービス

image.png

ParaView Glance

3Dモデルなどのデータを可視化してくれるサービス

image.png

CMS

WP Vue

WordPress REST APIを利用するブログのテーマ テンプレート

image.png

Photon CMS

Laravel + Vueで作られた Headless CMS

image.png

Laravel Nova

Laravel用のテンプレート

image.png

Saleina CMS

静的CMS

image.png

Directus

Headless CMS

ゲーム

vue-tetris

image.png

Space Snake

デスクトップで遊べるゲームアプリ。Vue + Electron製

image.png

Defuse

マインスイーパー的なやつ

image.png

Rotten Soup

ローグライクなゲーム

image.png

    
s-yoshiki
s-yoshiki
githubtwitterqiita
Web作ってますが、インタラクティブなプログラミングも好きです。
JavaScript / Vue / node.js / PHP / AWS / OpenCV

関連記事

SQL整形ツールを作成した
特徴 使い方 FW/ライブラリ等 nuxt sql-formatter-plus Monaco Editor おまけ ソース SQL整形ツールを作成しました。 URLはこちらです。 SQL…

Firebase + Nuxt で認証付きページを作るときに参考にしたいところ
Webアプリケーションのセッション管理にJWT導入を検討する際の考え方 Service Worker によるセッション管理 ユーザー セッションの管理 Nuxt.jsとFirebaseでSPA×SSR×PWA×サーバーレスを実現する CookieとセッションとJWT SSR…

shields.io用アイコンジェネレータを作ってみた
デモ 情報 参考 ソース shields.io用アイコンジェネレータを作ってみました。 デモ 情報 Vue + codesandboxで作ってみました。 詳しい作り方はここを参考にしてください。 参考 https://tech-blog.s-yoshiki…

MonacoEditor + Vue を使ってエディタを実装
紹介 セットアップ Vue vue-monaco Usage サンプルコード ポイント テーマカラーについて エディタのリサイズ エディタの変更の検知 Vue + MonacoEditorでJS…

画像のプーリング処理 canvas + JavaScript
プーリング処理について サンプルソース デモ 参考文献 JavaScriptで画像のプーリング処理を行ってみました。 プーリング処理について プーリングは畳み込みに似た処理で、CNN…

ブラウザで動くAtCoder用のデバッガを作ってみた (JSのみ)
AtCoder-JsDebugger 説明 フレームワーク、ライブラリなど ブラウザで完結するAtCoder用のデバッガを作ってみました。 対応言語は(JS)のみになっています。 というのも、書いたコードをブラウザ上でeval…

JavaScriptで画像処理100本ノックに挑戦してみた
画像処理100本ノックについて JavaScriptで挑戦してみる デモサイト GitHub フロントの実装について 問題の解説 JSで挑戦するメリット・デメリット 関連 画像処理100本ノックをJavaScriptで挑戦してみました。 Qiita…

vue-cli3のセットアップと開発サーバ起動からバンドルファイル生成まで
検証環境 vue@cliの導入 vueプロジェクトの作成 開発・本番ビルドの設定 各項目の設定 参考 Vue.jsで作ったアプリをGitHub Pagesで公開する方法について。 検証環境 nodejs 11.10.0 npm 6.7.0 vue@cli 3.…

最新の投稿

Python poetryでパッケージ開発 PyPIで公開 Pytestでテスト CIをGitHub Actionsで回す
Poetry でパッケージ開発 pytest でユニットテストを実施しカバレッジを算出する パッケージをビルドし PyPI で公開する 検証環境にデプロイする 本番環境にデプロイする GitHub Actions で CI を回す codecovの設定 GitHub…

Perlでconstant(定数)をhashのキーに使う
ハマった事象 解決方法 1 括弧をつける 2 & をつける 参考にしたサイト Perlでconstant(定数)をhash…

php-fpmのステータスページを表示 Apache & htaccess
試した環境 php-fpm の pm.status_path について php-fpmのconfの設定 .htaccess の設定 アクセスしてみる 参考にしたサイト Apache環境で php-fpm のステータスページを htaccess…

DBクライアントツールはDBeaverをおすすめしたい
DBeaver について 特徴 対応DB 対応OS 利用環境 アーカイブ インストール windows mac Linux コネクションの作成 SQLを実行する その他 CloudBeaverについて 今までいくつかのDB…

CentOS8 に Oracle12.2 clientをインストールする
実施した環境 セットアップ clientツールの 準備 インストール 環境変数にパスを通す 実行 libnsl.so.1: cannot open shared object file と表示される場合 CentOS8 に Oracle12.2 client…

フェールセーフやフェールソフト・フールプルーフ 障害対策用語の整理

JSで32ビット符号付き整数に対してのビット演算でハマった
具体例 参考にしたサイト JSでサブネットマスクの計算を行おうとしたとき、ビット演算でハマりました。その時のメモです。 JSでサブネットマスクの計算 JSでビット演算子を利用する場合 3…

Gitにプロキシを設定する
プロキシを設定する 確認 Gitでプロキシを通しておくメモです。 プロキシを設定する 以下のコマンドでproxyを通します。 ※ がプロキシのURL…

JSでIPアドレスがサブネットマスクで指定した範囲内にあるか判定する
IPアドレスが指定した範囲内にあるかどうか判定 参考にしたサイト JSでIPアドレス(IPv4)が指定したサブネットの範囲に含まれるか判定するロジックを作った時の記録です。 IPアドレスが指定した範囲内にあるかどうか判定 処理としては、IP…

プログラムの数値計算で発生する誤差の種類 丸め誤差・打ち切り誤差・桁落ち
はじめに 誤差の種類 丸め誤差 打ち切り誤差 桁落ち 情報落ち 桁溢れ誤差 参考にしたサイト コンピュータで出てくる誤差はいくつかありますが、 それらをコードに落として整理しました。 はじめに 例えば の計算の答えは 0.6666666666…

Tags

Dates

© 2021   404 motivation not found