ITエンジニア/デザイナ向けにオープンソースを毎日紹介

フレームワーク - Vueの記事一覧

プレミアムユーザー限定記事

MOONGIFTプレミアムは、月額500円の有料サービスです。詳細はこちらから

もっと見る

List

  • 2018/12/09

tiptap - Vue.js向けのリッチなWYSIWYGエディタ

WYSIWYGなエディタは開発者ではない人たちにコンテンツを作ってもらいたい時に活躍します。HTMLを手書きするのは困難ですし、編集している内容と結果が異なるので、結果を想像しながら作るのは慣れない人にとっては難しいでしょう。もしVue.jsを使っているならば導入したいWYSIWYGエディタがtiptapになります。多...

List

  • 2018/11/25

Vue Dark Mode - Vueのダークモード用デザインテーマ

macOS Mojaveで取り入れられたダークモード。元々その手のユーティリティはたくさんありましたが、OS標準に入ってきたのが大きなインパクトです。それに伴ってダークモードへの注目が集まっています。近くリリースされるSafariではダークモードがサポートされるそうです。そんな時に使えそうなのがVue Dark Mod...

List

  • 2018/10/28

Book Management PWA Onsen UI Vue

新しい技術を習得したいと思ったら、実際に手を動かして何かを作ってみるのがオススメです。手を動かした経験は誰にも奪われず、自分の知識になります。また、手を動かすことで問題点やハマりどころも理解でき、実際に利用する際に応用できます。今回はPWA(Progressive Web App)を体感するためのアプリケーション、Bo...

List

  • 2018/10/25

Twitter-Web-Like - Vue/MongoDBで作られたTwitterクローン

ソフトウェアを作る際に目的があれば良いですが、なかったとしたらどうしたら良いでしょうか。特に特定の技術、フレームワークを試してみたいと思ったときです。そんな時にオススメなのは、既存のサービスを真似してみることです。今回紹介するのはVueを使ったTwitterクローンのTwitter-Web-Likeになります。## T...

None

  • 2018/10/05

vbuild - VueをPythonでコンパイル

かつてはHTML/JavaScript/CSSは別々なファイルで作成していましたが、Web Componentの流れは違います。機能毎にすべて一つのファイルにまとまり、独立性と再利用性を高めています。そんなWeb Componentの流れを汲んでいるVueのファイルをPythonで解析して出力するライブラリがvbuil...

List

  • 2018/09/30

MyMo - シンプルなWebベースのメモアプリ

メモはシンプルであるのが大事です。気がついた時にすぐメモできなければなりません。立ち上げて新規ファイルを作成して…なんてやっていたら折角のアイディアを忘れてしまいます。忘れる前に、ホットな内に素早くメモするのです。そこで使えるのがMyMoです。Webベースで使える簡単なメモアプリです。## MyMoの使い方トップページ...

List

  • 2018/09/27

Whalebird Desktop - Electron製。マルチプラットフォームで動作するMastodonクライアント

彗星のように現れたソーシャルサービスのMastodon。一時のブームは去りましたが、使っている人たちは徐々に増えています。Twitterと使い分けていて、両方を利用している人も多いようです。そんなMastodonユーザに使ってみて欲しいのがWhalebird Desktopです。ElectronベースのMastodon...

List

  • 2018/08/28

Notational - 思いつきを阻害しないWebノート

メモを取るアプリケーションの大事な要素として、書き手を迷わせたり、悩ませてはいけないという点があります。むしろ自然と手を動かし続け、頭の中にある情報を表現してもらわなければなりません。今回紹介するNotationalもそんなノートアプリの一つです。Vue.jsを使っており、リアルタイムに表示が更新されていくのが気持ちい...

List

  • 2018/08/21

JavaScriptのイベントをたくさん見られるサイト - 開発時に役立つ。JavaScriptのイベント処理を確認

JavaScriptでのアプリケーション開発において肝になるのがイベントのハンドリングです。マウスやキーボード操作などによって多様なイベントが呼ばれます。それらの購読、解除によってアプリケーションを構築するのですが、慣れている人であっても複雑で分かりづらいものです。どんなイベントがあって、どうデータが送られてくるのかを...

List

  • 2018/08/09

Pomotroid - シンプルなポモドーロテクニック用アプリ

ポモドーロテクニックはご存じでしょうか。25分を基本として仕事をし、終わったら5分間の休憩をします。それを何回か繰り返したら、少し長めの休憩を取ると言ったワークスタイルです。特にキッチンタイマーを使うというのが特徴になります。そんなポモドーロテクニックを使うためのソフトウェアがPomotroidです。## Pomotr...

List

  • 2018/08/04

page-transitions-travelapp - ネイティブレベルのUXを体感できるWebアプリ

ハイブリッドアプリやPWAなど、Webアプリケーションをスマートフォンのネイティブアプリ風に使う技術が発展しています。ネイティブアプリと異なり、インストールの手間がなく、プラットフォーマーによる縛りもないのがWebの魅力と言えます。そんなWeb技術を駆使して作られたのがpage-transitions-travelap...

List

  • 2018/07/31

web-riimote - スマートフォンでWii Remote風の体験を実現

Wiiが人気だったのは、コントローラが本体と分離し、さらに無線で遊べたことによって、これまでにない遊び方が提案できたのが一因です。さらに傾きや振動などによって新しい楽しみ方が生まれました。そんなWiiのコントローラ、Wii Remote風の体験をスマートフォンで実現するのがweb-riimoteです。## web-ri...

List

  • 2018/07/18

Misskey - 分散型マイクロブログサービス

Mastodonが一時期流行って、さらにTwitterがユーザを憤慨させるような施策を続けるのに伴って徐々に離れていく人たちが増えています。人にとって居心地の良い空間はそれぞれあるので、使いやすい場所を選ぶのが良いでしょう。今回紹介するのはMisskey、分散型マイクロブログサービスです。## Misskeyの使い方M...

List

  • 2018/07/02

Apple Music web player - Apple Music対応のWebブラウザベースの音楽プレーヤ

2018年のWWDCでAppleが追加した機能の一つにMusicKit JSがあります。その名の通り、JavaScriptからApple Mucisにアクセスできるようにするライブラリです。これまでネイティブアプリでしか音楽は聴けなかったですが、MusicKit JSによってWebブラウザでも楽しめるようになります。そ...

List

  • 2018/06/09

Vue Designer - Vue.jsの表示を確認できるVisual Studio Codeプラグイン

ReactやAngular、Vueなどは独自のタグを使ったWebコンポーネント型のシステムと言うこともあって、これまでのHTMLデザインの手法が通じなくなっています。デザインの確認などで苦戦している人も多いのではないでしょうか。そこで使ってみたいのがVue Designerです。Visual Studio Codeプラ...

List

  • 2018/06/07

vuegg - Vue.jsプロジェクトの画面を作成

ReactやVue、AngularといったJavaScriptフレームワークはHTMLを再定義しており、UIを作るのもそうそう簡単ではありません。デザイナーとの協業も難しく、苦戦している方も多いのではないでしょうか。そこで使ってみたいのがvueggです。Vueの画面をWYSIWYGに設計できるソフトウェアです。## v...

List

  • 2018/06/05

Vuido - Vue.jsでデスクトップ向けネイティブアプリを開発

JavaScriptが多くの環境で動作するようになっています。Webブラウザだけでなく、サーバやスマートフォンアプリなど一つの言語でここまで幅広く動作するものはそうそうないでしょう(特にWebブラウザが問題です)。そんなJavaScriptを使ってデスクトップアプリを作成できるのがVuidoです。Electronと異な...

List

  • 2018/05/10

VuePress - Vueを使った静的サイトジェネレータ

静的Webサイトを生成するツールは多数存在します。多くはHTMLを吐き出すので、それをアップロードします。しかし静的ファイルを使うのでは前時代的なWebサイトと何ら変わりません。そこで使ってみたいのがVuePressです。Vueを使って静的サイトを構築するソフトウェアです。## VuePressの使い方サンプルです。!

List

  • 2018/04/02

gh-blog - GitHub Issueをブログに

GitHubを使ってどんなことができるだろう、そんなことを考えてみると新しいアイディアが沸くかも知れません。コードホスティングとしてだけ見るのではなく、もっと様々な可能性があります。今回はその一つとしてGitHubをブログ化するgh-blogを紹介します。ユニークなのはIssueが記事になることです。## gh-blo...

List

  • 2018/01/01

Vue2 editor - Vueを使ったテキストエディタ

Web上で文章を書く機会が増えています。しかし多くの場合、テキストエリアそのままであったり、普段使っているエディタに比べて操作性が格段に落ちるものばかりです。これでは生産性が損なわれてしまうため、結局エディタで書いてコピー&ペーストせざるを得ません。より使いやすいWebベースのエディタを目指すならVue2 editor...