フレームワーク - Vueの記事一覧
Snapcode - Webベースのスニペット管理
プログラミングをしていると、繰り返し使いたくなる便利な関数ができたりします。そうした関数は同じプロジェクトではなく、異なるプロジェクトでも使いたくなるでしょう。今回はそうしたちょっとしたコードを管理する、Webベースのスニペット管理であるSnapcodeを紹介します。## Snapcodeの使い方メイン画面です。タグと...
A Jira clone built with Vuejs & Nodejs/Graphql - node/GraphQLで作られたJiraクローン
意外と（？）Jiraのクローンは多いです。Webベースのプロジェクト管理として一定の地位を築きつつあり、多くの企業で使われています。10人まで無料ですが、その後は有料のサブスクリプションサービスになります。そんなJiraクローンとして名前の通り、A Jira clone built with Vuejs & Nodej...
Trello Clone - Vue製のカンバン
Trelloのようなカンバンシステムを使うことで、ステータスが変化するデータをうまく可視化できるようになりました。プロジェクト管理はもちろん、注文の処理状況、製造現場でのステータス可視化など様々な場面で活躍しています。そんなカンバン表示を自分たちのシステムにも組み込みたければオープンソースなものを使いましょう。今回はV...
Wiki.js - モダン、軽量なnode製Wikiエンジン
Wikiは2000年くらいから存在していますが、今なお新作が登場する分野でもあります。新しい技術やトレンドを取り込んで、新しいWikiが登場します。GitHub Wikiのように、サービスの中の一機能として取り込まれるケースも多いです。今回紹介するWiki.jsはnodeで作られたWikiエンジンです。レンダリングエン...
Rotten Soup - Vue/PixiJS製のローグライクゲーム
ローグは1980年代に作られたRPGで、テキストでグラフィカルなダンジョンを表現した画期的なゲームでした。現在ではグラフィカルなUIは当たり前ですが、今なおローグライクと呼ばれるローグを継承するようなゲームが多数作られています。今回紹介するRotten Soupもそんなローグライクなゲームの一つですが、Webブラウザ版...
GAS 家計簿 - Google Apps ScriptとVueで作られたWeb家計簿
IT技術の発展はめざましく、日々新しい技術が登場しています。例えばサーバレス、VueやReactの仮想DOM、ちょっと前であればRESTful APIなどがあります。それらを漏れなくキャッチアップするのは大変です。今回紹介するGAS 家計簿はサーバレスにGAS（Google Apps Script）を使って家計簿Web...
fontvuer - Vue製のマルチプラットフォームで使えるフォントビューワー
コンピュータの中には多くのフォントがインストールされています。それぞれのフォントを切り替えて表示したくらいでは、何が違うのか分からなかったりします。また、一つ一つ切り替えながら確認するのは億劫です。そこで使ってみたいのがフォントビューワーになります。今回はマルチプラットフォームで使えるfontvuerを紹介します。##...
ゆるGIFメーカー - 画像を振るわせてアニメーションGIFを生成
アニメーションGIFは動いていなければ意味がありません。しかし、アニメーションを一から作るのは大変です。動画などの素材をベースにするのはそのためです。コマ撮りで作るのは時間も労力もかかります。そこで一枚の画像からでもアニメーションGIFが作れるゆるGIFメーカーを使ってみましょう。フルフルと震える、新しいかわいらしさを...
診断チャートメーカー - 誰でも簡単に診断チャートを作成
二択の選択に沿って進めていって、最終的に何らかの診断がくだされる診断チャートは人気があるコンテンツです。動物占い的なものであったり、自分の特性に合わせた性格診断など、誰もが一度はやったことがあるでしょう。そんな診断チャートを自作できるのが診断チャートメーカーです。## 診断チャートメーカーの使い方トップページです。自作...
Grid.js - React/Angular/VueをサポートしたHTMLテーブルライブラリ
HTMLで使ってデータをテーブル表示するのは簡単です。しかし、ちょっとUIをよくしたり、ソートなどの機能を追加しようと思うと、途端に面倒になります。素のHTMLのままではとても使い勝手がいいとはいえません。そんなHTMLテーブルを手軽に高機能化してくれるライブラリがGrid.jsになります。## Grid.jsの使い方...
OBS Remote Tablet - OBSの操作をリモートから行う
オンラインでイベントが行われるようになって俄然注目が集まっているのがOBSです。OBSを使ってウェビナーやミートアップを配信している人は多いでしょう。機能が多いだけに、OBSの使いこなしによって品質が大きく変わります。今回はOBSをタブレット、Webブラウザから使えるようにするOBS Remote Tabletを紹介し...
小窓さん - ワイプ付きで任意のアプリを表示できるオンライン会議ユーティリティ
オンラインで会議やイベントに登壇している際に、通知が出てしまったり、他のアプリケーションが表示されてしまったりして焦った経験はないでしょうか。普段ならなんということもない操作も、焦ったりすると間違えることが多々あります。そうしたミスを防ぎたい時に使えるのが小窓さんです。小窓さんさえ画面共有すれば、ワイプ付きで配信できま...
ChromeGalvanizer - Google Chromeのセキュリティポリシーを作成
Google Chromeのシェアが伸び、企業内でもGoogle Chromeを使っているケースが増えています。Google Chromeといえば機能拡張が便利ですが、中にはセキュリティ上好ましくないものもあるでしょう。そういった時に使いたいのがChromeGalvanizerです。Google Chromeを企業内で...
MultiReplace - 置換条件をまとめて指定してテキスト変換
文字を入れ替える置換処理を何度も繰り返し行うことがあります。正規表現を使えば複数のパターンをまとめることもできますが、それでもなお、何度も何度も行わないといけないこともあるでしょう。そこで使ってみたいのがMultiReplaceです。TSV形式で置換条件をまとめて設定できます。## MultiReplaceの使い方利用...
CostBox - PWA対応のシンプルな支出管理
お金を管理する際の基本は、支出を把握することです。節約しているつもりではあっても、記録しないと意味がありません。記録することで可視化し、状態を把握できます。その次に改善するフェーズがあります。今回紹介するCostBoxは支出を記録するのに特化したアプリケーションになります。## CostBoxの使い方メイン画面です。!
Trollo - Vue/Vuex製のカンバンシステム
Trelloのようなカンバン機能はプロジェクト管理に限らず利用できそうです。自分たちで開発しているWebサービスの中に組み込みたいと思った方も少なくないでしょう。しかし実際に開発してみると意外と機能が多いと感じるかも知れません。そこで使ってみたいのがTrolloです。Vueで作られていますので、Vueアプリケーションの...
Gantt-elastic - Vue製のガントチャート
プロジェクト管理では必ずといってもいいほど使われるのがガントチャートです。プロジェクト管理のシステムには組み込まれているものが多いですし、Excelなどを使って自作のガントチャートを利用するケースもあります。今回紹介するGantt-elasticはVueベース、Webブラウザで使えるガントチャートライブラリです。## ...
東京都 新型コロナウイルス感染症対策サイト - オープンデータを活用したコロナウイルス情報集約サイト
新型コロナウイルスが一気に広まっています。学校が休校になり、会社はリモートワーク推奨に、さらに多くのイベントが中止や無観客での開催を余儀なくされています。いつまでこの状況が続くのか先行き不透明な状態ですが、ただうつむいていても意味がありません。この時だからこそできることもあるはずです。今回紹介する東京都 新型コロナウイ...
mute.vc - VCな人たちをまとめてミュート
Twitterにはブロックではなくミュート機能というのもあります。ブロックするほどではないけれど、ツイートを見たくないという時に使える機能です。せっかくTwitterを楽しんでいるのに、見たくないツイートで残念な気分になるのは避けたいものです。今回紹介するmute.vcはいわゆるVC（ベンチャーキャピタル）に関わる人た...
massCode - マルチプラットフォームで使えるスニペット管理
開発をしていてプロジェクトをまたいで繰り返し使うようなコードはスニペットとして登録しておくと便利です。ライブラリ化するまでもないコードだったり、Webブラウザの開発者ツールで頻繁に実行するコードもスニペットにしておくと便利です。今回紹介するmassCodeはマルチプラットフォームで使えるスニペット管理となっています。#...