(2016/05/23 追記) 記事内で取り扱っている技術で、はてぶコメント等で質問の多かった「webpack」についての解説記事を書きました。 最新版で学ぶwebpack入門 – JS開発のモジュールバンドラ - ICS MEDIA Web技術はよく技術の進化が早いと言われます。多くの技術が現れては消える中で、どの技術を学ぶべきかを選択するのは重要です。選択するポイントの1つに「技術の将来性・人気があるかどうか？」があります。今回は基本的なフロントエンド技術である「CSSコーディング」「JavaScriptプログラミング」「タスクランナーとビルドツール」の3つについて、それぞれの人気をGoogleトレンドで調べてみました。 CSSコーディングの流行り CSSは、SassやLESSに代表される「CSSプリプロセッサー」を使ってプログラミングすることで、品質と効率を大きく向上させることが可能

古くて新しいリアクティブプログラミングのすすめ-Frontrend Conference 佐藤歩（株式会社サイバーエージェント） 本記事では、2015/2/21に行われた「Frontrend Conference」のJSトラックセッション「Reactive Programming in JavaScript」から抜粋した内容を紹介します。 「リアクティブプログラミング」（以下、RP）という言葉を、みなさんはご存じでしょうか。RPは、オブジェクト指向プログラミングや関数型プログラミングと同様に、プログラミングパラダイムのひとつです。このRPというパラダイムを、近年のWebフロントエンドの風潮になぞらえて見ていきます。 リアクティブプログラミングという考え方 RPは「イベントや変化する値の関係性」に注目し、これを簡潔に記述することで相互作用を上手に扱おうとするプログラミングパラダイムです。 こ

Angular2は「モダンJavaScriptの学習セット」！エキスパートによるディスカッションが熱かった（詳細な注釈付き！） 白石 俊平（HTML5 Experts.jp編集長） こんにちは、編集長の白石です。 去る3月9日、AngularJSのエキスパートによる座談会におじゃまさせていただきました。この座談会はAngularJS Japan User Groupの佐川 夫美雄さんの呼びかけによるもので、お題はもちろん、現在β版として公開中のAngular2。「ハードル高い」「Angular1と違いすぎる」など、いろんな情報も飛び交う中で、Angular2の魅力と課題について存分に語っていただきました。 Angular2に関心のある方にはもちろんのこと、Angular1しか触ったことのない方、そもそもAngularJSは初めてという方にとっても貴重なご意見が満載！エキスパート同士の会話と

以前から熊本でJavaの勉強会に参加していたが、今回はSpring Bootのハンズオンをしてくださった。どちらかと言うと自分がAngularをやっていて、そのRESTなサーバをJavaで作りたいが最近のJavaはよくわからんということでやって頂いた、感謝。 kumamotojava.doorkeeper.jp やったこと githubに書かれているチュートリアルを解説付きでコーディングした。IDEはNetBeensで、テキストはこちら： github.com mavenのインストールからプロジェクトの作成 Thymeleafの追加 JPAの追加 htmlでの表示 RESTでのAPIアクセス JDBCでのDBアクセス デプロイ実行 全体的にSpring Bootの初心者ハンズオンはできた 感想 やっぱり最近のJava(というかSpring)はアノテーションベースだなと。最近と書いたがだいぶ

株式会社はてなに入社しました 株式会社はてなに入社しました - hitode909の日記

株式会社はてなに入社する お知らせ 4月1日はエイプリルフールです 4月1日以外の入社はこちら 株式会社はてなに入社する

This is an event to watch a live stream of ng-conf ! This event is on the ng-conf extended program. ng-conf extended Tokyo は英語が苦手な方でも参加できます。 通訳はいませんが、他の参加者が内容を教えてくれます。 Schedule All time are in JST(GMT+9) May 5 0:00 (May 4 24:00): ng-conf Day 1 21:00 PM Free time 0:10 AM Keynote 1:00 AM - 3:30 AM Sessions 3:30 AM - 5:00 AM Break time 5:00 AM - 9:00 AM Sessions May 7 0:00 (May 6 24:00): ng-conf Day

Angular2の失敗しない始め方〜「ng-japan 2016」セッションレポート〜 仲 裕介（HTML5 Experts.jp副編集長） この記事は、「ng-japan 2016」のセッションレポートです。講演内容を再現していますが、ニュアンス等伝えきれない場合があるので、気になるところは、記事末尾に掲載の講演資料やYoutube動画でご確認ください。 Angular2の失敗しない始め方 / 稲富駿氏 株式会社トップゲートの稲富 駿氏によるセッションです。セッション資料や配信動画は記事末尾でご確認ください。このセッションでは、大きく3つの点について触れられました。それぞれのポイントを書き起こします。 Angular2に関するよくある質問や誤解について Angular2を構成する基礎技術について Angular2を学ぶために必要なこと 1. Angular2に関するよくある質問や誤解につ

こんにちは、トレタでウェブフロントエンド開発をしている@teyoshです。 3/21に開催されたng-japan 2016にトレタはスポンサーとして参加させていただきました。 2015年に続き、2度目のカンファレンス開催です。 AngularJSも公開されてから4年以上経ち今年はAngular2がリリースされる予定です。 当日は200名を超す参加者の登録や合計5時間にも及ぶ12本もの発表がありました。 発表はAngular2がまだベータであるというのにも関わらず、5本もありサテライト会場も埋まるほどの熱量の多い発表になりました。 AngularJSはAngular2に置き換わっていくことは確定しているものの利用者は多数おり、まだまだ開発は進んでいくため、学びは多いと感じました。 Angularに関しては古い情報などで誤解していることも多かったり、Angular2に関する懸念事項や疑問も多数

このポストは以下の記事を意訳したものです。 I’ve Just Liberated My Modules - Medium.com Twitterでフロント系のエンジニアの方がざわついていたので訳しました。間違いが有りましたら、ご指摘いただけると幸いです。 以下、意訳。 数週間前、特許弁護士が私にメールをよこしました。メールの内容によると、私の作成した"kik"パッケージをnpmから削除せよ、とのことでした。返答としては"No"でしたが、弁護士からは次のような返信が来ました。"悪いとは思いますが、kikは我々の登録済の名称ですので、あなたの家に弁護士がやってきてあなたのアカウントを取り下げてもらうことになるでしょう。" 私が"kik"のコードを書き始めたとき、同名の企業があるなんて知りませんでしたし、企業に名前を変えさせられるなんてゴメンです。要求を拒絶された彼らは、npmのサポートに対し

Angular2実践入門〜ng-japan 2016 セッションレポート〜 仲 裕介（HTML5 Experts.jp副編集長） この記事は、「ng-japan 2016」のセッションレポート（速報）です。講演内容を忠実に再現していますが、ニュアンス等伝えきれない場合があるので、気になるところは、記事末尾に掲載の講演資料やYoutube動画でご確認ください。 Angular2実践入門 / 白石俊平氏 当メディアの編集長であり、TechFeedの開発者でもある白石俊平氏によるセッション。スライド40枚以上の大作でライブコーディングもあります。 ライブコーディングで学ぶAngular2 今日のライブコーディングを追体験できるスターターキットを作った。是非活用してほしい。 https://github.com/shumpei/angular2-webpack-starter-minimum –

今年もngJapanをやらせて頂いた。ngJapanというのはAngularの通常の勉強会よりもちょっと大きな規模で行うイベントで今回はスタッフ入れて200名くらいの人に来ていただいた。キャンセル待ちを入れるとだいたい400名という感じなのだが、東京によくある当日ドタキャン4割（当日キャンセルせず来なかった人）というのが今回もありこれは泣けた。 ngjapan.org とは言えゲストも豪華で、受付も豪華。うん、受付が一番豪華だったかもしれません。 総評 Angularは2の動向や1.5 Componentの話もあり話題には事欠かないと思います。要約すると Web Component指向 RxJS/SystemJS/TypeScriptなどのAngular外との組み合わせ に尽きる。もう1.4のころのような書き方はしないというのが全体としての共通事項だったように思えます。 次にやること An

Angular2を触り始めているが、YEOMANジェネレータがあまりないので自分で作っています。今Angular2を始めている人達の多くがangular2-seed: github.com を利用していると思いますが（実際はよくわかりません）、Angular2にはangular-cliというのがあり、これを使うとディレクトリ構造とか開発環境とか多分ベストプラクティスが整う。angular-cliはember-cliを元に書かれています。 github.com angular-cliの使い方はgithubを見れば良いのですがemberに慣れていない人は若干戸惑うところもありますので備忘録的に記載します。 インストール npmを使ってインストールします。グローバルインストールするのですが、プロジェクトを作成したときもローカルにangular-cliがインストールされ以降はローカルを使うようです

オープンソースのエディタ「Visual Studio Code」がChromeブラウザのデバッガプロトコルに対応。エディタから直接デバッグ可能に マイクロソフトがオープンソースで公開している「Visual Studio Code」が、Chromeブラウザのデバッガプロトコルに対応したことが発表されました。 Visual Studio Codeのエディタ画面から、Chromeブラウザで実行しているJavaScriptのブレークポイントの設定と実行と停止、変数の参照などが可能になります。 JavaScriptのSoruce Map機能も働くため、圧縮済みのコードを実行しても自動的にVisual Studio Code上の圧縮前のJavaScriptコードに対応してそのままデバッグ可能。また同様の仕組みのおかげでTypeScriptのコードもVisual Studio Code上でそのままデバッ

MongoDBは悪だ。なぜならそれは… …データを無くす（ソース：1、2）。 …実際、長期間、デフォルトでエラーを無視し続け、何があってもすべての単一書き込みが成功したとみなした（ 32ビットのシステムで3GBかそこらを使用したら、MongoDBの制限によって何の警告もなしに全データを失うことになった）。 …宣伝していたユースケースでですら遅く、これが早いと主張するには完全に証拠に欠けている（ソース：3、4）。 …ほぼ全てのユースケースで、暗黙のスキーマという悪しき習慣を強要してくる（ソース：4）。 …ロッキングに問題がある（ソース：4）。 …セキュリティの問題になるくらい、応答時間が酷く遅い。求めてきた人全員に認証なしで全データをさらしてしまうという危険なデフォルト設定をパッチするのに2年かかった（ソース：5）。 …ACID特性に準拠していない（ソース：6）。 …拡張やメンテナンスをする

『HTML5 Experts.jp』が編集プロセスの「自動化＆見える化」にチャレンジしてみました【データ編】 馬場 美由紀（HTML5 Experts.jp編集部） HTML5 Experts.jpは「日本にもっとエキスパートを」をビジネスゴールに、エンジニアやクリエイターのスキルアップに役立つ情報を発信すべく、2014年7月から300本以上の記事を公開してきました。この1年半、日々サイト運営してきて思うのは、もっと記事PVの集計やデータ共有が自動化されて、執筆陣とのコミュニケーションがスムーズにしたいということ。 そこで今回編集部では、スペシャリストにアドバイスを受けながら、データ分析を自動化したり、執筆陣ともっと気軽に議論できる編集プロセスの「自動化＆見える化」にチャレンジしてみました。 「日本にもっとエキスパートを」の指標をつくる 今回編集部が指導を仰いだのは、NTTレゾナントのUX

@laco0416 です。今回はHttpモジュールの機能を眺め、アプリケーション中で使う際のベストプラクティス案みたいなものを考えていこうと思います。 なお、本稿で扱うAngular2のバージョンはbeta.0です 基本的な使い方 まずはざっとAPIリファレンスを眺めます。 https://angular.io/docs/ts/latest/api/ 重要なのは以下のシンボルです。 HTTP_PROVIDERS Http Request Response HTTP_PROVIDERSはHttpクラスのインスタンスをDIで取得するために必要なプロバイダのセットです。テストでモックサーバーなどを差し込みたい場合はこのプロバイダをいじくります。 HttpはAjaxの主役、いわゆるクライアントです。このクラスのメソッドでリクエストを送り、レスポンスを受け取ります。 RequestはHttpクラスが

エンタープライズ的な的な仕事上、Windowsマシンが欲しかったので、いい時期でもありSurface Pro 4を購入した。メインはMac Book Proだがセカンドマシンとして威力を発揮してくれるのではと期待しての購入です。 仕事は基本的にエンタープライズWeb的な仕事がほとんどで、それなりにモダンWeb開発に必要なツールは入れとかないとという感じです。インストールしたものはこれです。 git bash python2.7 Ruby Visual Studio 2015 Community Windows 10 SDK nodist nodejs yo grunt-cli bower gulp live-server Visual Studio Code 準備 買ったら普通にパスワードとか設定します。Windows10ではパスワードとは言わずPINと呼んでいます。Windows10、特

2/4 熊本にある「ビジネスブレイン太田昭和熊本開発センター」でAngular2ハンズオンをやった。熊本でのAngular勉強会は２回目で、「モダンなWebとはどのようなものか」に興味をもつ基本的にはJavaScriptではなく他の言語をメインに開発をしている方が集まっておこなってます。こちらとしては他言語の方からのお話はとても有意義。 angularjs-jp.doorkeeper.jp Angular2(5 minutes)ですがTypeScript, JavaScript, Dartで書かれています。今回の勉強会ではES5から開始し、TypeScriptで出てくるキーワードの背景（意味）を理解するということをしました。勉強会での結果ですが、Angular2を書くならやはりTypeScriptかなという意識になりました。 angular.io やったこと ハンズオンの内容は次の通り E