AngularJSとは

NO IMAGE

 

みなさん、こんにちは!突然ですが、もっと自由に生きたいと思いませんか??寒い冬は南国のビーチで過ごして、お正月は日本に帰って、夏は涼しい国にいって…そんな生活をかなえるためには、パソコンを片手にフリーランスで働くのが一番なはず!そこで、ここではカッコいいフリーランスのプログラマーになるための第一歩として、ちょっとしたコツや、達成するためなどの道のりを紹介できたらな、と思います。私自身は、大学でプログラミングの基礎を学んだだけで、プログラミング社会人1年目です。オブジェクト指向とか、クラスとかの知識はあるけど実践力はまだまだ。これからしっかり勉強して、一緒に自由に生きれるように頑張りましょう!

とはいっても、プログラム言語は種類があって、何から勉強したらいいのかさっぱり。やはり勉強するなら暗いところカチカチ、ハッカーみたいなイメージよりは、明るいところでカッコよく働けるほうがいいですよね?それならきっとデザイナーと近く働けるフロントエンドエンジニア(WEBデザインとか)がいいはず!そこで、私はAngularJsを勉強することにしました。

 

AngularJSとは?

AngularJSはGoogleの開発したフレームワークです。代表的なものだと、Gmailで使われているそうです。AngularJSの基本的な情報はWEB上であるけど、ちょっと全体的な構図がつかみたいっていうときには、なかなかいい教材がありません。それにあっても少し情報が古かったり。そこで、AngularJSについて理解の深まるサイトや、ちょっとしたコツなどをできるだけ簡単に説明します。英語のサイト読むからいいよ。という方はこちらにAngularJSのサイトがあるのでリンクを張っておきます。まだ内容は、ほとんどありませんが。少しずつ足していく予定です。よろしくお願いします。ここで紹介するのは主にAngularJS 1.5 とTypeScriptの組み合わせです。

  1. [AngularJS] OrderByでIPアドレスをソートしよう
  2. [AngularJS] Infinite $digest Loopのエラーがでたらどうするか
  3. [AngularJS] 文字列をenumに変換したい時はテーブルを使う

4. q.defer はいらない!!お勧めの記事!

プログラミングのちょっとしたコツ

動かす事だけを考えて、プログラミングをすると、スパゲッティコードになってしまい、可読性も落ちるし、バグの原因にもなります。幸運にも僕の会社の人たちはみんなスーパープログラマー。彼らから習ったことをメモとして残しつつ、みなさんに紹介していきたいと思います。HTML, CSS, TypeScript, AngularJsごちゃまぜです。

1.クラスにsetValue, getValueのメソッドをよく作ると思うけど。updateValueも作ろう!setValueはユーザー側から値を変更したいときに。updateValueはバックエンドからデータが届いたときに利用しよう。

2.利用しているメソッド名が長すぎる?そんなの気にしないでOK.わかりやすいメソッド名をつけて、やっていることと、名前が一致するようにしよう。uglifyJsっていうライブラリがあって、これを使えば、どんなに長いメソッド名とか、クラス名でも、Aとかに変換してくれます。

3.理解してないメソッドは絶対使わない!他からコピーしてきて、試行錯誤の上なんとか動くようになったプログラム。その中に数行自分の理解してないメソッドがある場合は、もう一度よく理解するまで、コードを見てみましょう。プログラミングでコピペは禁止です。そもそもコピペするなら、サービス(AngularJS)として切り離して、再利用しましょう。

CSSのコツ

1.CSSセレクタを使う際には、なるべく>を使わないようにしよう。スペースを使う事。CSSを書くときは、なるべく一つの変更が広範囲にわたるように書くべき。

2.できるだけImportant!を使わないようにしよう。全体を変更したくても一部が変更できなくなる可能性があるため。

4.画像を横並びにする場合は、親要素のfontsizeを0にしよう。(CSS)

5.AngularJSのオリジナルなタグを作る機能で、CSSのためだけに、タグを作るのはやめよう。そういう時は、クラスを使うこと。コンポーネントなのか、ディレクトリなのかCSSなのか分からなくなってしまうため。

JIRAの使い方のコツ

1.QAにテストしてもらうために、目に見えるバグはちょっとした変更でも、JIRAに投稿しよう!