意外と簡単。TypeScript+JavaScriptでビルドする方法
巨大化するWebサービス/アプリの開発現場で着実に市民権を得てきたTypeScript。C#生みの親Anders Hejlsberg老師が作ったとあって開発効率を爆上げしてくれる。非常に筋の良い言語だ。 今回はTypeScriptへJavaScriptソースをインポートし、webpackを使って1ファイルにビルドする方法についてangularプロジェクトを例に取って解説する。「npmとかbowerで落としてきたJavaScriptってTypeScriptからどう使うの〜？」てな事を解決しよう。 さくっと分かる(?)ビルド方法 これからつらつらと設定やインポート方法の解説が続くけれど、やりたいことはシンプル。要はTypeScriptでJavaScriptをインポートする命令を書き、それをビルドして1ファイルにする設定をするだけ。それでは詳しく見ていこう。 詳しいビルド方法 プロジェクト構成
集客力アップ！All in One SEO Packでブログ記事のSEO対策
飲食店などのお店がブログ付きのホームページを持っているケースが増えてきた。言うまでもなく、Web集客の一番の施策はブログを書くことだ。しかしながら、ただ単に記事を書いていないだろうか？しっかりとSEO対策をしなければせっかくの記事が無駄になってしまう。WordPressなら『All in One SEO Pack』なるプラグインで簡単に投稿のSEO対策ができる。今回は、ブログ記事の投稿時にやっておきたいAll in One SEO Packの設定を解説する。 All in One SEO Packとは？ All in One SEO PackはWordPressのプラグイン。プラグイン名にあるとおりに全てのSEO対策をコレ一つで出来る訳ではないけれど、非常に多くの設定をカバーしている。SEOに関する各種の設定を個別に設定していくよりかはこのプラグインを使う方が圧倒的に楽だろう。 All i
Slack 新チームの作り方と、招待されてからすること。
国内でもジワジワと広まりを見せているSlackでチームを作る方法と、チームに招待された後にすることを解説する。 新しいSlackチームを作る まずはSlackのトップページから新しいチームを作ろう。デスクトップ/スマホアプリでSlackを使っている人はアプリ内からチームを作れる。 画面下部のフォームにメールアドレスを入力してチーム作成に進もう。 Slackチーム名を決める 新しく作るチームの名前を決めよう。 SlackチームのURLを決める 次に、チームのURLを決めよう。 Slackのアカウント名を決める 新Slackチームで使うアカウントの名前を決める。姓名に加えて、チャットで表示される名前を入力しよう。 登録内容の確認 ここまで登録した内容を確認する。問題なければ晴れてチームが作られる。お手軽だね。 Slackチームへメンバーを招待する 最後に、作成したチームへメンバーを招待する。招
[C# LINQ] Whereの使い方から注意点まで
Whereの役割 Whereの役割はコレクションをフィルタリングすることだ。例えば数字の入った配列があったとして、その中から偶数だけを取り出したいときなどに使える。 役割が単純な分使いやすく、使用機会も多い。これは裏を返せばつい無駄なところでも使ってしまうということ。今回の記事の後半ではWhereを使わなくても良いパターンを紹介する。 Whereの仕様と具体例 1 さて、Whereの仕様を見てみよう。Whereには２つのオーバーロードがあるが、まずはシンプルなこちらから。
![[C# LINQ] Whereの使い方から注意点まで](https://cdn-ak-scissors.b.st-hatena.com/image/square/1966d699a206df060580d3fea2b92589c7249006/height=288;version=1;width=512/http%3A%2F%2Ftoach.sakura.ne.jp%2Fbase%2Fwp-content%2Fuploads%2F2016%2F04%2Fbooks.jpeg.formatted.jpg)
[C# LINQ] データをグループ分けするGroupByを図解する
配列やリストなどのデータをグループ分けしたい時は無いだろうか？例えば、名前やenum値でインスタンスを分けたいときなど。そんな時に使えるのがLINQのGroupByだ。今回はGroupByの使い方を解説する。 GroupByの考え方 GroupByを使えば、コレクションをキーごとにグループ分けできる。Dictionaryの要素が配列になっているイメージと言ったらわかりやすいだろうか？図にするとこうなる。 ResultがGroupByの返り値であり、その下にKey、更にその下にElementが連なっている。 GroupByの仕様 GroupByの仕様を詳しく見てみよう。いくつかのオーバーロードがあるけれど、ここでは最も簡単なものを見てみる。
![[C# LINQ] データをグループ分けするGroupByを図解する](https://cdn-ak-scissors.b.st-hatena.com/image/square/38b935f620bf15f1928cd5f658deea3d9936ab2c/height=288;version=1;width=512/http%3A%2F%2Ftoach.sakura.ne.jp%2Fbase%2Fwp-content%2Fuploads%2F2016%2F04%2Fgrouped-sheep.jpeg.formatted.jpg)
そのC#、長すぎない!? 劇的にスリムになります。LINQならね。
「いつもソースが長くなってしまう」というアナタ。foreachをLINQで書き換えることから始めてみよう。 見たことはないだろうか？ foreachの入れ子、あるいはforeachの後にすぐ別のforeachが来るC#のソースを。foreachクン自体には何の罪もないけれど、ついソースを長くさせてしまう困ったちゃんなのは事実。そこで、foreachをLINQで書き換えてみよう。「今までのあの苦労は何だったんだ……」となること請け合いなスリムアップ効果が期待できる。
ちょっとづつ学ぶWordPressテーマの作り方 1 -環境構築- – TOACH
猫も杓子もメディアを持つ時代になった。ブログ、SNS、ニコニコ動画、YouTube……。分けても、ブログは個人・組織を問わず広く使われている。 はてなブログなどのブログサービスを使ってブログを作るのもいいけれど、ブログっぽくないコンテンツサイトなど、完全に好みのWebサイトにしようと思うと不自由を感じることがある。 そんな時にオススメなのがWordPressだ。W3Techsが調査したところによると、CMSでは全世界のWebサイトの約半数がWordPressで使われているという。 Usage Statistics and market share of WordPress for websites | W3Techs 今回から、法律に引っかかりそうなほど広く使われているWordPressサイトの外観を決めるテーマの作り方を紹介していく。 第一回のWordPressテーマ講座はテーマ作りのプ
今からでも遅くない、AWS Auto Scaling入門 – TOACH
AWSインスタンスの数を負荷に応じて調節してくれるAuto Scalingは、高負荷に対応しながら運営コストを抑えたいなら必須の機能。今回は、そんなAuto Scalingの触りを解説する。 Auto Scalingの起動設定 起動設定を開く まずはAmazon EC2のコンソール画面を開き、Auto Scalingの起動設定を開こう。 Auto Scaling グループを作成する 起動設定に入ったら、『Auto Scaling グループの作成』をクリックする。 起動設定を作成する 次の画面で、右下の『起動設定の作成』を選ぶ。 AMIの選択 起動設定として、まずはAMIを選択する。既存のAMIをAuto Scalingで使用する場合は『マイ AMI』から選択しよう。※ここではAmazon Linux AMIを選択した インスタンスタイプの選択 次の画面でも、プロジェクトに合ったインスタンス
[最新版] Noto Sans JapaneseをWebフォントとして使う方法 – TOACH
Notoフォントは全ての言語に対応することを目指している。GoogleとAdobeが共同開発したこのフォントは、Webフォント、組み込みフォントを問わず無料で利用できる。 ※Adobe製品においては、『源ノ角ゴシック』という名称になる。 プログラミング用フォント『Source Code Pro』を開発したAdobeが関わっているおかげか、Notoフォント自体非常に美しい。 そんなNotoフォントは『Google Noto Fonts』なるプロジェクトで無料で公開されている。 Google Noto Fonts 今回は、このフォントをWebフォント ―すなわち、外部からダウンロードして使うフォントとして使う方法を紹介する。 実は面倒くさい、WebフォントでNoto Sans Japanese Type SquareやFONTPLUSなど、Webフォント提供サービスは多く存在する。サイトを見る
![[最新版] Noto Sans JapaneseをWebフォントとして使う方法 – TOACH](https://cdn-ak-scissors.b.st-hatena.com/image/square/7ef8a0de729a6b521ddc76e88f254c49a93b14e4/height=288;version=1;width=512/http%3A%2F%2Ftoach.sakura.ne.jp%2Fbase%2Fwp-content%2Fuploads%2F2016%2F01%2Fmetro-blur.formatted.jpg)
Slack Botと会話するには？ -Botkit API Conversation- – TOACH
今回は、SlackのBotと会話する方法を解説する。 以前の記事で、SlackのBotは簡単に作れることを解説したけれど、あれはごくごく簡単なものだった。今回は、もう少し込み入ったロジックで使える、BotkitのConversationという仕組みを解説する。 Botkit Conversation Conversationを使えば、ユーザーとBotがやりとりすることができる。ユーザーの発言に応じてBotのアクションを切り替え、会話のようなことをさせられる。 会話といえば reply() でだってBotを喋らせることができる。それなのにどうしてConversationを使うんだろう？確かに、ユーザーの問いかけに対して一回応答するだけならreply()で充分だ。しかし、この後見ていくように、Conversationを使えば、ユーザーの問いかけに対して何度も応答したり、逆にBotから質問できた
Visual Studio Code 拡張機能のアクティベート activationEvents – TOACH
Visual Studio Codeの拡張機能開発で必ずお世話になる、拡張機能をアクティベートするタイミングの制御について解説する。 今回解説する方法を使えば、プロジェクトフォルダーにREADME.mdなるファイルがあるときだけアクティベートしたり、C#ファイルを開いたときだけアクティベートしたりできる。 activationEventsの書き方 プロジェクトフォルダーの最上位にpackage.jsonを置き、”activationEvents”というプロパティ内に複数の条件を書く。それぞれの条件は並列に判断され、１つでも合致する条件があれば拡張機能がアクティベートされるという仕組みになっている。
ポートフォリオサイトにおすすめなデザイン性に優れたWordPressテーマ10選 – TOACH
フォトグラファーや写真家など、アーティストの方の中には、自身のホームページを作って写真を載せている人もいるけれど、露天で売られている作品よりも、美術館に飾られている作品の方が優れて見えるように、ポートフォリオとしてのホー … Read More
Visual Studio Code API コマンド編 -vscode.command- | TOACH
Visual Studio Codeの拡張機能（エクステンション）開発に使えるAPIはよく考えられたものが取り揃えてある（何様）。 vscode名前空間から呼べる関数や型だけに限るとそう大層なことはできない印象を抱くかもしれないけれど、拡張機能のマニフェストファイル(package.json)も合わせると色々なことができる。 また、APIとして公開されていないけれども、Visual Studio Codeにプリセットされている機能（タスク実行や拡張機能のインストールなど）は、コマンドとして呼べるようになっている。 今回は、そこのところを含めて、コマンド系のAPIを紹介したい。 vscode.commands vscode.commands名前空間に、コマンドの登録/取得/実行をするための関数が1packageになっている。 コマンドを登録する – registerCommand regis
Visual Studio Codeの拡張機能を公開する方法 | TOACH
始まりはStack Over Flowのとある質問。 Can I automatically start a task when a folder is opened? Visual Studio Codeでフォルダーを開いたタイミングでタスクを実行できないか？という質問で、なんでそんなことをしたいかと言うと、gulpのウォッチをタスク実行しなくとも走らせたいということだった。 gulpでも、TypeScriptのトランスパイルで使うtscでも、ファイルの変更を自動でウォッチしてもらって、何か変更があったタイミングでビルドするというのは、一度タスクを走らせないといけなかった。 ところが、フォルダーを開いた時に自動でタスクが走ってくれゝば、そうした手間を減らせる。 規模の大きなプロジェクトだとどうなんだろうという気はするけれど、ウォッチを自動で始めてくれるなら確かに安心だな。 回答には、「今
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
「SEO×SNS×ブログ」で作る最効率化収益システム｜うきだいらブログβ
お店のHPやECサイトのWeb集客は動線から考えよう
Web集客に興味のある人必見。ホームページの集客効果を測定する方法
もう悩まない。読まれるブログ記事タイトルを作る12の方法
「SEO×SNS×ブログ」で作る最効率化収益システム｜うきだいらブログβ
「SEO×SNS×ブログ」で作る最効率化収益システム｜うきだいらブログβ