エンジニアのひよこ_level10

毎日更新してた人。たまに記事書きます。

Vue.jsの勉強始めてみました。【470日目】

Vue.jsの勉強始めましたよ!

前回の一週間振り返りで、フロントの勉強しなきゃなってことでVue.jsの勉強始めてみたよ!

どうやってるの?

公式がチュートリアル動画+環境用意してくれてるから、それをやってるよ。

scrimba.com

どんな感じ?

Vueの環境は、scriptタグでjsをDLさせればいいから簡単。(手持ちの環境に用意してもいいけど、面倒なので一旦そうすることに。)

<span v-if="seen"> <li v-for="todo in todos">とかで要素の表示非表示、データの一括表示とかができるのはかなりいいね。

jQueryで書いてた身としては、コードの管理がしやすくなっていいね。

じつはちょっと詰まってる

v-bind:key の意味がまだわかってない。
公式ドキュメント読んでもわからない・・・

でも、軽く使う文にはまだ意識しなくても良さそう。チュートリアルを軽くやる文には、Vueは本当にわかりやすい。

後輩に質問したら、 v-forで生成する仮想DOMに対してidみたいなのを割り当てる、そのkeyを何にするかみたいな話っぽい。

ココらへんは、一度チュートリアルを全部見てから理解しようと思った!

Laravel登壇もあるので、勉強に割く時間は少ないけど、少しずつ勉強しようと思います(‘ω‘ )がんばるぞー!

if文が増えそうなときには、ファクトリーメソッドパターン思い出したいって話【469日目】

リファクタリング後の他の方のコード読みました

ファクトリーメソッドパターンだー(;・∀・)

なんでだろうって考えた

if ($xxx = 'aaa') {

} else if ($xxx = 'bbb')

....

これはif文が増えていく・・・

switch文でもそうですね・・・

クラス化したよ

なので、if文内の関数をクラス化したよ。

これで$xxxを実装がされてるクラスにすればおしまいだね!

デザパタ勉強したい

こういうような、あるときには何をしたらいいか、ってのはみんな通る道で、いい回答が溢れている。

それがデザパタなのですがー

ちょっと勉強しただけだととっさに出ないので!

もっとデザパタ意識し続けながらコードを書きたいですね(`・ω・´)ゞ

【登壇準備】スライドに画像と色つけと、コード貼り付け【468日目】

もくもく会行ってきました!

毎週木曜日のもくもく会。いつものです!

willgate.connpass.com

作業内容、スライド作成!

ってことで、作業はやはりスライド作成です!

前回、大まかなスライドを作成したので、順々に肉付けしていきます。

肉付け・画像

さあ、まず画像ですね。

githubからコードのスクショ。

あと、一部元コードがあるのは、エディタでスクショ。

画像のアクセント

『質問』『疑問』など、読者に○○な気持ちになってスライドを読んでほしいってときは、イラストを使いましょう。

例えば、クイズに対して考えてほしいとき。それは考えるポーズの画像。

例えば、驚いてほしいときには、驚いた顔の画像。

こんなふうに、何を伝えたいかを一瞬でわかるように画像を付け足しましょう。

コードを貼るときのアクセント

コードを貼るときには、コードを読ませるのは大変なので、コードで何を伝えたいかを日本語で。

if文で何をしているかを伝えるなら、コードそのままじゃなく、コードの意図を書こう。

コードの意図だけ書くと、なんの話かとっさにわからなくなるので、コードのスクショはあったほうが良さそう。

今日の進捗は?

スライド20枚あったのが、13枚くらい画像とか付け足すことが出来ました!

なので、2/3くらい終わったので、次回もくもく会にはスライドの一旦完成ができそうです。

来週にはスライド完成+練習、再来週にはフィードバックもらいながら練習・ブラッシュアップですね。

作業は順調!これからもがんばりますヽ(=´▽`=)ノ

【Laravel】遅延プロバイダのキャッシュ対策【467日目】

遅延プロバイダの開発してました

サービスプロバイダを新しく定義する開発をしていました。

そのサービスプロバイダは、インターフェースと実装をbind結合させるだけの簡単なものだったのですが・・・

レビューしたら、動かない。コード書いた人はテストして正しく動いたっていう。なぜだ。

・・・キャッシュだ。

遅延プロバイダのキャッシュ

Laravelで遅延プロバイダするときには、providesに対象となるクラスを書くのですが、それは実はキャッシュされてたりします。

なので、遅延プロバイダ書いてるときにうっかりそのままだと正しく動かない可能性が。

なので、テストするときにはキャッシュを消しましょう

キャッシュを消すコマンド

```php artisan clear-compiled```

これで今回問題となるキャッシュは消せます。

問題となったキャッシュ

`bootstrap/cache/services.php`を消したら正しく動きました。

リリース時、テスト時はキャッシュ消し忘れてないかちゃんと確認しましょうね・・・!

ローカル環境でページにエラー出てないかをテストしてみる【466日目】

エラーをシェルでテストしたい

作ったウェブページで、エラーが出てるかテストしたかった。

でもブラウザで毎回何度もurl叩くのが面倒。

シェル作ろう。

curl

よし、curlだ!

単純なlocalhost

curl localhost

httpsで、ダミー証明書対策

curl -k https://xxxx.com/

ヘッダーだけほしい

curl -I http://xxxx.com/

何が嬉しい?

ページで500番エラー出そうだけど試すの面倒・・・ってときは、適当なURL用意して、headerで200がちゃんと返ってくるか確認すれば、簡単にテストができるね!

このときに、キャッシュの消去とかを毎回間に挟みたいとかでも、コマンドでやるから簡単!

こういう単純作業は積極的に自動化していきたいね。

【Laravel】stringやnumericのバリデーションのときにnullでエラー出る対策【465日目】

こんなときに使う

Laravelのバリデーションのときに

'name' => 'string',
'age'    => 'numeric'

こんな感じにバリデーションをかけたとき。

これ、値が空にして送信されたら、nullが来ますね。『文字列じゃないよ!』ってエラーが出ます

nullableを追加する

'name' => 'nullable|string',
'age'    => 'nullable|numeric'

これで、空の値も許可、そして入力されたらstringとかのバリデーションがかかります!

バージョンは5.3から

ちなみに、このバリデーションはLaravel5.3から追加されました。

5.3から追加されました・・・

お気をつけください・・・(T_T)

【一週間振り返り】登壇準備進めれた一週間だったよ【464日目】

1.今週一週間の感想(ざっくり)

登壇準備頑張った一週間だったよ!

2.良かったこと

  1. 登壇準備、一通り話せるレベルにはスライド出来た

  2. まだ記事に出来てないけど、プログラミングの発見・勉強も出来た

  3. 引っ越し準備も進めれたよ!

3.もっとこうしたかったこと

つ、疲れた・・・

ほどよく休みを取りたいところ。

4.新しく気づいたこと

フロント周りの勉強、知識量が圧倒的に足りてないことに気がつく。

私そういやjQueryしかかけない。JSフレームワークとか何もしらない。

なにか勉強し始めたいね。

5.来週したいこと

登壇に向けて作業は引き続きやるよ!

JSフレームワークについて、少し学ぶとっかかりを手に入れたい。

6.その他

大学時代の友人と新年会行きました!

友人は変わらない感じで安心感ありました。

どれくらい変わらないって、開口一番、『太った?』って言う辺り。
彼女のキャラとして確立してるから、むしろ安心感あったわ(^o^)

・・・痩せなきゃ・・・

【登壇準備】伝えたいことを疑問形にして、導入作成【463日目】

伝えたいことを縮める。まとめる

1. コントリビュートは簡単だ
2. コントリビュートはいいぞ

たぶん、言いたいことはこれ。

主題は?

みんなもコントリビュートをやってみよう

伝えたいことに対する疑問を書く

  1. コントリビュートって難しそう
  2. コントリビュートって意味あるの?

まとめて説明してみよう

コントリビュートという言葉を聞いたことがあると思います。

OSSコントリビュートと聞くと、なんだか難しそう……あるいはやってなんの意味があるの?と思う方も多いと思います。

ですが、新卒2年目の私でもLaravelのバグを直してコントリビュートできました。そう、難しいものではないのです。
それは楽しかったですし、勉強になりましたし、実績にもなりました。ここに立つことが出来たのもコントリビュートのおかげですね。

こう聞くと、気になってきませんか?
Laravelは結構綺麗に書かれていて、コントリビュートのチャンスは山程あります。

最近新卒1年目の友人も、Laravelコントリビュートしました。

今日は、この新人O君の話を話を通じてみなさんに、
明日からLaravelのコード読んでみようかな?プルリク出してみようかな?そう思ってもらえるように、お話してみようと思います。

導入仮作成

ってことで、導入が仮作成できましたわーい!

文字だけだと軽く流してしまいそうなので、
ここから絵とかを用いてインパクトを強めていきましょう!