Moment.jsを使って、指定した日までどれくらいかを表示する | KEYPOINT – キー・ポイント株式会社 開発日誌
tです。 Moment.jsというJavaScriptのライブラリについて紹介します。 Moment.jsは日付処理を行うライブラリです。JavaScriptには、標準でDateクラスがありますが、Moment.jsは、多言語対応や様々な機能が追加されています。 今回は、現時刻から指定した日(2017年7月1日)まで、どれくらいあるか表示する方法を、2パターンご紹介します。 1.だいたいの単位で表示する (Twitterのツイートの時間表示などでよく見られます) 2.正確に表示する (カウントダウンイベントなどで使えるかと思います) 実行環境 Node v7.10.0 Moment.js v2.18.1 1. だいたいの単位で表示する 以下のようにするだけで、だいたいの単位で表示できます。 fromNowを実行するだけなので、簡単です。
Promiseによる非同期処理の書き方 - 30歳からのプログラミング
JavaScriptは基本的に逐次処理、同期処理であり、上から順番にプログラムが実行されていく。 x行目の処理が終わってからx+1行目の処理を行う、という具合に、一つ一つ実行していく。 非同期処理を行うための方法も以前から用意されていたが、ES2015で導入されたPromiseによって、より簡便に実装できるようになった。 なお、ここに書かれているものは全て、v6.4.0のNode.jsで実行した結果である。他の環境だと、ログの内容が異なるかもしれない。 Promiseの基本 new Promise()でPromiseのインスタンスを作り、それを操作することで非同期処理を管理していく。 new Promiseの引数には関数を渡す。 そしてその関数の第一引数としてresolveを、第二引数としてrejectを設定し、処理が上手くいったら前者を、失敗したら後者を実行する。 不要であれば、reje
jQueryでData Table / Grid 操作が出来るライブラリの参考URLメモ(2015-03) - msakamoto-sfのはてなブログ
2015-03-29 jQueryでData Table / Grid 操作が出来るライブラリの参考URLメモ(2015-03) JavaScript jQuery 2015-03時点で、jQueryでソートとかグルーピングとか出来ちゃう高機能なTable/Gridライブラリってどんなのがあるんだろうか、といくつかのまとめサイトから好評そうなのを見繕って、参考URLをまとめたメモ書きです。 データ操作に役立つjQueryプラグイン （1/4）：CodeZine http://codezine.jp/article/detail/5946 グリッドレイアウト採用時に便利なjQueryプラグイン 20 | NxWorld http://www.nxworld.net/tips/jquery-grid-layout-plugins.html JavaScriptのGridライブラリ決定版 - S
vimを使っている人はみんなctagsで幸せになれる権利を持っている - アラのアラアラしい日記
こんにちは！飲み過ぎてよくお腹を壊す人です。 結構長い間vimを使って開発をしているのですが、じょうよわなのでこの間初めて知りました。 開発中にどこから呼ばれてるのか分からないクラスやモジュールとかをgit grepしてたんですけど、 ctagsが超便利すぎて泣いて喜んだのでメモです。 まずインストールです。macの場合はctagsというコマンド自体は最初から入っていますが、 バージョンが古いのか、なんだか仕様が若干違うのでhomebrewでinstallし直すと良いと思います。 $ brew install ctags 設定ファイルは.ctagsに書きます。 ctagsのインストールが完了したら、"tags"というindexファイルを作成します。 ソースのあるディレクトリで以下のようなコマンドを入力します。 $ ctags -R tagsというファイルが存在していたら成功です。 また、j
Javascriptを使うのをやめろ：Railsの時代遅れ云々についての結論 - Qiita
結論: Javascriptの乱用をやめるのが一番。 はじめに書いておきますがしょうもない話です。 結論、開発者としてはどのような方向性でやるべきか、を書いています。 JS多い時代でのフレームワークの根本的な問題云々のことは書いてません。 さて、現状、モバイルにおいて、Javascriptでまともに動くものを作ることは難しいです。 Twitterから引き抜いた超優秀なWebエンジニアを多数抱えるMediumですら、未だにモバイルで多数のバグを抱えています。 超優秀なエンジニアを世界一抱えているであろうGoogleのGmailですら、モバイル版のWebはすぐクラッシュします。また、自前スクロールに致命的なバグも抱えています。 正確には「UIが不審な挙動をする」ですが、エンドユーザにとっては同じことで、「バグ」です。 サーバサイドで起こるバグと同じ程度、いやそれ以上に、サービスに影響を与えます
お手軽データバインディングライブラリ「Vue.js」を使いこなそう（基礎編）
はじめに Vue.jsは、シンプル・軽量・高速という特徴を持つデータバインディングライブラリとして最近注目を集めています。LINE社でもアプリ内WebViewの実装技術の選択肢の一つとしてVue.jsを採用しています。2014年11月27日にリリースされたLINEスケジュールは、Vue.jsを使って実装しているSPA（Single Page Application）の代表例です。 本稿は日本語記事がまだ少ないVue.jsの基本機能の紹介を目的とした「基礎編」として、公式ドキュメントの内容を元に解説します（執筆時点のバージョンであるv0.11の内容です）。 Vue.jsとは Vue.jsは、双方向バインディングによるModelとViewをつなぐ仕組み「ViewModelレイヤー（MVVMパターン）」を提供するJavaScriptのライブラリです。 Vue.jsの基本概念は以下のようになってい
JavaScriptでプログラムできるマイコンボード「Tessel」、スイッチサイエンスが販売
ボードにはWi-Fiを搭載する他、拡張モジュールを接続できるポートが4つ用意されている。モジュールには、カメラや加速度センサー、Bluetooth LE、温度と湿度を計測できる環境センサーなどが用意されており、これらモジュールの利用するためのライブラリはnpmで提供される。なお、販売権取得に伴い、同社ではチュートリアルの日本語化を行っている。 関連記事 「mbed」で始めるARMマイコン開発入門（1）：初歩から学ぶ、マイコン開発とARMプロセッサー 組み込みの世界では最も成功したプロセッサの1つ「ARM」を用いたマイコン開発にチャレンジします。クラウド開発環境「mbed」を使い、プログラムを書きながら回路をブレッドボードに実装、動作を確認しながらさまざまな内蔵デバイスの使い方をマスターしていきます。 「mbed」で始めるARMマイコン開発入門（2）：ARM開発環境準備の第一弾、書き込み器を
Javascript Viewer, Beautifier and Formatter, Editor
Enter your messy, minified, or obfuscated Javascript (JS) into the field above to have it cleaned up and made pretty. The editor above also contains helpful line numbers and syntax highlighting. There are many option to tailor the beautifier to your personal formatting tastes. When do you use Javascript Viewer, Beautifier and Formatter, Editor Often when writing Javascript (JS) your indentation, s
Knockout : Simple list example
Introductory examples Hello world Working with ko.observable & ko.computed Click counter Using declarative bindings and how KO tracks dependencies automatically Simple list Working with ko.observableArray Better list Combining more behaviors Control types Reference: All HTML control types Working with Collections Working with arrays, including nested ones Paged grid Creating reusable components, i
<script>タグのasync属性を使わずに非同期でJavaScriptを読み込む方法 | さくらたんどっとびーず
HTML5 では <script> タグに async という属性が加わってまして、これを指定しておくと src で指定された JavaScript ファイルの実行が非同期で行われます。（src 属性を指定しないと async は意味を持ちません。） <script type="text/javascript" src="http://..." async="async"> </script> ググってると async の値として async=”true” を指定しているページが多いようですが、W3C の HTML5 の定義（4.3.1 The script element と 2.4.2 Boolean attributes 参照）だと空の文字列か属性名そのものを指定しろってことになってますので、こっちが正しいです。（たぶんw） If the attribute is present,
Thinking Async | CSS-Tricks
Here’s the rub: when you load JavaScript from a third party you should do it asynchronously. You might want to load your own scripts asynchronously too, but for this article let’s focus on third parties. There are two reasons for this: If the third-party goes down or is slow, your page won’t be held up trying to load that resource. It can speed up page loads. At Wufoo, we just switched over to an
“use strict”（厳格モード）を使うべきか？｜もっこりJavaScript｜ANALOGIC（アナロジック）
変数の使用の単純化 withの使用の禁止 strictモードではwith文が使えなくなります。代替の手段としては、オブジェクトに短い名前の変数を割り当てて、その変数を用いて対応するプロパティにアクセスすることができます。 eval内で宣言された変数のスコープ 非strictモードでは、eval("var x ;")の様に、eval関数内で定義された変数のスコープは、evalが含まれるスコープ（関数、またはグローバルスコープ）まで広がりますが、strictモードでは、eval内で定義された変数を周囲のスコープに広げません。 単純名の削除の禁止 strict モードでは delete name を構文エラーにします evalおよびargumentsの単純化 strictモードでは「eval」「arguments」という名前がキーワードとして扱われるため、これらのキーワードに対して言語構文でのバ
RequireJSの導入から使い方（Bowerにも触れてみる） - yutaponのブログ
Backbone.jsのRouter編を書く前にどうしてもRequireJSについて おさらいしておきたく書いてみる。 あまり深くRequireJSについて理解してなかったこともあり、 結構調査したので理解が深まった。 それと今まで使ったことなかったけどBowerにも触れてみる。 結構長いのでアウトラインを。 環境整備 Bowerでライブラリを管理する RequireJSの使い方 HTML側の記述 JS側の記述 モジュールの作り方 おわりに 環境整備 今回は新しいexpressプロジェクトを作成して環境を整備していきます。 $ cd path/to/workspace # 作業ディレクトリに移動して $ express -e -c stylus requirejs # ejs, stylusを有効にしてrequirejsというプロジェクトを作成 $ cd requirejs # プロジェク
Take it easy- RequireJSについてまとめてみた
REQUIRE JS JSの非同期ローディングとモジュール化を行うライブラリ 公式サイト 詳しくは、RequireJS実践編を参照 下記順番で読み込み(config-require.jsは自作。名前はなんでも良い) ＜script src="config-require.js"> ＜script data-main="main" src="require.js"> 非同期ローディングについて 下記を参考にconfig-require.jsを作成 設定値の詳細はこちらを参照 var require = { deps: ["some/module1", "my/module2", "a.js", "b.js"], callback: function(module1, module2) { //This function will be called when all the dependen
underscore.js
Establish the root object, window (self) in the browser, global on the server, or this in some virtual machines. We use self instead of window for WebWorker support. var root = typeof self == 'object' && self.self === self && self || typeof global == 'object' && global.global === global && global || Function('return this')() || {};
jQuery multiselect
I'm a user-friendlier drop-in replacement for the standard <select> with multiple attribute activated. Free (under WTFPL license) Works in an unobtrusive fashion Fully open sourced Keyboard support Provides some callbacks Fully customizable via CSS Depends on jQuery 1.8+ Tiny code ~8kb minified HTML <html> <head> <link href="path/to/multiselect.css" media="screen" rel="stylesheet" type="text/css">
javascript - IPアドレスヘルパー : 404 Blog Not Found
2008年04月26日03:30 カテゴリLightweight Languages javascript - IPアドレスヘルパー そんなあなたのために。 はてなブックマーク - hakoeraのブックマーク / 2008年04月25日 クラスBのIPアドレス計算（サブネット分割）が苦手なオレに優しいもんも作ってください（泣 http://keisan.casio.jp/もビット演算まではしてくれませんしね。 最近はDHCPのおかげでシステム管理者ぐらいしか手でIP Addressを設定したりすることはなくなりましたが、システム管理者には今もなおつきまとう業務でもありますし。 #ISPが生IP Addressを配ってたこともあったよなあ...(遠い目) IP Address: / Netmask: Net Range: 以下、IPアドレスがらみの演算のみソースを。表示系は本entryのH
クラス風継承を今どきの書き方でやってみる - Qiita
発端は自分が書いたブログ記事に対して、@hokacchaさんが今風の書き方ってことでReplyしてくれたのがきっかけです。 ベースというか、ほぼそれのコピペですが記事元ではやっていない処理が追加されていたり、実装していないものがあったりしたのでそれを追加・修正したものです。 'use strict'しても動きます。（翻訳記事元はarguments.callee使ってるので、strictモードで動きません） (function (win, doc, exports, undefined) { 'use strict'; var fnTest = /xyz/.test(function(){xyz;}) ? /\b_super\b/ : /.*/; function Class() { /* noop. */ } Class.extend = function (props) { var Su
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【旧版】D3.js入門 (全17回) - プログラミングならドットインストール
Modifying a Force-Directed Graph
