ドメイン駆動設計の用語と解説（DDD入門ガイド）
中〜大規模アプリケーションを開発するノウハウを持っておらず、どのようにシステム設計するのが良いのかわからなかった。そのため、1週間ほどドメイン駆動設計（Domain-Driven Design）について勉強した。 当記事では、勉強中に得たドメイン駆動設計をわかった気になれるのに必要な用語のまとめや、実装でどのように使われるかをまとめる。 筆者は「実践ドメイン駆動設計」を読んだわけでも、完全に理解したわけでもない。しかし、雰囲気を掴むための情報はわかっている状況なので、間違っている箇所があったら指摘していただきたい。 ドメイン駆動設計とは？ ドメイン駆動設計（DDD、Domain-Driven Design）を一言で説明すると「現実世界の業務をドメインモデルに詰め込んでソフトウェアに深く反映させる設計手法」だ。 詳しい説明は後述するが、ドメイン駆動設計の全体図は下図のような感じだ。 ドメイン
自作フレームワークをつくって学ぶ 仮想DOM実践入門
昨今の代表的なJavaScriptフレームワーク（React、Vue.jsなど）には「仮想DOM（Virtual DOM）」という概念が採用されているので、フロントエンド界隈の人は一度は耳にしたことがあるだろう。ただ、仮想DOMについて学ぼうと検索してもヒットするのは「フレームワークの使い方」ばかり。踏み込んでいても概念の説明どまりで、仮想DOMがどのように実装されているか解説した記事はすくない。 ということで、当記事では理解を深めるために仮想DOMを使ったフレームワークを自作し、仮想DOMに入門する！ そして、ReactやVue.jsを単なるブラックボックスのフレームワークではなく、中身を理解して使えるようになることを、当記事の目標とする。 フレームワークが完成すると以下のようなWebアプリケーションがつくれるようになる。 TOC 記事が長くなりそうなのでも目次 そもそもDOMとは？ D
box-shadowを使ってCSSだけでドット絵を描き、アニメーションさせる | Black Everyday Company
CSSだけでドット絵（Pixel Art）を描く・アニメーションさせる方法を紹介する。ただ、バニラCSSだけでも大丈夫なのだが、よりメンテナブルにするためSassで描く方法も併せて紹介する。 ちなみに下図のようなドット絵がつくれる。 マリオとMinecraftの土ブロックは、CSSアニメーションをつかって動かしている。もちろんJavaScriptは使っていない。 box-shadowプロパティについて ドット絵を描くためには、CSSのbox-shadowプロパティを使う。 そもそもbox-shadowプロパティは、要素にドロップシャドウ効果（影をつける）を与えるのが本来の使い方なので、まずは基本的な使い方からまとめる。 いくつかの構文がある。 box-shadow: offset-x offset-y color box-shadow: offset-x offset-y blur-rad
[図解]Vue.js2.x系で親子コンポーネント間でデータの受け渡しをする方法
引用: Components#Composing Components - vue.js Vue.jsで親子コンポーネント間でのデータの受け渡しは、原則としてPass Props/Emit Eventsで行う。 親コンポーネントから子コンポーネントへデータを渡すときはPropsを使い、子コンポーネントから親コンポーネントへデータを渡すときはEmitでイベントを発火させる、ということらしい。 ただ、公式ドキュメントに載っている図を見るだけではよくわからなかったので、実際にサンプルを作ってみた。 親子コンポーネント間でデータの受け渡しをする方法 <div id="app"> <div class="parent"> <h2>Parent</h2> <!-- 子コンポーネントからのデータを表示 親.applyメソッドで更新される --> <p>{{ messageFromChild }}</p>
![[図解]Vue.js2.x系で親子コンポーネント間でデータの受け渡しをする方法](https://cdn-ak-scissors.b.st-hatena.com/image/square/3e2407ba7d8fb2983c260617cf5c8d799d8516b7/height=288;version=1;width=512/https%3A%2F%2Fblogger.googleusercontent.com%2Fimg%2Fb%2FR29vZ2xl%2FAVvXsEjbjVTF6b1dMxmqfReQmbC4ZM_IP8UH8WTF3f0U-3TNqQCNBA5_gqqBWX1X2iD-Fb5cQbYJGwk2k0qRCaPAQTVKqMQFciyBwwVqwiYjwqyiNjtIDlPGABH-DjvHQDqI1RWq1p75YuMCX2XC%2Fw1200-h630-p-k-no-nu%2Fprops-events.png)
initial-setup-script-for-centos.html
CentOSでサーバを立てたときに、まず最初に必ずやっておきたい初期設定がある。 その作業の一覧が以下のとおり。 パッケージを最新化する 新規ユーザを作成する suコマンドを制限する suコマンドを実行可能なユーザ・グループを限定する 特定のグループ以外suコマンドでrootに昇格できないように制限する パスワード入力なしでsudoコマンドを利用できるようにする ssh接続を制限する rootユーザのsshログインを禁止する sshで公開鍵認証のみ接続を許可する sshでパスワード認証を禁止する 公開鍵をサーバに登録する sshdサービスを再起動する iptablesまたはfirewalldの設定 ←今回はやらない Webアプリケーションをつくりたくて、WebサーバとAPサーバを用意しようと思ったが、毎回この初期設定をするのが超絶メンドそう...。 ということで、自動化するために初期設定を
Slack上からさくらのクラウドを操作できるbotをつくった
Slack上からインタラクティブに さくらのクラウド のリソースを操作するbot（sacloud-bot）をつくった。サーバの作成、一覧取得、電源操作ができたのでひとまず公開する。 つくったもの Slack上のbotと対話しながらサーバ作成などができるbot。 APIを叩くのも面倒だし、コントロールパネルを開くほどでもない。そんなときに使って欲しい。 また、Slack上で完結しているためスマホやタブレットからでも、通信量をほとんど気にせずにサーバの操作ができる。 実装済みの機能 サーバの作成（ディスク含む） サーバの一覧取得（全ゾーン対象） サーバの電源操作（起動、停止のみ） 今後したいこと 各リソースに対する操作全般の実装 リファクタリング テストの追加 操作全般は全部するのは大変なので、簡単な部分だけを実装したい。 インフラ構成するならコントロールパネル使ったほうが早いし楽だしね！ リ
素のJavaScript（TypeScript）でMVCモデルのToDoアプリをつくってみた
photo by Sébastien Barré AngularJSやBackbone、KnockoutJSといったMV*フレームワークや、ReactといったVに特化したフレームワーク、jQueryといったライブラリがいっぱいある。 AngularJSを勉強し始めたは良いが、2.0になると全く別モノになってしまうなど、どれを勉強すればよいかわからなくなってしまった。 ということで、まずはフレームワークやライブラリを使わない「素のJavaScript」でMVCモデルを勉強してみようと思った。 つくったToDoアプリの概要は、前回の「TypeScript + AngularJSでToDoアプリをつくってみた」と同じだ。 ※ 以降TypeScriptで記載しているが、JavaScriptのソースが見たい方はGitHubにコンパイル後のソースを置いてあるので、そちらを参照ください。 Model層
2分でできる、gulpとTinyPNGで画像圧縮を自動化する方法
ブログをやってるとスクショやイメージ画像を撮って、ツールまたはWebサービスを使って画像を圧縮すると思う。私の場合は、画像圧縮には劣化が少なく圧縮率がハンパない「TinyPNG」というWebサービスを使っている。 ただ、意外と面倒なことが多い。 対象の画像ファイルを選ぶ（しかも1度に20ファイルまで）、そして圧縮が終わったらひとつずつリンクをクリックしてダウンロードしなければならない。 画像ファイルが5つ以上になると、結構メンドくさい。 ということで、gulpを使って画像圧縮を自動化してみた！ ※Node.js、npmがすでにインストールされているなら、2分ほどで完成するだろう。 （「記事読むだけで2分以上かかるだろ！」ってツッコミは…ホントごめんなさい。） 0. Node.jsがインストールされていない場合 gulpを使うにはNode.jsが必要。 Node.jsの公式サイトからダウンロ
楽天メールdeポイントのURLを抽出しスプレッドシートに自動で出力する方法
学生のころは、時間はたっぷりあるけどお金がないということで、楽天（インフォシーク）の「メールdeポイント」のURLをクリックして小銭を稼いでいた。 しかし、社会人になって「労力 >>>>>> 対価」だと気づき、ずいぶんと放置していた。 Infoseek メールdeポイント とは 1通ごとに必ずポイント＆ポイナビ補助券がついてくるお得なメールサービスです。 【楽天PointClub】Infoseek メールdeポイントでポイントが貯まる でも、ある程度自動化できたら便利じゃない？ ということで、Gmailに届いた「メールdeポイント」から対象URLを抽出し、Googleスプレッドシートに自動で出力するスクリプトをつくってみた。 注意事項 利用規約の禁止事項について 第7条 1.(2)自動化プログラム等を用いて、ポイントまたは景品等を取得すること 【メールdeポイント】規約 - Infosee
TypeScript+Jasmineでテスト駆動開発（ビヘイビア駆動開発）をする
膨大なユニットテストを手動でやりたくないし、リグレッションテスト（回帰テスト）も面倒で、テストの自動化をしたい。 ということで、JavaScriptのテストフレームワーク「Jasmine」をつかったテスト駆動開発（ビヘイビア駆動開発）をやってみた。 開発環境と各種バージョンは、以下の通り。 Visual Studio Community 2013 TypeScript Jasmine 2.2（現時点での最新版） 追記：2015/06/07 bowerやtsdを使うともっと簡単にJasmineとその型定義ファイルをダウンロードすることができる。 詳しくは、以下のエントリで。 Jasmine の導入 Visual StudioのNuGetからもインストールできるけど、ディレクトリが変に作られてしまうので、GitHubからダウンロードする。 ※ 私の環境では、scriptフォルダ直下に"jasm
はじめてのTypeScript開発環境構築（gulp, bower, webpack, tsd, npm）
はじめてのTypeScript開発環境構築（gulp, bower, webpack, tsd, npm） TypeScriptで開発しようとしたとき、いろんな問題にぶつかった。 もともとSIerではVisual Studioさえあればなんとかなる環境で育ってきたため、Web系のさまざまなツールを導入する上で何度も挫折した。 ということで、初心者（私）が初心者向けに「はじめてTypeScriptの開発環境（gulp + bower + webpack + tsd + npm）を構築するときの手順とポイント」についてまとめていこうと思う。 ツールの使い方間違っているよなどの指摘がありましたら、コメントやTwitterで教えてください。 この記事の目標 TypeScriptで開発したい ライブラリも使いたい（今回はjQueryを例にする） Web界隈のツールにも慣れたい 使用するツール（ツール
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
