Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

前回→今からはじめるReact.js〜仮想環境を作成する〜 React.jsからサーバー通信 SuperAgant React.jsでAjax通信する場合、jQueryを利用するか、その他の手段を使うか検討すると思いますが、Ajax通信するためだけにjQueryを使うのは無駄が多いので、SuperAgantを利用することにします。 SuperAgantの使い方については、 http://qiita.com/hashrock/items/3113690bb3de5bba639b の解説がわかりやすかったです。 インストールは次の通りです。 $ npm install superagent --save テーブルを作成する 今回、ユーザーを登録できるのと、ユーザーリストを表示できるように実装します。 サーバー通信の実装を行う前に、ユーザーテーブルを作成します。 カラムはnameとmailだけの
注意 YouTube APIの公式ドキュメントに載っていない設定値を利用します。 いつ使えなくなるかわかりません。 tl;dr http://video.google.com/timedtext?type=list&v={videoId} で字幕リスト取得 http://video.google.com/timedtext?lang={lang}&name={name}&v={videoId} で字幕情報取得 YouTube APIにプログレスイベントがないので requestAnimationFrame と player.getCurrentTime()で時間を取得 2と3で字幕を表示 APIのonApiChangeイベント検知後に player.setOption('captions', 'displaySettings', {option})で既存の字幕を非表示に 最低でも2つXML
watchを使ってReactとES6の変更を監視 + 自動ビルドするの続きです。 前回は、 watchでディレクトリの変更を監視し、変更を検知したらシェルスクリプトを実行し、トランスパイルと依存関係の解決を自動で行う というところをやりました。 今回は、本エントリーの目標である「書籍についてのメモや評価を記録できるアプリケーション」というところに着手していきます。まず、現在実装している「books/index」のページに表テーブルを作成します。 「Reactビギナーズガイド」では、データとなる部分を配列として定義→ローカルストレージを使って実装といったステップを踏んで表テーブルを実装しています。本エントリーでは、Railsと連携させているということで、データとなる部分を配列として定義→RailsでAPIを作成し、React側からgetするという流れで実装していきたいと思います。 1. 表テ
当社でもSlackを初めてもうすぐ2年になります。全履歴を取得して、何かできないかなと思ったので、調べてスクリプトを書いたので公開します。 Slackで使用するAPI 以下です。 https://api.slack.com/methods/search.messages このAPIを使用するにはTokenが必要なので、それは自分のSlackを使って発行しておいてください。おそらく以下から発行できます。(他人に見られないように) https://api.slack.com/custom-integrations/legacy-tokens 使用したスクリプト もちろん、最近習得カーブが急上昇しているJavaScriptです。 外部APIにアクセスするので、superagentを使用します。 もしかするとたくさんのAPIをコールする可能性もあるのでpromise使っています。 Promiseは
var React = require('react/addons'); var UploadFileActionCreator = require('../actions/upload_file_action_creator'); var FileUploader = React.createClass({ getInitialState: function() { return { dragging: false }; }, uploadFiles: function(files) { var formData = new FormData(); for (var i = 0, f; f = files[i]; ++i) { formData.append('file', f); UploadFileActionCreator.upload(formData); } }, handle
#脱jQuery AngularJSやVue.jsでは、DOMの直接操作は推奨されません。 そうなると、jQueryはAJAXでしか使わなくなります。 であれば、AJAX専用のライブラリにまかせてしまって、jQuery依存を外したくなってきます。 というわけで、AJAXだけをやってくれるライブラリとして、SuperAgentを導入してみましょう。 #SuperAgent HTTPリクエストに特化したライブラリです。 Node.jsとブラウザ両方で使うことができます。 作者はExpress, Stylusの開発などで有名なTJです。 #superagentの良さ かわいい。 #ブラウザでの導入方法 まず、下記URLにアクセスし、ファイル名superagent.jsとして名前をつけて保存してください。 https://wzrd.in/standalone/superagent@latest s
今回、ゲーム攻略コミュニティ『GAMY』というサービスでRiot.jsを採用しました。 知る限りでRiot.jsで実装されたサイトの中でも最大規模のサービスだと思います。 これまではjQueryとjQueryプラグインを使っていましたが、デザインのリニューアルを機に、全部書き換えることにしました。 ドキュメントも兼ねてアウトプットしていきます。 Riot.jsとは Riot.jsは今流行りのReact.jsに似た仕組みを持っている、それで非常に軽量なJavaScriptライブラリーです。 最近GitHubのリポジトリが**/muut/riotjsから/riot/riot**にお引っ越しして、これからがより注目なライブラリーです。 詳しくはこちら↓ Riot公式 Riot.js 2.0 情報まとめ GitHub 捨てることを前提としたライブラリー選定 最初は今ブームの2大フレームワークとなっ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く