弊社では週に一度、1時間の技術共有会を行なっています。最近のTechなニュースや気になること、仕事の役に立ちそうな情報など、ざっくばらんに共有する会です。
4月から、週ごとにテーマを変えて実施！
今週は「初心者向け」をテーマに話しました。

作業時間を「３分割」にすれば大幅に効率向上！

タスク分解って何気なくやっている人もいるよね、、というところから記事の紹介。

記事の例では、報告書を作成する際 「構成を検討するのに5分」「作成に20分」「確認に5分」というふうに分解しようとある。
政策に置き換えると、「私用の調査どれくらい？」「作業どれくらい？」「最後の実装や確認にどれくらい？」など分解して考えよう

タスク分解したらより効率的にできる！
「だいたい1時間くらいかなぁ」ではなく、なにをしなきゃいけないのかを詳細に展開して考えて見積もりを出そう！

参考：仕事がデキない人は業務分解できていない…作業時間「3分割」すれば大幅に効率向上

仮想 DOM について

今後react触る人もいるだろうから、DOMやレンダリングなど理解しておこう。
まずはリアルDOMと仮想DOMがあること、仮想DOMを使うと差分を検出することができ、該当箇所のみを再レンダリングすることが可能です。非常に基礎的な部分なので覚えておきましょう！

【23新卒の社員から先輩社員に質問！】

Q. なにも考えてないと（useeffectを使えてないと）最初に無駄なレンダリングが走ってしまう、、、
その確認も開発者ツールで見れますか？console.log書きまくって確認してます…💦

A. 見れます！
開発者ツール「レンダリング」の該当箇所にチェック入れたら再レンダリング起きた箇所が青くハイライトされるから見れるよ！

参考：新人フロントエンドエンジニアが仮想 DOM について色々調べてみた

振り返りと報連相は大事

当たり前だが、仕事の質をぐっとあげるために先輩社員からアドバイス。
弊社でおこなっている週次報告は、主に「振り返り」が目的。

• 週に1回振り返りを行おう

  • うまくいったからさらによくするためには？

  • うまくいかなかったら次はどうすればいい？

→評価者も認識しやすく、評価時のアピールにも繋がる

参考記事：週にたった1回の〇〇で、仕事の質がグッと上がる。15分あればできる3つの「週1習慣」

有名IT企業の研修資料

Qiita記事にまとまっているのを発見。
GWは過ぎてしまったけれど、参考にしてみるといいかも。

clip-pathを使ったレスポンシブ対応や透過できる三角形の作り方

clip-pathジェネレーターがとても使える

【使い方】

1. 三角形作る

2. 下にコード出てるのでコピー

3. 以上！

【いい点】

• 色がbackgroundで決められる

• 幅高さに%が使える

• borderで作る三角形より扱いやすい

※clip-pathは三角形に限定されずいろいろ作れる
※形が可変しないものはborderでよい

２時間かけてスケジュールを立てよう

1. 目標となるXデーを決める

2. 2時間かけてスケジュールを作る

3. 絶対に守る

じっくりスケジューリングしたら愛着湧いてしっかりやるはずだよ！ 習慣化してがんばろう！

参考記事：２時間かけてスケジュールを立てれば、勉強も仕事もうまくいく