47
46

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Angular未経験者だった自分に教えたいこと

Last updated at Posted at 2018-01-26

はじめに

Angular 4/5を数か月使ってみて、
知識0のときに、これを知っていれば!という私的Tips 7つをまとめました。

1. Angularの公式サイトは日本語版がある

Angular未経験者が初めに読むのが公式サイトのチュートリアルかと思います。
https://angular.io

非常にわかりやすいです。*Angularすげー!*ってなります。英語でなければ

日本語のAngular記事では、上記が紹介されることが多いですが
公式サイトには、なんと日本語版があります。

angular.ioのURLを見つけたら、.ioを.jpに変換すると、幸せになれました。

2. npmの代わりにyarnを使う

  • yarnは、--saveし忘れがない
  • yarnはadd(install)がやたら速い
  • yarnのほうがトラブルが少ない
    npmを使用していたころ、Angular CLIのアップデートで依存関係エラーが頻発しました。
    よくわからない初心者の私は、yarnを使ったほうが幸せになれました。

3. とりあえずAngular Materialをいれておく

「見てくれ」がよくなるとレビュアーの顔色が変わります。
Angular Materialである必然性はないですが、公式サイトわかりやすいしね!
https://material.angular.io/

4. IEに対応しておく

AngularはデフォルトでInternet Exploreに対応していません。
いまさらIEなんて使ってるの?...いました。別組織にたくさん。
レガシーな人々のフォローは面倒なので、こちらで対応します。

IE対応

polyfiles.ts内の、IE対応コメントの指示に従います。
コメントに記載されているpackageもインストールします。

IE互換モード回避

ローカルNWにサーバを置くと、IEが 「社内だね!互換モードにするよ!表示できないよ!」
となる場合があります。
index.htmlの<head>に、忘れずに下記を記載しておきます。

index.html
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>

※下記、参考にさせていただきました。
https://qiita.com/rico/items/09c896290e218ed2b7c3

5. 検索するときには「-angularjs」をつける

「検索ワード」+「angular」でWeb検索すると、
AngularJSの記事が大量にでます。Angularの記事はほぼないです。

そこで、魔法のワード、「-angularjs」です。

[検索ワード] angular -angularjs

なんと、AngularJSの記事が除外されるではありませんか!

※下記記事にて勉強させていただきました。感謝です。
https://qiita.com/daikiojm/items/46f6b2b355f9f73536e1

6. Angular CLIでプロジェクトひな形を作成する

初期は公式チュートリアルのプロジェクトを改造して開発していましたが、
不要な機能を削除するのが存外大変でした。
下記コマンドで1から作り直しました。

# プロジェクト作成
ng new <プロジェクト名>

# コンポーネント|サービス作成
ng g <component|service> <コンポーネント/サービス名>

# コンポーネント作成(モジュール指定)
# モジュールたくさんあって、どこに作ればいいかわからないよ!と怒られた場合
ng g component <コンポーネント名> --module <モジュール名>

結果、サンプルプロジェクトを改変するより1から作成したほうが、
経験値が上がりました。

7. (番外編)DBはMongoDBを使う

Angularではありませんが、私の最大のミスは
バックエンドのDB選定でした。

初期に、Node.js + PostgreSQLを採用しました。
MongoDB?いやいや、PostgreSQLの方が慣れてるし~。あれ?××実装のNode.js + PostgreSQLの記事が見つからない!
Node.js + MongoDBの記事は山ほどあるのに!

結果、PostgreSQLのコードをすべて捨てるという事態に。

開発速度、Web情報量ともにMongoDBが圧倒しています。
リレーショナルDBである必要がなければ、まずはMongoDBをお勧めします。

おわりに

少しでも皆様の参考になっていただければ。では、すてきなAngularライフを!

47
46
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
47
46

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?