Angularとは
はじめに
Angularについて、勉強も兼ねてわかること、わからないことをまとめて行こうと思います。
なぜいまAngularについて学ぼうかと思ったのかというと、私は仕事はサーバーサイドのエンジニアなので、フロント周りの技術について行けておりません。
ですが、今後の技術的動向をみるに、APIが重要になってきています。(だいぶ前からそうなのかもしれませんが)
それを会社(自分)でも作れるようになるためには、フロント側の理解もしていないと、使いやすい物がつくれないのではないか、と思いまして、まずはフロント側の技術について学ぼうと考えました。
それで、じゃぁどういった方面から学んで行こうかと考えたときに、Angular大好きおじさん(色々教えてくれる)が会社にいたので、ちょうどいいからAngularを学ぼうという事に至りました。
Angulaとは
そもそもAngularとはなんなのでしょうか。
簡単に説明すると、JavaScriptフレームワークになります。
つまり、システム開発をより簡単に、高機能なものを作れるようにした雛形のようなものです。
Web開発で必要になりそうな機能をあらかじめ用意しておいてくれるのがAngularになります。
Angularは、AngularJSから始まり、その後Angular1になり、現在はAngular6まで出ているらしいです。
今回はAngular2以降に通じるお話をまとめて行こうと思います。
なぜかというと、Angular1からAngular2になるときに構文なども大きく変わっていて、互換性もないからです。
なぜAngularなのか
さて、なぜ今回Angularを学ぼうと思ったのかというと、冒頭でも言いましたがAgularに詳しい方が会社にいたからというのが大きいです。
正直なんでもよかったんですけどね。。。
ReactかAngularかが現在の主流らしく、どちらもよくわからないので、初心者にもとっつきやすいと書かれていたAngularを選択させていただきました。
どのように使うのか
AngularはTypeScriptで書くことが推奨されています。
TypeScriptはJavaScriptの親戚みたいなものです(多分)。
TypeScriptで書かれたものはトランスパイルすることでJavaScriptが生成されるらしいです。
よく理解してはいませんが、互換性を保つためにトランスパイルが必要らしいです。
例えばブラウザによってJavaScriptのサポート範囲が異なったりしているので、そういった部分を補うためにトランスパイルが必要?みたいな感じでしょうか。
またAngularはコンポーネント指向を前提となっています。
各部品をコンポーネントと呼び、コンポーネント単位での開発を行っていきます。
Angularのチュートリアルをやってみると、コンポーネントの理解が少しできるかと思うのですが、一番の外枠にapp.componentという枠が存在していて、その中に小さいcomponentを作っていくような形になります。
終わりに
今回はAngularの概要について、学びながらまとめてみました。
今度は実例などを交えながら、どういった書き方ができるのか、また実際にどこかAPIを使えるようなサービスがあればそこを参考にどのようにAPIを利用できるのかみていきたいと思います。
【.net】URL作成クラスpart2【備忘録】
URL作成クラスをstaticで作成していましたが、使うためには呼び出しもとでKeyValuePairをいちいち作らなきゃいけないつくりになってました。
パラメータが多くなればなるほど処理が気持ち悪い形になってしまうと思うんですよね。
そこでUrlCreatorクラスを以下のように書き換えました。
public UrlCreator(string destination)
{
this.url = Constants.ROOT + destination;
this.parameters = new List<KeyValuePair<string,string>>();
}
public string CreateUrl()
{
var url = this.url +
*1;
return this;
}
public string url{get;set;}
public List<KeyValuePair<string,string>> parameters{get;set}
こんな感じで書いておけば呼び出し側は
new UrlCreator("遷移先").AddParam("key","value").AddParam(...).CreateUrl();
みたいな書き方が出来て、処理を追うのが楽になりました。
一個前のやつだといちいちKeyValuePairのインスタンス作んなきゃいけないし、配列だともっとめんどくさいしね。
【.net】URL作成クラス【備忘録】
今URL作成クラスを作っています。
staticメソッドで以下のようにいったん作成しました。
public static string CreatUrl(string path, Dictionary<string,string> kvps = null)
{
var url = Constants.ROOT + path +
((parameters != null)
? "?" + string.Join("&", kvps.Select(kvp => kvp.Key + "=" + HttpUtility.UrlEncode(kvp.Value)))
: "");
return url;
}
これで問題なさそうですが、どうやらもうちょいスマートなやり方があるらしいんですよね。。。
とはいうものの、これでも十分な気がするので、余裕があれば考えてみます。
【.net】セッションの扱いとかとか【備忘録】
.netで掲示板の作成する中で、投稿記事内容の編集ページ作っています。
その中で投稿された記事を1件特定するための番号をどこで保持するかという悩みがあったんですね。
セッションで保持するかクエリ文字列で渡してあげるか、みたいな。
あんまりセッションにいろいろデータを持たせて管理しづらくするのもなーと思ってクエリ文字列として渡してあげようかと思ったんですが、そうするとユーザーチェックが必要になってしまうなぁとか、その情報はURLに表示されるけどええんかなぁとかいろいろと思ったんですが、結果としてクエリ文字列で渡すことにしました。
セッションに入れるのは、アプリ全体として保持していたい情報とか、セッションに入れるしか保持する方法がないデータに絞ることにしました。
いったんこの考えで作っていこうと思います。
もしダメだったらまた考えたいと思います。
また現在はURL作成クラスを作っている(一応できてはいる)ですが、もっといい方法はないかと検討中です。
【.net】C#で掲示板【備忘録】
repeaterでのページングはObjectDataSourceとか使えなかった。。。
repeater自体にページング機能がないからなのかな?
実装方法としては2通りあるみたい
・PagedDataSourceを使う
・コントロール使わずに実装する
PagedDataSource使うとすごく楽に実装できるけど、ページ表示するたびにDBのデータ全部読み込むのがちょっと、、、
件数少なければいいけど、多くなったらそのぶん処理遅くなるし。
まぁrepeater使わずにgridviewとかlistview使えばページング機能がついてるから、簡単に実装できるみたいですけど。
repeaterが一番自由度高くレイアウトの設定ができるので、とりあえずrepeaterでやりました。
実装自体はそこまで時間もかからずできました。
むしろ調べてる時間が長かった。
今の悩みは以下の通り
・セッションに入れるべきデータ、入れてもいいデータ、入れない方がいいデータの分類
⇨ページ遷移するときに遷移後のページにデータを渡したいときにセッションに入れるのかクエリ文字列として渡すのかって話です。
セッションの管理めんどくさいし、とりあえずクエリ文字列でええやーと思って色々渡してたら、あれこれダメじゃね?ってなところがあったので考え中
【.net】repeaterでページング実装【備忘録】
今やりたいことは、PagedDataSourceでページングしている箇所をObjectDataSourceに置き換えてページングしたい。
理由としては以下の2点。
1.ページングを簡単に実装できるのはPagedDataSourceだけど、ページングのたびにDBのデータ全て取得してくるので、件数が多くなったら速度が大幅に低下する可能性があるらしい。
2.ObjectDataSourceを使用すれば表示したい箇所のみテーブルから取得してバインドすることが可能なため、件数に関わらず速度を維持できるらしい。
だけど実装がちょっと複雑っぽくてめんどくさそう。
以下やらなきゃいけないこと
・ データアクセスコンポーネントの作成
・データアダプターの作成
・ページング用のメソッド作成