Practice of build and CI/CD at tapple/practice_of_build_at_tapple
3ヶ月で Serverless Framework を導入し、SPA ( Riot.js + RiotControl で Flux 実装 ) をリリースした話JavaScriptNode.jsAWSriotserverless ※ このお話は ( おそらく ) フィクションです。実在の人物や団体とは関係ありません。 前書き 中規模程度のサービスを Serverless 構成の SPA をパイロットリリースしました。具体的なサービス名等は紹介できません ( おそらくフィクションなので ) が、筆者が3ヶ月間でやってきたことを殴り書きして行きます。 基本的にはリリースまでに必要となった材料 ( 参考にしたドキュメントやサイト ) を重点的に紹介していくだけですが、同じような境遇の方々の手助けになれば幸いです。 筆者のプロジェクトイン時スペック 社歴3年程度 主にバックエンド・インフラを担当して
2015/05/27にLINE社で行われた、Data Binding JS Nightでの発表内容です。Read less
React と Flux を用いてアプリケーションを構築します。 これを採用した点は、 はじめに書いた通り、 React を選択しながら アプリケーションを書くには Flux のフローを導入するのが今のところよいとされると思ったからです。 React は View を提供してくれますが、それだけだと データのやりとり等を含めた、アプリケーションは構築しにくいです。 といっても、今回私の作成した例では、React 単体でも構築可能です。 Flux における アプリケーションフロー Flux では有名な図。一方通行なデータフローが素敵ってよく言われる。 React が提供してくれるのは 図の React Views Flux が提供してくれるのは 図の Dispacher そして、他の部分は自分で作成していくことになります。 フォルダ構成 先に述べた通り、Flux はデータのやりとりを示してく
10分で実装するFlux 自己紹介 azu @azu_re Web scratch, JSer.info Flux /flˈʌks/ Fluxとは Facebookが提唱したSmalltalk MVCの焼き直し CQRS(Command Query Responsibility Segregation)と類似 データが一方通行へ流れるようにするアーキテクチャ ウェブUIについてそれを適応する 今日の目的 小さなFluxの実装を作りながらFluxついて学ぶ Fluxの特徴: Unidirectional data flow 本当にデータが一方通行に流れるのかを確認する Fluxでよく見る図 登場人物 何か色々いる Action Creators, Dispatcher, Store, React Views... Dispatcher = EventEmitterと今回は考える もっと実装的
要約 : 私たちは、React.js と Flux、それに他のいくつかのライブラリを用いて HipChat の Web クライアントを根本的に再構築し、素晴らしい結果を得ました! 是非試してみませんか? HipChat がアトラシアンに加わったときのクライアントは、Web、Adobe Air (Windows、OS X、Linux)、iOS、そして Android アプリの 4 つでした。HipChat チームが最初に掲げた目標のひとつが、Air クライアントを OS X、Windows、Linux のネイティブデスクトップクライアントに置き換えることでした。私たちは (その当時は) 小さいチームだったためしばらくはこの仕事で手一杯でした。このように最高のアプリケーションを提供することに集中した影響で、Web クライアントに対しては私たちが行った様々な開発の成果を反映させることができません
React.js + Webpack + ContainerJS でTODOリストを作ってみたので、手順をまとめます。 以前書いた、Knockout + ContainerJS でテスタブルにToDoリストを作るチュートリアル - うなの日記の改訂版。 最近流行ってるライブラリのお試しも兼ねて、いろいろ組み合わせて使ってみようという試みです。 ソース全体はこちらで公開しているので、あわせて参照ください。 ポイント モジュールローダーを require.js → Webpack に ソースはクラス単位で分割管理して、Webpackで1ファイルにまとめてリリースします。 WebpackだとAMDもCommonJSも両方扱えるので、npmのライブラリが使いやすくなるのは大きいかな。 あと、Loaderも便利ですね。 Viewモジュールを Knockout.js → React.js に 流行って
今話題のReact.jsはどのようなWebアプリケーションに適しているか? Introduction To React─ Frontrend Conference 外村 和仁(株式会社 ピクセルグリッド) 本記事は、2015/2/21に行われたFrontrend Conferenceの「Introduction To React」の内容を紹介します。 当日の資料は以下にアップされていますので、こちらも参照してください。 Introduction To React // Speaker Deck React.jsとは何か React.jsはFacebook製のJavaScriptライブラリです。 http://facebook.github.io/react/ 公式サイトに、「A JavaScript library for building user interfaces」とあるように、R
歌舞伎座.tech#6「VirtualDOMとReact」 - connpass に参加して来たのでメモ。 すべてのCSSに死を!これはJSerの叫び!- @kyo_ago スライド: CSSに死を!これはJSerの叫び! #kbkz_tech CSSが辛い CSSはカプセル化とか継承とか、プログラムからの概念がそのまま持ってこれない ReactStyle js-next/react-style JS内にStyleを埋め込むことができる そのままオブジェクト的に入れられる Template Stringsと合わせればその場でCSSを入れることができる styles=にスタイルを入れる セレクタをあまり考えなくていい style属性でスタイリングする 擬似要素、擬似クラスが全滅 :hover :active などが使えない。 CSSの継承などの概念が消える 自分で頑張る必要がある ユーザプレ
追記: 情報が色々と古くなったため、2020年に書き直した版へのリンクを張っておきます。 この記事は VirtualDOM Advent Calendar 2014 - Qiita の初日です。 初日ということで、基調講演風に、Virtual DOMとはなにか、なぜ僕はこんな興奮しているのか!という話から。 Virtual DOMとはなにか 既存の概念で当てはめると、JavaScriptのMVC, MVW(Whatever)フレームワークのViewに位置します。が、その程度では終わりません。仮想DOMとは世界を革命する力であり、このjQueryのDOM操作で汚れきったフロントエンドを救う救世主なのです。 現時点で自分が知っている限りは、以下の実装を指します。 facebook/react 最も使われてるFacebookの実装 Matt-Esch/virtual-dom Altenative
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く