Kubernetesの「ブランチデプロイ」で誰もがハッピーなDev環境を作る - HRBrain Blog
こんにちは。HRBrainでインフラエンジニアをしている間野(@mano_0307)です。 今年の5月にインフラエンジニアとして入社しました。Kubernetesを使っている弊社で、Kubernetesをまったく触ったことのない私のような人間がインフラエンジニアになれるというのが弊社の素晴らしいところです。合言葉は「トライドリブン」。日々トライができる素晴らしい環境です。 Dev環境という各社共通の悩み 多くの会社で何かと困っているのがdev環境なのではないかと思います。 dev環境今日も空いてないよ・・・フルリモートでどうせバレないし、寝ちゃお あれ？久々に使ったdev5環境がうまく動かないよ。・・・(数時間後)あー、最新のmasterがrebaseされてないからAPIのinterface変わってんじゃん！うわー寝よ・・・ そろそろdev環境増やしたいな・・・でも、あの設定も複製しなきゃ
クライアントサイドのモデルとは何か 後編 ~ 単方向データフローと参照透過性 - mizchi's blog
この記事は クライアントサイドのモデルとは何か 前編 ~ クライアントサイド MVC の死 - mizchi's blog の後編。 前提として、今回の出す例で、「Web フロントエンドで、そこまで複雑な状態を考慮するなんてそもそも間違ってる」という意見があると思う。これに関して、そもそも「SPA というものが、いかに実現可能になったか」という視点の話であり、また、自分の経験上「フロントエンドなんて雑でシンプルでいいでしょ」というものが、複雑な構成を取っていくのを、何度も目にしてきた、という2つの前提がある。 適切な粒度に応じた適切な構成をとるべし、というのは別の話で、今回、対象が複雑なアプリケーションなのは前提とする。 Flux 以前 先の記事で ActiveRecord を前提にしたサーバーサイド ORM をクライアントで輸入しようとすると、クライアントでは Storage 層が存在し
クライアントサイドのモデルとは何か 前編 ~ クライアントサイド MVC の死 - mizchi's blog
前置き この記事、本来は Flux には Model がないのではないかと思った覚書 - ナカザンドットネット と Flux の Store が ViewModel かって話からの MVW とかどうでもいいって話 - 猫型の蓄音機は 1 分間に 45 回にゃあと鳴く のアンサーとして書き始めた記事だが、前置きだけで別テーマとなったので、前後編に分割する。 僕は元々がゲームクライアント屋だったときの発想を引きずってるのと、既存の Web の開発の文脈に対して距離を置いていることを明言しておく。あとこういうテーマでとある原稿書いていたので、頭の整理も兼ねて。 ActiveRecord の功罪を振り返る このテーマを語るにあたって、まず Rails の MVC について述べなければならない。なぜなら、フロントエンドのアーキテクチャとは、サーバーサイドの MVC の模倣に始まり、破綻し、結果として
MVC→MVP→MVVM→Fluxの実装の違いを比較してみる
iOSDC 2017 9/17 13:50 TrackB https://iosdc.jp/2017/node/1396 iOSDesignPatternSamples https://github.com/marty-suzuki/iOSDesignPatternSamples FluxCapacitory https://github.com/marty-suzuki/FluxCapacitor Flux & MVVM (Brooklyn Swift Developers) https://speakerdeck.com/martysuzuki/flux-and-mvvm-brooklyn-swift-developers 補足資料 【iOSDC2017】MVC→MVP→MVVM→Fluxの実装の違いを比較してみる https://qiita.com/marty-suzuki/item
Vue.jsとvuex、Fluxについて - 猫型の蓄音機は 1 分間に 45 回にゃあと鳴く
最近立て続けにそのあたりの話をする機会があったので。わたしの意見です。 vuexというかFluxに手を出すタイミング Vue.jsを利用していて、相互に関連のある二つ以上の状態を扱う必要が出てきたら、それはもうすでに「十分に複雑な状態管理」である たとえば、APIとの通信中はインジケータを出したいので「通信中かどうか」を管理し、通信が終わったらその結果を表示するために「通信結果」も管理したい、など。 十分に複雑な状態管理に立ち向かうためには、自分でピュアなDomain側をきちんと作ってそこで状態管理するか、vuex利用するべきだと思う 自分で設計からやるにしても、まっとうにMVVMをやれば単方向データフローは守れるので、Fluxの考え方とMVVMは矛盾しない see http://techblog.reraku.co.jp/entry/2016/12/13/080000 vuexを触ってみ
vuex と vue-router の共存について - Qiita
初学者ゆえなのか、vuex と vue-router を共存させる記述が分からなくて半日費やしてしまったので備忘録。 サンプル 検索していたら見つけたIssueに、色々アドバイスが書いてあった。 https://github.com/vuejs/vuex/issues/11 ここの内容を基にサンプルを作成してみた。ルーティングは route-config.js として別ファイルに定義するようにしてみた。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>SAMPLE APP</title> </head> <body> <div id="app"></div> </body> </html> import Vue from 'vue' import VueRouter from 'vue-router' import A
どうしてWaltsを開発したのか - そして昨今のFlux - Qiita
まずFluxとはなんだろうか。Fluxの解説はすでに多数掲載されているが、ここでは「データフローを一方向としたアーキテクチャ」と定義したい。 そもそも、FluxというのはObserverパターンにちょっとした規則を設けて、かっこいい名前を与えたに過ぎないのだが、現代のフロントエンドはこのFluxを見事に受け容れた。なぜか。それは開発者が秩序を求めたからである。 これは、拡大し続けるフロントエンド・サイドの開発規模に対して、従来のMVC、正確には複数のViewと複数のControllerが相互にデータを受け渡し合うアーキテクチャがスケールしなくなったことに起因する。（ここではMVCを厳密に定義していない。GUIアーキテクチャについてなのかバックエンド・アーキテクチャについてなのか判然とさせないまま、俗語的に用いている） シングルトンという名でごまかした巨大なグローバル神オブジェクトを至る所で
複雑なJavaScriptアプリケーションを考えながら作る話
autoscale: true theme: Plain Jane,5 複雑なJavaScriptアプリケーションを考えながら作る話 自己紹介 Name : azu Twitter : @azu_re Website: Web scratch, JSer.info #jsprimerを書いています JavaScript入門書に興味ある人はウォッチ :star: :warning: 注意 :warning: 作成するアプリケーションによって必要な構造は異なります 今回の話はある程度の規模で複雑性を持つクライアントサイド ライブラリ抜きで数万LOC >= 長期的にメンテンナンスや変更が発生するアプリケーション サーバサイドレンダリングはしないクライアントアプリケーション 3行でOK 複雑なJavaScriptアプリケーションを作るにあたりドメインモデルをどう実装するか悩んだ 色々と試行錯誤した
Redux入門【ダイジェスト版】10分で理解するReduxの基礎 - Qiita
ReduxのGithubドキュメントを基に入門用記事として書いたものを、簡潔にまとめました。 もと記事はこちらです。 Redux入門 1日目 Reduxとは Redux入門 2日目 Reduxの基本・Actions Redux入門 3日目 Reduxの基本・Reducers Redux入門 4日目 Reduxの基本・Stores Redux入門 5日目 Reduxの基本・Data Flow Redux入門 6日目 ReduxとReactの連携 Reduxとは Reduxは、ReactJSが扱うUIのstate(状態)を管理をするためのフレームワークです。Reactではstateの管理するデータフローにFluxを提案していますが、ReduxはFluxの概念を拡張してより扱いやすく設計されています。 Reduxはstateを管理するためのライブラリーなので、React以外にもAngularJS
React使い必見！ Immutable.jsでReactはもっと良くなる | Wantedly Engineer Blog
Reactを導入して半年近くが経ちましたWantedlyでは、今年の初めからReact(+Redux)の導入に取り組み始めたので、気付けば半年近く立っていることになります。今自分がこの記事を書いているエディタから、Wantedly Adminのチケット画面まで、ある程度大きなアプリケーションを開発してきました。 そこで今回は、チームで継続的に開発していく過程で遭遇した問題と、それを解決するために導入したImmutable.jsについて紹介します。 増え続けるCallbackとAction、肥大化するStoreReactとセットで語られることが多いFluxアーキテクチャ。ここでは詳しい説明は省略しますが、とてもシンプルな考え方なので、チュートリアルなどで簡単に学ぶことができます。しかし、実際にチームで開発していくと、たしかに動いてはいるけど、綺麗とは言い難いコードが増えてしまいました。 Ac
10年のツケを支払ったフロント界隈におけるJavaScript開発環境（2016年4月現在）。 - 日々、とんは語る。
2015年はCSSが普及した以来となる10年に1度のフロントエンド大変革期で、それまでのツケが一気に回ってきたと個人的に感じていました。目まぐるしく状況が変化していきましたが、2016年になり、個人的にだいぶ落ち着いてきたと感じているので、ここらへんでまとめておきたい思います。 最初に結論を書いておくと、 『React + Redux + react-router + material-ui + axios + ES2015 + Babel + webpack + ESLint + Airbnb JavaScript Style Guide』 という組み合わせが、いま僕の採用しているJavaScriptの環境です。 主要ライブラリは React A JavaScript library for building user interfaces | React 去年、一気に普及したReact
React.js + Flux入門 #scripty02
2014/12/15の勉強会にて発表された資料です。 SCRIPTY#2 ～フロントエンド紳士・淑女のための勉強会～ http://scripty.connpass.com/event/10345/Read less
Vue.jsにreduxを載せた話｜デロイト トーマツ ウェブサービス株式会社（DWS）公式ブログ
概要 先日とある案件でVue.jsを用いたアプリケーションを開発することとなりました。 一般に同種のフレームワークと比較してVue.jsは、学習コストが低く気軽にはじめやすいということがメリットとして語られています。 ただ、今回の案件のようにMVC系フレームワークを用いて開発する際にネックとなっていたのが、コンポーネント間のデータ共有についての最適解が見つけられていないと感じていたことでした。 もちろん、適切にモデルを設計すればコンポーネント間のやり取りに責任を持つ、親コンポーネントとでもいうべき層を実装することでこの問題は解決できると思います。 しかし実案件では往々にして親コンポーネント層の実装が個々人の裁量に陥りやすく、結果的にコンポーネント間データ共有の方式が統一出来ていないケースも出てきてしまいました。 コンポーネント間で共有したいデータ=アプリケーションの本質となるデータは、もっ
Fluxフレームワーク戦争の現状確認（前編） - マルシテイア
この記事は 仮想DOM/Flux Advent Calendar 2015 2日目の記事です。 みなさんFlux書いてますか？ 僕はオレオレ実装を書き続けて消耗してます。 Fluxフレームワーク使いたいけど使いたくない……！！ いったい今Fluxフレームワークって幾つ生き残ってるの……戦争は終わったの？ っていうか最近新フレームワークの噂聞かないけど、まだFluxって流行ってるの？ 今日はその辺をまとめてみたいと思います。 もくじ 前提知識 Flux以前 2014年5月 Flux登場 〜2015年前半 戦国時代 Fluxxor Fluxible Alt NuclearJS 振り返り 2015/5月 Reduxの登場 前半まとめ 前提知識 Fluxってなに？という方はこちらの資料をみると良いでしょう。 非常に丁寧にまとめられています。 speakerdeck.com なお、以下ではアーキテク
Reactのチュートリアルをやってみた - diary
完全に自分用メモ。 Thinking in Reactというチュートリアルを最小webpack構成で試した: ishikuro/thinking-in-react-webpack-minimum · GitHub React + Fluxの自分メモ Webフロントエンドのプログラミングは、jQueryによる素朴なDOM操作から、AngularJSのような双方向バインディングへ移行してきた。しかしWebがコンポーネント指向に進むに従って、状態の管理が分散しがちであることが問題であった。 そこでFacebookが新世代のパラダイムを提案している。コンポーネント指向、仮想DOM、単方向バインディングなViewライブラリのReactを開発し、Fluxという単方向データフローのアーキテクチャを推奨した。 Fluxはアーキテクチャの名前であり、実装に規定はない。従ってgithubでもFluxアーキテク
人気のFluxフレームワークReduxをさわってみた - マルシテイア
fluxフレームワーク、今は Redux が一番アツい様子なので触ってみた。 github.com (追記 2015-10-03 18:15 APIや用語が大幅に変わったので更新した) Redux の経緯 2015-05-30 に公開された "The Evolution of Flux Framework" という記事がある。 medium.com Reduxはその PoC 的な実装だったんだけど、実用的ということでめっちゃ流行っているみたい。 Initial commit も 2015-05-30 だった。 Initial commit · rackt/redux@8bc1465 · GitHub 最近の flux フレームワークだと fluxible と flummox が人気だったけど、 flummoxのページには 4.0 will likely be the last major
ES7 Decoratorでresizeイベントをいい感じに処理してくれるパッケージ作ったよ - Qiita
今、React・Fluxで作っているツールで、window.onresize時にwindow.innerHeightをdivのheightとして設定するようなComponentを作った。 こういう感じ： class Example extends React.Component { constructor (props) { super(props); this._onWindowResize = this.onWindowResize.bind(this) this.setState({ height: 0, width: 0 }) } render () { let {width, height} = this.state; return <div {...this.props} style={{ width, height }} />; } onWindowResize () { t
最近のReactへの言及についての違和感 - mizchi's blog
「最近のReactへの言及についての違和感」というエントリ書いたら燃えますかね— イカid:mizchi0x (@mizchi) 2015, 6月 7 僕がみた資料の中でFluxの設計について正しい理解をしていると思えるのはげたさんのこの資料だけです https://t.co/XaKHhhuP2A— イカid:mizchi0x (@mizchi) 2015, 6月 7 みんなsetStateに騙されてる— イカid:mizchi0x (@mizchi) 2015, 6月 7 一部で「React使うとコード量が増える」という意見、サーバサイドで書いたテンプレートのレタッチをするjQueryと比べたらそりゃそうなんだけど、SPAでそもそもJS側がテンプレート握るような環境では handlebars とかで書いてたところが JSXになるだけでそれ移行コスト— イカid:mizchi0x (@mi
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Vue.jsで実現するMVVMパターン Fluxアーキテクチャとの距離
Rails + React + FluxxorでFluxxorチュートリアル - Qiita
