Introduction to safe programming with numeric library / 数値ライブラリで始める安全なプログラミング
![babel と webpack について](https://cdn-ak-scissors.b.st-hatena.com/image/square/684162cb71be7814fb7446dd89750b12b3013728/height=288;version=1;width=512/https%3A%2F%2Ffiles.speakerdeck.com%2Fpresentations%2F627b05222823492783642a087ca44a3b%2Fslide_0.jpg%3F9223854)
Introduction to safe programming with numeric library / 数値ライブラリで始める安全なプログラミング
Toyama.rb 第20回目のイベントとして、フロントエンドの入門的な勉強会をやった。 toyamarb.connpass.com 以前から懇親会などで「もくもく会以外でどういうことやりたいです?」と参加者に聞いていたところ、フロントエンドがよくわからん!という意見が多かったので、テーマに据えて勉強会をやってみることにした。 お盆 わりと面白いテーマだったので人数も結構集まるかな〜ワクワク、って思っていたら、お盆ど真ん中に設定してしまったので、普通に少人数だった。 完全に私のミス感はあるけど、人数が少ないぶん、ゆるい雰囲気でできたのでこれはこれでよかったかなって思った。(思いたい) babel & webpack 入門 1つは私自身が話をさせてもらった。 自分自身まだまだ解ってないことが多いな〜と日々感じることが多いけど、良く使う構成であればさくっと構築できるようになってきたので、頑張っ
最近ではコンピューター、ウェブ、モバイルでゲームを楽しめるようになりました。これらのゲームプログラミングについて学びましょう。 ゲームプログラミングの特徴 ゲームプログラミングは比較的新しいジャンルです。 ゲーム開発に使用される言語は、C#、C++、JavaScript、Swift、Rubyです。ゲームでは通常のアプリケーションと異なり複雑なビジュアルを操作するパフォーマンスと速度が要求されますので、プログラム言語もそれに特化している言語がおすすめです。 ゲームプログラミングは今後も人気の職種です。習得してステップアップを目指しましょう。 Oracle PLのプログラミング言語について学びましょう。 Oracle PLの特徴 SQL、T-SQLと同様にOracle PLもデータベースを処理するための言語です。違いとしてはOracle PLは世界最大のデータベースのひとつであるOracleデ
はじめに 仮想DOMのフレームワークが乱立する殺伐としたJS界隈ですが、Riot.jsが神すぎたので少しでも人口が増えればなーと思い書きます。 Riot.js自体の素晴らしさは以下の記事で十二分に伝わると思いますのでこの記事では省略ということで。 Riot.js 2.0 を触ってみた — まだReactで消耗しているの? Riotjsのいいところ また、最後の方に出てくる今回作ったプロジェクトは以下にリポジトリを置いてますので適当にお持ち帰ってくださっても結構です。 gaogao-9/testriot - GitHub 環境説明 今回はタイトルの通り、環境構築の話をメインでしていきます。使用するバージョンは以下のとおりです。 Node.js 6.x npm 3.x gulp 4.x (※執筆時点でβ版です!) babel 6.x Riot 2.x rollup 0.36.x gulp 4.
■ sprockets + rails-assetsを卒業して、npm + webpackへ移行 1年少々前、Webアプリのフロントエンド開発環境として暫定的にRails Assetsを使うことにしたのだけど、あれからjs界隈もしだいに落ち着いてきて*1、いろいろと勝ち組っぽいツールが決まってきた気がする。 そんなわけで、徐々にそっち方向へ移行してこうかな、と。とくにRails Assetsはサービス自体が終了の方向らしいので、まずはそのへんから。jsのパッケージマネージャとタスクランナーの勝ち組として、おれの観測範囲でみえてる感じだと: パッケージはpackage.jsonをnpmで管理するのが一番シンプル タスクランナーもnpmでいいよもう……という流れが強そう AltJSは使わずにES2015、ビルドにはWebpackとBabelの組み合わせ ってところか? 少し前に話題になった「1
ReactとReduxが最近ホットということで、自分も触ってみようと思い、入門・チュートリアルと銘打っているドキュメントを読み漁ってみるものの、とりあえず動くものを作るにあたって何をすればいいのかが良く分からなかった。 いったん簡単なものを一から構築して、それから色々いじってみたほうが理論の理解も進む気がしたので、見よう見まねで公式サンプルにあるようなカウンターっぽいものを作ってみる。 必要なnpmパッケージ(2016/04/16現在) アプリ構築に最低限必要なパッケージはおそらく以下のような感じ。 react用パッケージ react react-dom redux&連携用パッケージ redux react-redux その他、半必須 browserify (import文などを使うため) babelify (babelトランスコンパイル用) babel-preset-react(babe
3行まとめ espower-babelは役目を終えたので、Deprecated Babel + power-assertはbabel-preset-power-assertを使う コード上はrequire("power-assert")とrequire("assert") どちらでもpower-assert化できるようになった espower-babelは非推奨へ Babel + Mocha + power-assertの組み合わせを出来るだけ設定ファイルなどを作らずに使えるespower-babelというモジュールを書いていましたが、役目を終えたので非推奨(deprecated)にしました。 テストコードをES6+power-assertで書けるespower-babel 3.0.0リリース | Web Scratch 理由としては、Babel@6からは設定(ファイル)を必ず必要とするの
こんにちは!ブログチームの id:amagitakayosi です。 今回は、業務で書いた小さなReactコンポーネントをnpmパッケージとして分離した話をします。 今回公開するパッケージ 実装方針 なぜnpmパッケージにするのか 他のコンポーネントの影響で壊れることを防げる アドホックな修正の積み重ねで複雑になることを防げる 本体プロジェクトのコードを削減できる デメリット Babelなパッケージのディレクトリ構成 実装 npmの注意点 reactはpeerDependenciesに入れる npm link を用いてローカル開発する場合、npmはpeerDependenciesを解決できない browserify-shimを利用する場合 npm publish 次回予告 追記 今回公開するパッケージ www.npmjs.com 今回は「無限スクロール」のためのReactコンポーネントを作
Node学園 20時限目に参加したきたのメモ。 「eslintの話」 by @mysticatea スライド: ESLint Past and Future - Google スライド ESLint 12-3% ぐらいのルールを書いた JSHintにプラグイン機能が追加するという話はあったけどならなかった ESLintの特徴 ASTベースでプラグインという特性 (以前書いたプラグインの仕組み: ESLint | JavaScript Plugin Architecture) 開発者が貢献するのが簡単 コントリビューションガイド 開発体制 機能に関しては Reviewer以上 バグに関しては Committer 以上が確認してマージ 隔週の金曜日にリリース ESLint 3.0.0 Stage 4に到達した構文 Auto FixはIDEと連携して選択式の適応へ アグレッシブなFixは同時に適
最低限のコストで最近よく聞くいい感じのjsを書きたい時の構成をずらーっと書いてみる 準備するもの node/npm (最近はrbenvクローンのnodenvがいい感じ、操作は同じ) webpack babel .babelrc .babelrcを設置しとくとbabelのデフォルト設定がこいつの中身で書き換わる Reactを使わないなら、presetのreactはいらない export defaultされたパッケージをimportした時に.defaultで引くのを許せるなら、add-module-exportsはいらない(後述) Reactいる { "presets": [ "es2015", "stage-0", "react" ], "plugins": [ "add-module-exports" ] } いらない { "presets": [ "es2015", "stage-0"
新しいJavaScriptであるECMAScript6(以下ES6)はすでにnode.jsをはじめとする幾つかの環境で使えるようになっています。クラスやimport、Promise、テンプレート文字列など便利な機能がたくさんありますが、なかなか使う機会に恵まれないのではないでしょうか。 そこでよく使われているのはBabelで、ES6で書いたコードを従来のJavaScriptであるECMAScript5(以下ES5)に変換してくれるソフトウェアです。Babelを使うことによって、コーディングは先進的なES6で行いつつ、実際の利用はES5で幅広いブラウザに対応させると言った利用ができます。 今回はその逆で、すでにあるES5のコードをES6に変換してくれるLebabというソフトウェアを紹介します。LebabはBabelを逆から読んだ名前になっています。 Lebabの使い方 Lebabはnpmを使
babel の plugin の中に preset-stage-0, preset-stage-1, preset-stage-2, preset-stage-3 というのがあって「入れとくと未来の機能が使えそう。便利」という感じで使うと死にそうなので、中身が何なのか調べたメモ。 結論としては、preset-stage-n という形で入れるのではなくて、欲しい機能の preset を明示的に指定するのが良さそう。 preset-stage-0 http://babeljs.io/docs/plugins/preset-stage-0 transform-do-expressions http://babeljs.io/docs/plugins/transform-do-expressions 最後に評価された結果の値が返るブロック
The National Football League adopted React in December of 2014. For the past year we have iterated and built on React’s core concepts, various Flux implementations, JSX, Babel, experimental proposals, and functional approaches. You name it and we’ve probably evaluated it and possibly use it in production. Read on for a review of the NFL’s year in React. React Los Angeles Meetup at the NFL Studios
karma + babel + browserify + isparta を使って、es2015 で書いたフロントエンドテストのカバレッジを出す設定JavaScriptTDDkarmacoveragebabel こちらの記事も合わせて参考にしてください。 - karma + babel + istanbul でフロントエンドのカバレッジを出す設定 2016年版 フロントエンドで es2015 かつ browserify でバンドルしつつ書きたいという需要はそこそこ高まっているんじゃないかと思いますが、そのセッティングで開発した場合に、テストカバレッジってどうやって出したらいいの?という情報があまり出回っていない気がしたので、自分なりにミニマルだと思う設定の例をまとめてみました。 なお、この記事では、テストランナーには、karma、バンドラには browserify を使う前提で書いています
monorepo とは 複数の npm package を 単一の git repository で管理すること 例えば Babel では、 100 以上の npm package が単一の git repository で管理されている https://github.com/babel/babel/tree/master/packages package 毎に repository を作る場合と比較した Pros & Cons Babel の repository のドキュメントから抜粋 Pros: lint, build, test, release のプロセスを共通化できる package をまたがった修正が容易になる issue 管理を一元化できる 開発環境の構築が簡単になる テストも package をまたいで実行でき、複数 package が絡む不具合の検知が容易になる Con
普段の仕事はサーバーサイドばっかりだったので、年末年始でフロントエンドの知識をアップデートしたいなぁ、ReactかVue.jsやろうかなぁと思ってました。それで、こちらの記事を読んでると... uehaj.hatenablog.com サーバサイドJavaをずっとやってきて、モダンなJSの知識や経験があまりないけど、最近Reactってのが話題になっているのがさすがに気になるので挑戦したい人 これは!Javaだけってわけじゃないけど、ずっとサーバーサイドってまさに自分のことじゃないか!ということでコードを読んでみることに。 リポジトリをcloneしてreact-appディレクトリを一旦削除して、react-appを自分でつくり直しながら学ぶことにしました。コード読んでみて分からないことが色々あったので、一歩一歩分からないところを潰しながらやっていきました。その時の備忘録です。サーバーサイドは
Ever since the dawn of Node.js, Node developers have complained about Callback Hell. Various solutions have been proposed with various degrees of success. Generators is an exciting prospect because it finally allows us to write async code in a straight-line fashion. Although generators is not yet available on all browsers, you can make it work using the Babel compiler. It is getting more adoption
この記事は JavaScript Advent Calendar 2015 10日目の記事です。 去年は主に gulp にフォーカスした内容でしたが、今回はJSのビルドとテストにフォーカスした入門記事です。 やること ES2015で書いたコードをWebpackでビルドする babel@6系を使う Mocha + power-assert + jsdom でテストを書く やらないこと gulpまわり React.js CSSビルドまわり 最終的なコードはこちらに上げておきました(すごく簡素な出来です)。 GitHub - sskyu/webpack-power-assert-jsdom-skeleton はじめに 今年はReact.jsがJSerの中で定着した感がありました。 Fluxの考え方を昇華させたReduxがFlux系フレームワークでデファクトになりそうな雰囲気を出しつつ、React
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く