わずか1行のJavaScriptでWebサイトにリアルタイムコラボレーション機能を実現できる「TogetherJS」を使ってみた！ - paiza times
どうも、まさとらん（@0310lan）です。 今回は、Webサイトやアプリなどへ複数人によるリアルタイムコラボレーション機能を、驚くほど簡単に実現してくれるJavaScriptライブラリのご紹介です！ このライブラリ自体は、数年前から存在しているので知っている方も多いと思いますが、まだ「知らないよ…」という方は、ぜひこの機会にトライしてみてください。 いまだに、ちょっとした「コラボ機能」を実装したい時に重宝する唯一のライブラリになっています！ 【 TogetherJS 】 ■「TogetherJS」の始め方！ それでは、実際にサンプルを作りながら「TogetherJS」がどのようなライブラリなのかを見ていきましょう！ まず最初に、「TogetherJS」を利用するのに必要となる本体ファイル「together.js」をGitHubからダウンロードするか「git clone」で取得します。 も
【2017年版】ブラウザ上で使えるJavaScript開発＆実行環境Webサービスの厳選まとめ - paiza times
どうも、まさとらん（@0310lan）です。 今回は、これからJavaScriptを学習しようという人や、ちょっとしたプロトタイプを開発したい人に向けて、オススメの「オンラインコードエディタ」を厳選してご紹介しようと思います！ 選んだ基準としては…、 SSL対応のWebサービス JavaScriptの実行環境が備わっている 作成した「コード」や「作品」の公開が可能 面倒なログイン不要ですぐに使える 無料で利用できる …などの点を重視しながら、誰でも「ブラウザ」さえあれば今すぐ使えるモノをまとめてみたので、ご興味ある方はぜひ参考にしてみてください！ ■Webページとしても公開できる実用的なエディタ！ 【 PLAYCODE 】 「PLAYCODE」は、まだ新しいサービスですが、JavaScriptプログラミングの学習はもちろんのこと、ちょっとしたプロトタイプの開発に最適なコードエディタと言える
Vue.js - The Progressive JavaScript Framework | Vue.js
The Progressive JavaScript Framework An approachable, performant and versatile framework for building web user interfaces. Why Vue Get Started Install Get Security Updates for Vue 2 Approachable Builds on top of standard HTML, CSS and JavaScript with intuitive API and world-class documentation. Performant Truly reactive, compiler-optimized rendering system that rarely requires manual optimization.
💓 Vue.js
P�A�IV � �IV `}��IV @�|�IV ���IV �%��IV �� �IV �7��IV �H�IV ����IV ����IV ����IV �5��IV Р4�IV ����IV p� `$8�IV � ��IV �� �IV � ��IV � ��IV `���IV �C �IV �G��IV ����IV `�A�IV �B��IV � c�IV 0���IV ���IV 0� �IV q|�IV �;��IV e��IV �m��IV P���IV ���IV p;��IV o��IV �8C�IV ����IV �L��IV 0� �Il�IV ^�IV � �IV P� �IV � �IV PQ��IV � �IV ��:�IV ����IV � ��IV ��1�IV ����IV ����IV p�;�IV � ��IV P�|�IV 0i
Reactを使うとなぜjQueryが要らなくなるのか - Qiita
はじめに React（通称 React.js1）を全く知らない、あるいは幾つか記事を見たけどなんなのかピンと来ていない、という人のために書いています。 「jQuery くらいしか知らない」くらいの人に具体的に雰囲気を知ってもらうのが目的であり、すでにやる気がある人向けのチュートリアルではありません。やる気が出れば日本語版ドキュメントを読んで手を動かせばあっという間なので、そこまでの興味が出ることを目標にしています。 以降では ES2015 (ES6) の文法（アロー関数とか）を使っています。この部分が怪しい人は先にアロー関数と const 文だけでも知ってから先に進んでください。 以下の説明中、このアイコンで表すのは（2023 年現在から見た）『昔話』です。新しく自分のコードを書く際には本来知らなくていいことですが、古い記事を見たときに混同しないための参考情報として書いてあります。この記事
旧石器時代のJavaScriptを書いてる各位に告ぐ、現代的なJavaScript超入門 Section1 ～すぐにでも現代っぽく出来るワンポイントまとめ～ - Qiita
はじめに ネットには様々な情報が溢れており、JavaScriptに関する情報も多数存在しております。 その中には、「今時こんな書き方しねえよ…」と思わずツッコミを入れたくなるような、本当に、本当に古い内容について書かれている古文書も存在します。 そんな罠記事の情報に囚われてしまって、いつまで経っても現代的なJavaScriptが書けない皆さんのために、このシリーズの記事では、各セクション毎に分けて、旧石器時代の記述と、現代の記述を紹介する形で、文明開化をしていきたいという思いで記述する。 最初は、現在比較的メジャーなブラウザで一通り動作する「ECMAScript 5」までの内容に関してポエムを書き連ねていき、最終的には一連の内容を読むだけで「ES6(ES2015)」による新機能や、絶賛提案中の「ES7」の一部提案内容についても把握し、おおよそ現代人を育成することを目標とする。 …なんてめっ
msgpack-lite メモリコピーを防いで高速化した話 - Qiita
バイナリ形式の軽量なオブジェクトのシリアライズフォーマットである MessagePack（以下、msgpack）のエンコード・デコードを行う JavaScript ライブラリ msgpack-lite を2015年7月にリリースしました。node.js v0.10 から最新の v5.3、またブラウザも含めて幅広い環境で動作するのが特徴で、fluent-logger ライブラリも、msgpack に替えて msgpack-lite を採用しています。 以下では、msgpack を実装した際に注意したポイントを、２つご紹介します。 C++ よりも高速なピュア JavaScript 実装 本題に入る前に、ベンチマーク結果を更新しておいたので、ここに載せておきます。 最新バージョン msgpack-lite 0.1.14 の node.js v4.2.3 におけるベンチマーク結果です。 msgpa
やはり、お前らのJavaScriptでのリダイレクト実装は間違っている
一見簡単に見えるJavaScriptでのリダイレクト(URL転送)ですが、よく知られた方法にはある落とし穴があり、Googleアナリティクスで正常な解析が行えなくなります。どんな落とし穴があるかと、その回避策について解説します。 なお、こちらの記事は、 SEM Technology - Googleアナリティクスに悪影響を与えずにJavaScriptでリダイレクトする方法 と同じ内容となっています。 はじめに モバイルサイトとPCサイト間のリダイレクトであったり、URL変更に伴うリダイレクトにおいて, .htaccessなどを用いたサーバー側でのリダイレクトが技術上できず、JavaScriptを利用してリダイレクトしているケースをたまに見かけます。 こうしたサイトでは、見た目上は問題なく動作しているものの、実はGoogleアナリティクスなどを用いてアクセス解析を行うと致命的な問題点がみつか
最近の行儀のよい JavaScript の書き方 - Qiita
JavaScriptは移り変わりの早い言語です。 もう1年以上経っていますし、記事のメンテもちゃんとできていないので、消し線を入れることにしました。 参考程度のために記事は一応残しますが、より新しい情報を読まれることをお勧めいたします。 はじめに --- 最近では JavaScript の実行環境はブラウザに限りません。（node.js, Web Workers） また、旧来のような <script> 経由でのロードもとうに古くなっています。今は CommonJS スタイルで、require を用いたモジュールのロードを行なうことがより良いとされています。 ですから、次のようなことは改める必要があります。 - var YourModule = {}; などとして、外部から YourModule.hoge(); などと呼び出す書き方 - this === window だと思うこと 今回は、
IE10 以下を切る場合の JavaScript チェックリスト - Qiita
この投稿は、 JavaScript Advent Calendar 18日目の記事です。 更新履歴 こちら をご覧下さい JavaScript の書き方をアップデートする JavaScript Good Parts で書かれているような JS の書き方は、古くなりつつある部分も多いです。 正直なところ、自分はあの本が「今でも」良書だとは思っていません。 初学者に勧めることもしません。まんべんなさと普遍性と客観性から「パーフェクト JavaScript」 を勧めています。 その頃と比べると、 JavaScript をとりまく環境は変わりました JavaScript の進化に合わせて書き方もアップデートしていくべきなので、今回は分かりやすいしきい値として 「IE10 以下を切れるとしたら」 という前提で、列挙してみます。 たとえば XHR2 や File API に依存したサービスをやる場合な
リアルな DOM はなぜ遅いのか - steps to phantasien
これは VirtualDOM Advent Calendar 2014 に勝手に参加する記事です。 あたたかい春の昼下がりのこと、あるブラウザベンダの社内を不穏な噂が駆け巡った。 「React.js なるライブラリ、どうも仮想 DOM というやつのせいで速いらしいぞ」 もうリアルな DOM はお役御免、ブラウザも商売上がったりか・・・。雇用に不安を覚える人(私)がいる一方、 そのアイデアをとりこんでブラウザの DOM を速く出来ないかと考える人たちもいた。 仮想 DOM はなぜ速いのか。誰かのつてを辿って React.js チームにおいでいただき、速さの秘密をテックトークしてもらう。 イミュータブルなデータ構造による単純化、非同期適用による処理のバッチ化、差分アルゴリズムによる副作用の最小化… いくつかのアイデアはブラウザからはどうにもならないが、たとえば非同期化なんかは形は違えどブラウザ
Adobe製のJavaScriptデバッガTheseusがすごい - Qiita
この前、研究室の先生に教えてもらったAdobe製のJavaScriptデバッガTheseusがかなり便利なのでご紹介します。 Theseusとは Theseusは、AdobeとMITの共同研究から生まれたJavaScriptのデバッガです（→学会論文）。ChromeとNode.jsの上で動きます。具体的に何をしてくれるのかをざっくり言うと、関数のコールを追跡して、BracketsというAdobe製のエディタに下画像のような感じで表示してくれます。 Theseusのすごいところは、コールバックの実行まで追跡してくれることです。もちろん、エラーが起きた箇所もすぐに見ることができます。また、デバッグをするとき、気になる箇所にconsole.logを挟むことがあると思いますが、Theseusを使えばその必要もありません。関数の横に表示されているコール回数をクリックすれば、その関数の実行ログを表示し
JavaScriptで画像の顔認識をする方法【Face Detection】
JavaScriptを使って、写真の顔を認識、抽出して、その範囲を取得する方法を解説。Face Detectionを使います。
PhantomJSとJasmineで振る舞い駆動開発なJavaScriptテスト
PhantomJSとJasmineで振る舞い駆動開発なJavaScriptテスト：フレームワークで実践！ JavaScriptテスト入門（2）（1/3 ページ） しっかりとJavaScriptをテストするために、今注目のJavaScript用のテストフレームワークをいくつか紹介し、その概要から実践的な使い方まで解説する連載 前回は、JavaScriptテストの基本、今回からフレーワムークを紹介 前回の「JavaScriptテストの基礎知識と使えるフレームワーク6選」では、JavaScriptのテストを取り巻く環境や、JavaScriptのテストに使用できるフレームワークの紹介を行いました。今回からは、前回の記事で紹介されたフレームワークを使用して実際にJavaScriptのテスト環境を構築し、テストを行うまでの流れを解説します。 今回は「PhantomJS」と「Jasmine」を取り上げま
エヴァンゲリオンでわかってしまうJavaScript - Qiita
はじめに 全国１億２０００万人のエヴァンゲリオンはわかるけど,JavaScriptはちょっと、、、な皆さんこんにちは。 JavaScriptのプログラミングは、エヴァンゲリオンよりは簡単なのですが、なぜかプログラマにしか浸透しません。 エヴァンゲリオンの諸概念を理解している方であれば、すでにJavaScriptプログラミングは理解していると言っても過言ではありません。 そのあたりをそういうことにして、本編にとりあえず行きましょう。 あわせて読みたい 半年で40kg痩せた！ダイエットでわかるリーンなプロジェクトマネジメント手法 1.地球とミックスイン まずは、エヴァンゲリオンの世界における地球をJavaScriptで表現してみたいと思います。 ここで登場するのはもちろんエヴァンゲリオン世界のトリックスター、ナディアと我らをつなぐものこと「第一始祖民族」ですよね。 彼らは隕石に「白き月」と「黒
知っておくと効率的！コーポレートサイト制作が捗るjQuery プラグインや使い方まとめ
作成：2014/04/7 更新：2014/11/01 Web制作 > あの企業サイトで使われている効果やテクニックをまた探さないといけない、そもそもどういったキーワードで探したらいいのか分からない。そんなこんなで、今回は奇抜なものではなく、「企業サイトで見たことある！」というような、コーポレートサイトに使えそうな定番のプラグインや作り方をまとめました。 エンジニア速報は Twitter の@commteで配信しています。 もくじ スライドショー １．カルーセル（横） ２．フェードアウト ３．画像と文字をスライド ４．文字が遅れて移動する効果 ５．異なるタイミングを設定できる ナビゲーション・メニュー ６．多階層 ドロップダウンメニュー ７．多階層 効果つき ８．スマホではドロップダウン ９．スマホではセレクトメニューに １０．Amazon風 メガドロップダウンメニュー １１．横スライド １
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Online code convert tools and utilities - Beautify Converters beautifyconverter.com
Javascriptを理解したい時にみるとはかどる記事まとめ - Qiita
jQueryは無し、シンプルに必要な機能だけを実装する軽量スクリプトのまとめ
大手Webサービスがクライアント側で発生したJavaScriptのエラーをどう収集しているのか まとめ - Qiita
