フリーランス チャレンジ!!

フリーランス チャレンジ!!

週休4日制に俺はなる!

AngularJs難しいけど、ログ出力したら少しわかりやすくなった話

f:id:ksakae1216:20080617095852j:plain

どうもコウタロウです。

 

今日はタイトルについて。

 

 

AngularJs難しい

いや〜、やっぱAngularJs難しいな〜。

 

特に、今やってるのがAngular-Gantt

www.ksakae1216.com

 

常駐先のプロジェクトでなんとこのAngular-Gantt使ってるんですね。

有識者がいるわけでなく、今回の業務アプリケーションでガントチャート使いたいとのことからこのライブラリを導入。

 

私は導入が決まって、モックとして動いているのをアプリとして組み立てています。

 

とにかく情報がなく、既存機能以外の要望に関しては一から作成するという難しさ。

 

既存機能はガントタスクをドラッグして移動するだけですが、クリック選択で移動したい箇所に再度クリックすることで動かしたい場所に動かすなど。。。

 

正直そんなにAngularJsも経験がないのにハードルが高すぎる

  • (´Д`υ)

 

思った通りの順番で処理されない

既存のドラッグ以外にクリック用の機能(関数)も作成したんですけど、なぜかドラッグして動かしている最中にクリック用の関数も勝手に動く!?

  • ヘ(゚д゚)ノ ナニコレ?

 

結果的にはドラッグした時に、クリックされているのでまあ、動いて当たり前なんだけどハマった。。。

 

ログ出力したらわかりやすくなった

試行錯誤しながら毎日コード書いてたんだけど、ふと閃いた!!

  • ゥォー!ヽ(゚д゚ヽ)(ノ゚д゚)ノ ウォー!

 

「そっか、ログ出力してコンソール見ればわかりやすいんじゃね!」

 

それぞれの関数の最初と最後、他にも気になる箇所の変数を"console.log()"で出力しまくった。

 

そしたら、「へぇ~、なるほど、なるほど」と1つずつ不明点が解消されていく!

 

JavaScriptでログ出力なんて考えもしなかったけど、Javaとかのプログラムと一緒だもんね。

わからなければログ出力すればわからないこともなくなるよ!!

 

※ちなみにAngularJsはログ機能も備えてるみたい

AngularJS: ログをコンソールに出力するには?($log) - Build Insider

"console.log"よりもこの方が見やすいしいいね!

 

あと、コレも知らなかったんだけど、圧縮版のJSじゃなく、開発時は通常のJSを使えばいいっていうのも知らなかったよ。

AngularJS 開発時は圧縮版は使わない - OZACC.blog

 

最後に

どうですか?

もし私と同じくAngular難しくてあまり好きじゃないあなた!!

 

試しにログ出力して下さい。

きっと好きになるよ!!