日記です。 事務所がちょっと手狭になり引っ越しました。基本的にほとんどの人がリモートで作業している１０名にも満たない会社ですが、一人当たりのスペースは広く取りたいし、あまり密接しているとストレスになるのもと思い、お金も乏しいですがやっちゃいました。 機材スペック等々はざっくりですが書き出して見ます。 ディスプレイ 31.5インチ デスク W1500 / D600 以上 開発機 Mac Book Pro Office365 GitHub (プライベートリポジトリを使用) Adobe ライセンスを従業員全員に配布 ちなみに建屋にサーバとか置いて無いです。全てクラウド。 プリンター、FAXも無いです笑 ちなみに電話もありません、開発者にとっては邪魔なだけ。基本的にはSlackなど使っています。 何はともあれ、是非遊びに来てください ^^¥

PWA（Progressive Web Apps）をやり始めているところが多くなりそれ自体は喜ばしいところです。ただ、最近のWebサイトで「通知しますか？」と言って来ることが多くなり正直ウザすぎです。誰がこんなの考えたんだってくらいイラっとします。 イメージですが、だいたいネイティブってというのは「お前のことが気に入った！いつでも連絡くれよ！」ってことでインストールするのに対して Web の場合は「たまたま今晩偶然に会っていい雰囲気だったけど多分もう会わないよね？」って感じで偶然意気投合しただけなのに後で連絡要らないよなと全てのサイトで思ってしまいます。 例え話がちょっとあれですが、詰まる所 Web とネイティブは同じようなインターフェースじゃ無いんだよと言いたいし、単純にサイト更新したから見てくださいの通知を実装してしまうセンスってどうなんだろうと思ったり。 プッシュ機能に限っては、サイ

de:code2018 に引き続き、 6/9 Android の ABC でも登壇の機会を頂きありがとうございました。内容は de:code 2018 と同じでしたがよりモリモリなお話しができたと思います。スタッフの方々をはじめとして聴講してくださった方々に御礼申し上げます。 abc.android-group.jp さて、モリモリの内容ですが、次の通りです; フロント設計の主軸は Atomic Design 、実装はコンポーネント指向 俺たちは Web フレームワークが欲しいんだ HTMLもCSSもJavaScriptもモジュール分割しようぜ エコシステムって言うのは、フロントからバックまで合わせてエコシステム考えるべき この話は de:code 2018 でもしたんですが言い方がソフトだったせいか言ったとこがわからなかったような人がちらほらいたかな？と思います。 フロント設計の主軸は

5/23 decode18 に登壇で参加してきました。貴重な経験をさせて頂きましてありがとうございました。かなり釣りっぽくなってしまいましたが「３大フレームワーク（Angular, React, Vue.js）比較によるエンタープライズ Web アプリケーション開発の最適化」というタイトルです。Web Components から始まり、これらフレームワークがそのポリフィル（正確な表現ではありません）になり得るのか？ってのが一つのテーマでもありました。明言はしてませんが、これわかる人にはこのポイントがわかったんじゃないかなと思います。それとAzureです。ちょっと簡単に喋ったテーマを整理します。 Web Components ポリフィルとしてのWebアプリケーションフレームワーク デリバリーを含む、Webフルスタックとは これからのWebアプリケーションエンジニア Web Component

Angular と Azure Function と Swagger を利用している。Swagger はあまり好みじゃなかったんだが他に良いAPI設計する場所とそれを管理する場所も見つからなかったので、遅ればせながら本腰入れて利用しようと思った次第でメモ的な何か。 いい加減な説明 Swagger Swagger は RESTful APIを構築するためのオープンソースのフレームワーク app.swaggerhub.com Azure Function Azure Function は サーバーレス コンピューティングで云々。 azure.microsoft.com Angular フロントエンド Web アプリケーションを作るもの。 https://angular.io/angular.io やってみる（思考実験含む） Azure Function を利用するとSwaggerで（という表現

SPA で認証を行う一つの方法として Microsoft の Azure Active Directory(Azure AD) を利用する方法があります。Azure AD はリソースの保護を目的としたソリューションであり、ユーザー ID の管理とインテリジェンスに基づくアクセス ポリシーの作成に役立ちます。って書いてます。 azure.microsoft.com ここでは Azure AD をセッティングして Angular を使って認証したいと思います。 Azure AD の設定 Azure AD を作る 事前に https://portal.azure.com に対してログイン出来るアカウントを作成 しておく。ADは「リソースの作成」から作ることができるので必要な項目を３つほど入力し作成します。だいぶ端折ってますが簡単です。 Azure AD へアプリケーションを登録 ADが作成された

もくもく会@ng_kobe#2 でやったことをまとめます。「Webpacker is 何？」ってところからどうも Ruby on Rails で Angular プロジェクトが作れるらしいものがあるということで少し触ってみた。ドキュメントを読む限りでは「はろーわーるど」的なものは簡単に作れそうな雰囲気がしました。で、こいつがどこまでやってくれるのかが気になるところです。 github.com Angular プロジェクトの生成 はじめに Rails でプロジェクトを作成します。このとき --webpack=angular と指定しておきます。 rails new --webpack=angular rails-angular cd rails-angular ./bin/rails s ビルドが完了し簡易サーバが起動したらブラウザで http://localhost:3000/ を開くと「

2017 年は個人的にも会社的にも飛躍の年になりました。これも皆様に支えられてのことかと感じています。仕事は主に Angular の導入支援や開発、教育などを柱に Web 全般を行いました。当然一人では出来ないので 「仲間（メンバー）」の力を借りて何とか年を越したという感じがします。 良かったこと エンジニアとして育ってきた環境は違うけど、方向性が同じように感じるメンバーと仕事が出来ている メンバー教育に力を入れることができた Microsoft MVP に成れた Angular を主題とした登壇が多くできた SIer 系企業で Angular が流行りだしている（ように感じます） 皆様に支えられて仕事が頂けている 悪かったこと 勝ち戦に負ける振る舞いに結果的になった コードを書く時間が減った（コードレビューばかりしている） ぷるりく減った ブログを書く量が減った 経費が増えた ヤケ酒が増

Azure App ServicesはGoのサポートがあります。現在、Azure App Serviceプラットフォームでサポートされているバージョンは64bit Go 1.4.2とGo 1.5.1です（らしい）。Azure Appサービスを作成してセットアップして、新しいGoアプリに対応し、デプロイメントを設定する必要があります。 Go on Azure Goを実行させるための手順は次の通り： 新しいWebアプリケーション(WebApps)を作成します。 github、gitbucketなどにリポジトリーを作成します WebAppに作成したリポジトリーを登録します ローカルで server.go を作成しリポジトリーに push します package main import ( "fmt" "net/http" "os" ) func handler(w http.ResponseWr

Angular 4 のリリースを目の前に Angular Community の分裂がいよいよ表面化し始めた。AngularJSから言われていたその独特な記法は JavaScript エンジニアから敬遠されることもあり、そうしたことが払拭されなかったことが原因なのでは無いかと思う。今 Angular は岐路に立たされている。何かというと Angular は 「Angular2」 からはじまりましたが、それをフォークしたかのように 「Angular 2」 が現れ、ほぼすべての人がこちらに移行していったように思えたが若干まだオリジナルの「Angular2」を使っている Community メンバーもいる。新しく入った Community メンバーには 「AngularJS2」 といってどこからフォークされたかわからないような正しくないAngular の利用者まで現れている。そうこうしているうち

dotnet (ここでは、あえて dotnet と記します)には Angularテンプレートが用意されているという話を聞きましたので実際に触ってみました。ここで dotnet のバージョンは RC4 を使う必要があります。Angular のテンプレートがあるというだけではさほど珍しいものでもなく、むしろ、なら angular-cli を使ったほうが遥かに利便性は良いと思います。 dotnet の Angular テンプレートの魅力は Angular Universal を基本的に利用しているところです（現時点で Angular Universal をサポートしているのは Node.js と dotnet core だけ）。 GitHub - devCrossNet/universal-cli: CLI tool for Angular2 GitHub - dotnet/core: Home

MVP初仕事として「Geek Women x Microsoft - Geek になりたい人のためのミニカンファ -」で Angularハンズオンしてきました。初心者セッションでしたのでangular-cliの使い方とかは無しでビルトインディレクティブを少し触るくらいでどうかといった方針でやりました。が！30分ちょいの時間だったのでここすらできず、、、やったのはHello World的なところで終了しました。やはりハンズオンは1.5から2時間はやりたい。 geekwomenjapan.github.io 実際にハンズオンで利用した資料はこちらです。ご興味のある方はどうぞ： Angular Handson Geek Women Japan · GitHub 特徴は npm でこれと言って何かしらインストールさせるのではなくhttps://unpkg.com/からファイルを直接取得しています。

タイトルの通りです。「いくらユーザが古いブラウザを使っていてもサポートしちゃいかんよ」です。以前から方々で言われている通りで記事も多くあります。よく言われるのが「ある程度動けば」とか「機能が落ちても」というような話がありますが、そういう問題では無いです（下記記事を読めばわかる）。 なぜサポートが終了した Web ブラウザーを使うと危険なのか? – monoe's blog Internet Explorer のサポート終了 ざっくり言うと、サポートされていない古いブラウザを使い続けるとマルウェアへの感染などリスクが高まる等脅威があり、そうしたブラウザをユーザへ供用することは間接的に加害者になる、などなど。 Web を何かしらで生業にしている会社なら当たり前のような気がします。ので適当にピックアップしたサイトの推奨環境を見てみます。 サイト 最新を推奨しているか 推奨環境URL Yahoo

Angular を勉強する最良の方法は angular.io を読む コードやissueを読む 実際に手を動かす だと思います。ただ残念ながらすべて英語で書かれていますので、はじめてこうしたフレームワークにチャレンジするには敷居が若干高くなるかと思います。アドベントカレンダーですので初心者向けに利用している教科書をgitbooksに書き起こしました。細かい説明はあまり書かれてませんので、気になることはご自身で調べると良いと思いますし、やはり angular.io のチュートリアルなどはやっておくべきことと思います。そこに行く前のより簡単なものです。 こちら → https://albatrosary.gitbooks.io/start-angular/content/ 章立ては下記の通りです： Introduction Angularとは アプリケーション開発をするための環境 angula

「クソazureが！」とそのときは思った。何と言ってもAngularで作ったアプリをgithubからデプロイする評価で幾つかインスタンス作ったら一瞬にして（5日ほどで）サブスクリプション 15,000円分が消滅するとは…ほんとにクソだ！とは思いましたが、冷静に考えると"App Service"はどんな料金体系で、もっと格安なのあれば変えとけばいいんじゃない？ということになり改めて見直してみました。 通常Web Appsを作成する場合の価格レベルは「Standard: 1 S」で設定されています。 さてでは価格体系は一体どういうものがあるのかというと となっていて「Standard: 1 S」だと評価のみで利用するにはちょっと高い感じもしなくもないです。で、Freeというのがあるのでそれを選択すると「タダ！」。最高です。 この変更はスケールアップで表示されます。スケールアップをクリックした後

DevOps, Microserviceなどキーワードが色々話題はあるが、エンジニアとしてはCloudやCI、アプリケーションフレームワークをうまく利用していくことが重要だ。今回はCloudは、AzureのWEB + モバイルを利用し、CIとしてはWercker CI、アプリケーションフレームワークとしてはAngular v2を利用し、開発プロセスからデプロイ/リリースまでの流れを作ってみる。 Azure Azureには40以上のサービスがあり、サービスはいくつかの種類に分けることができる。 Compute ネットワーキング ストレージ Web + モバイル Databases Intelligence + analytics モノのインターネット Enterprise Integration セキュリティ + ID Developer tools Monitoring + managem

「Angular v2は事前コンパイルすることができる」ということを聞いても何のことだろうと思ってしまう。何故このように事前コンパイルする必要があるかというと「開発したAngular2アプリケーションをより効率の良いもの」にするためです。この「効率」というものを具体的にコードを書いて見ます。サンプルコードはAngular2チュートリアルを使っています。 事前コンパイルはngcコマンドで行いますが、そのモジュールが@angular/compiler-cliから提供されます。これにtsconfig.aot.jsonというファイルを追加することと、package.jsonに"ngc": "ngc -p ./tsconfig.aot.json",というスクリプトを定義すること、そしてbootstrapを定義しているmain.tsに対してAoT(Ahead-of-Time)ファイルmain.aot.

機械学習とかAIとかドローンとかVRとか最近バズり出してますが、さして興味もなく、というよりそこに注力している時間があったらWeb開発に時間を使おうと考えているので全然触れてもいなかったジャンルでした。が、TechFeedがナイトセミナーをするというので行ってみた。TechFeed はキレーションサービスを行っているサービスで話題のITネタを調べるには丁度良いサイトだと思ってます。 techfeed.io さて、セミナーの内容ですがこちらを見て下さい。内容はかなりガチでした。とぅぎゃったのでログを読んでみてください。 techfeed.connpass.com togetter.com 感想ですが、セミナーでは数学の知識が無くても誰でも機械学習は扱えるという話でしたが、そこは微妙な気がしています。おもちゃ的にデータ入れて何か統計っぽいことしてやっぽいというのは使っているということにはならな

Angular 2 RC5から導入されるNgModuleを使ってTodosを作ってみます。NgModuleの導入により@Componentで定義されていたものをNgModuleでまとめて定義することが可能となるようです。詳しくは @laco 氏のこちらを見て頂けると良いと思います。 ng2-info.github.io 変わるところとしては次のようなところのようです： bootstrap関数の呼び出し @Componentのdirectives @Componentのpipes Todosを作ると少なくともコンポーネントが4つは作ると思います。 元となるコンポーネント: todos.ts 入力のコンポーネント: todos.input.ts 一覧のコンポーネント: todos.body.ts 詳細機能用のコンポーネント: todos.detail.ts このコンポーネント郡をひとつにまとめ

ちょっときもいAngular2のTemplate Syntaxですが、、確かにキモい、キモすぎる。[]だったり()だったり*とか。このあたりの概要が結構整ってます。 angular.io ざっと目を通してみる 多くはtemplateとclassとのデータのやり取りはダブルカーリー{{}}で記載するのが容易ですね。 import {Component} from 'angular2/core' @Component({ selector: 'my-app', template: ` <h1>My First {{name}} {{1+1}} App</h1> ` }) export class AppComponent { public name = 'Angular'; } One-wayバインディング さて、この方法でtextボックスのvalueに値を詰め込む @Component({