React + Reduxを使ったWebアプリケーション開発速習会＠Wantedly - Qiita
React + Reduxを使ったWebアプリケーション開発速習会＠Wantedly のための資料です。 WantedlyではSingle Page Applicationなどより複雑な構成にも耐えられるよう、React + Reduxを中心としたWebフロントエンドの技術スタックを導入しました。 ES2015 React Redux Immutable.js CSS Modules webpack 導入の経緯などは以前発表した の資料を参照ください! WantedlyにReact + Reduxを導入した話 今回はこれらのスタックを使って実際にSingle Page Application構成のアプリケーションをハンズオンで作成します。 開発の準備 開発環境 npmライブラリを使用するため、開発マシンにnode.jsがインストール済みであることを前提としています。 サンプルはv5.1.1
RSpec で Kernel.open をスタブする - Qiita
class HidamariController < ApplicationController # POST /hidamari/sketch def sketch ### 略 ### open('http://www.tbs.co.jp/anime/hidamari/') ### 略 ### end end 上記のように open-uri の Kernel.open を使用しているコードがあります。 その単体テストで open が呼ばれることを確認したいです。 うーん、Kernel.open をスタブする方法がぱっと思い浮かばなかったので色々試してみました。 # NG expect(Kernel).to receive(:open).with('http://www.tbs.co.jp/anime/hidamari/') # OK expect_any_instance_of(Kern
video.js で m3u8 形式の動画ファイルをブラウザで再生する
video.jsを使ってm3u8形式の動画ファイルをSafari以外のブラウザでも再生する方法を紹介します。デモページは下のボタンから。 Demo 動作環境下記環境で（現時点の最新版での）動作を確認しています。 ChromeSafariOperaSafari※要Flash 使うJSライブラリvideojs/video.js 基本素材。動画ファイルを様々なブラウザで再生できるようにする。videojs/videojs-contrib-media-sources videoタグに動画ソースを流し込めるようにするvideo.jsプラグイン。W3Cのドラフト仕様Media Source Extensionsが元のよう。videojs/videojs-contrib-hls HLS(m3u8)形式の動画ファイルを再生可能にするvideo.jsプラグイン。HLSに対応していないブラウザでもFlash技
HTML5のvideoタグで利用するmp4の動画を作る時のTips - Qiita
最近、スマホやタブレットを使う機会も多いですが、その辺りの端末に動画コンテンツを提供する時に楽なのがmp4形式の動画をvideoタグで貼り付ける事です。 ただ、ちょっとした注意点があって、どういう状況で再生するかによって細かい調整をしておかないと、再生開始までにえらく時間がかかるようになって、非常に不便になります。 既に作成済みの動画を再生する場合 mp4形式の動画を再生するためにはメタデータ情報が必要です。メタデータは通常ファイルの末尾に付与されます。ファイルサイズが小さい時は気付かないのですが、10分、20分ぐらいあるような動画を再生しようとすると末尾まで読んでから再生できるかどうかを判別するので、再生が開始できるようになるまでに異様に時間がかかるようになります。 そこで動画作成時にメタデータをファイルの先頭に移動させておきます。 こうする事で、ファイルサイズが大きい動画でも一瞬で再生
PC・スマホ両対応の動画配信サーバーメモ - Qiita
掲題のシステムを構築する仕事があったので、備忘録がわりに。 動画ファイルの形式について mp4を使うとPC・スマホとも簡単に配信できる感じ。 細かい制御をしたい場合は、PC向けにはRTMPを使ったflv配信、スマホ向けにはHLSによる配信が良さそう。 flv Flash Video。iPhoneやAndroidの場合、標準では再生できない場合が多い（アプリを導入すれば再生できる）。 mp4 PCブラウザ・スマホ両方で再生できる（Firefoxはバージョン21.0から対応）。 m3u8 HTTP Live Streaming(HLS)形式。PCブラウザではSafariを除いて基本的に未対応。 ストリーミングサーバーについて Adobe Flash Media Server (FMS) flv, HLSなどの配信ができる。115,500円。YouTubeやmixiなどで採用されているらしい。
AWS S3 + CloudFront で動画ストリーム - Qiita
準備 AWSのアカウント 動画ファイル S3のバケット バケットの作成 今回は、"c2-video-test"というバケットを新規に作成。Tokyoリージョンとした。 Static Website Hostingの設定 Enable website hosting に変更 Index Document の設定が必要だったので、"index.html"と入力 Endpointは以下のとおり Endpoint: c2-video-test.s3-website-ap-northeast-1.amazonaws.com Permissionの設定 Add bucket Policyをクリックし、 { "Version":"2012-10-17", "Statement":[{ "Sid":"AddPerm", "Effect":"Allow", "Principal": "*", "Action
HLSとは - Qiita
概要 HLSとはHTTP Live Streamingの略 アップルが自社iOS向けに開発した、HTTPベースのストリーミングプロトコル。 特徴 ・特別な設備（ストリーミングサーバなど）が不要でApacheなどのWebサーバでも配信できるのが特徴。 ・通信速度に応じて映像品質（ビットレートや画面サイズ）を変えるAdaptive bitrate streaming機能を持っている ・（デメリット）再生環境が限定されている（Windows微妙） 動作環境 ・iOS3.0以上 ・Android3.0以上 ・WindowsはVLC1.2以上、QuickTime10以上 ・MacOS X10.6以降のSafariブラウザ 技術詳細 ・基本は地デジと同じMPEG2 TSが使われる ・１０秒に細切れにされたMPEG2-TSファイルを複数の品質作る ・その再生順を書いたプレイリスト（M3U3形式）を作る
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
