Zenn
😽

3ヶ月前の私へ

2021/11/30に公開
ポエム
新入社員
idea

はじめに

はじめまして、フロントエンドエンジニアの飯田です。

Magic Momentには8月にジョインし、早いもので3ヶ月が経ちました。

この3ヶ月の自分自身の振り返りを兼ねて、入社直後の私が知っていたら役に立ったなあ…と感じたことを書いていきたいと思います

弊社に興味を持たれているエンジニアの方々の参考になれば幸いです。

入社前、自信がなかった私

転職するか悩んでいた今年春、Wantedlyのスカウトがきっかけでカジュアル面談でお話を伺い「面白そうな会社だな」と興味を持ちました。

しかし、プロダクトで使われている技術がこれまでの私の技術スタックと異なることや開発メンバーが優秀な方ばかりであることから、果たして自分が入社しても技術的についていくことができるのか、組織に貢献できるのだろうかと不安を感じてしまい、選考に進むことを躊躇っていました。

そんなこんなで悩んでいるうちに1ヶ月が経過した頃、ありがたいことに再度連絡をいただき思い切って選考に臨んだ結果、内定をいただき現在に至ります。

入社後すぐ知っていたら役立ったこと

環境構築について

  • dockerの知識が全くない方へ
    • 環境構築の際、docker compose build や docker compose up を打つ前にDocker Desktop(アプリケーション)を必ず起動しておくこと
  • git submoduleについてどんなものか知っておくと良い

ローカル環境がおかしいとき

  • submodule の差分は出ていないか？
    • git submodule update
  • マイグレーション有無の確認
  • とりあえずコンテナ再起動
    • docker compose down してから再度 docker compose up
  • またはコンテナを再ビルド
    • docker compose down してから docker compose build → docker compose up
  • コンテナのログに何か出ていないか確認する
  • tsconfig.tsbuildinfo を削除してから docker compose build → docker compose up
  • 環境変数は足りているか？
    • .env.example と.env を確認する
  • PC再起動
  • それでもわからなかったら周りの方にヘルプする

たくさん時間をとられたこと

  • GitのSSH接続、Source Tree周り
    • 何度秘密鍵を作り直したことか
    • 別にSSH接続を使わなくて良いのでは（アクセストークン使用でいいのでは）
  • git submodule
    • 差分が出ているときはgit submodule update
    • sub module のブランチはpull してきた状態のままで良く、基本自分で変更しない
  • 環境変数が足りていない（.envを確認）
    • 知らないうちに環境変数が追加されていたりする
      • 正直把握できないので、このあたりは問題な気がしている

技術的なこと

実務経験があって理解に役立ったこと・助かったこと

  • Vue.js
  • Atomic Design

JavaScript

  • ES6以降の書き方
    • ES6以降の書き方ができないプロダクトに関わっていた経験からES6の書き方に全く慣れていなかったし、省略された書き方が読めなくて苦労した
  • if文は極力書かない、elseは基本書かない
  • 特に理解しておくと良いもの（プロダクト内に頻出）
    • 型の基本
    • 分割代入
    • 配列操作とその違い
      • Array.reduce
      • Array.map
      • Array.filter
      • Array.find
    • 非同期処理
      • async, await , Promise
    • スプレッド構文 ...Array
      • クローンとマージ
      • シャローコピーとディープコピーの違い
    • null合体 ??
    • 二重否定 !!
    • オプショナルチェーン ?.

React

  • 特に理解しておくと良いもの（プロダクト内に頻出）
    • フラグメント <></>
    • イベントプーリング
    • 型エイリアス
    • ルックアップ型
    • ジェネリクス型
    • Map型
    • 列挙型
    • React hooks
      • useMemo（プロダクト内超頻出）
        • Vue でいう computed に近い
      • useEffect
      • useState
      • useCallback
      • それぞれの第二引数についても理解する
        • 空にしておくとマウント時のみ実行される、など
    • Redux
      • re-ducks
      • 既存ファイルを眺めているとなんとなくわかる

CSS

  • 特に理解しておくと良いもの（プロダクト内に頻出）
    • flex
      • flex-basis
      • flex-shrink
      • flex-grow
    • white-space
    • word-break

VSCode

  • code コマンドをいれておくと便利
    • Shift + Command + p でコマンドパレット表示 → shell で検索
  • 拡張機能
    • Swagger Viewer

開発用語

ドッグフーディング（dogfooding）

社員が自社製品や自社サービスを日常的に社内業務で利用すること。もしくは正式リリース前の自社製品を社内テストで積極的に使用すること。
ドッグフード会社のセールスマンが犬用ビスケットを食べて質の高さをアピールした、というエピソードが由来らしい。

Design Doc

Googleのエンジニアがソフトウェアを開発する際に必ず書くドキュメントのこと。

CRUD

生成(Create)、読み込み(Read)、更新(Update) 、削除(Delete)

SRE

サイト信頼性エンジニアリング（Site Reliability Engineering）

Googleのエンジニアリングチームから生まれたIT運用に対するソフトウェア・エンジニアリングのアプローチ。英語版は無料公開されている。

https://sre.google/sre-book/introduction/

トイル（SRE用語）

サービスを稼働させることに直結する作業で、繰り返されたり手作業だったりするもの。

オーバーヘッド（SRE用語）

サービスを稼働させることに直結しない管理的作業。

ビジネス用語

フィールドセールス（アウトサイドセールス）

相手先を直接訪問し、商談を進めて受注へとつなげる営業手法。外勤営業。

インサイドセールス

相手先を訪問しない内勤営業。フィールドセールスの対義語。

トスアップ

優良な顧客を他の社員や部署に紹介すること。

リード

営業対象となる見込み客のこと。

アップセル

現在ある商品を検討している顧客や以前商品を購入した顧客に対し、より高額な上位モデルに乗り換えてもらうこと。

クロスセル

顧客が購入しようとしている商品と別の商品を提案し、購入を検討してもらうこと。

カルチャー

  • 周りの方は優秀な方ばかりだが、できない・わからないことを馬鹿にしてくるなんてことは絶対にないので、知らないことを恥ずかしいと思わずに何でも聞くこと
    • 逆にわからないことを聞くことは、今後入社された方やチームのためにもなるとポジティブな気持ちで！
  • アウトプットは小さなことすら大事
    • 社内はアウトプットに非常に好意的な環境
    • チーム関係なくFBをくれるのでどんどんすること

最後に

入社前から不安で仕方がなかったこんな私ですが、毎日業務についていくのが必死ながらも楽しく働かせていただいています。勿論技術的にはまだまだですが、知識が少しずつ増えていくことは楽しいですし、今後もプロダクトと共に成長していけたらと思っています。

Magic Moment では技術スタックが被っていなくとも、一緒に学びながら開発を楽しんでくださるエンジニアを募集しております。

8/30にはFindy様主催のイベントにMagic Momentから石田さんが登壇されます！
よろしければぜひご視聴ください！

さらに、こちらのイベントも8/29開催予定です！こちらはオンラインイベントです。Magic Momentの開発がどんなものか興味を持っていただいた方は是非ご参加ください！

Discussion