key | value |
---|---|
Name | yamato |
GitHub | yama-t |
Qiita | @yama-t |
crieit | yama-t |
teratail | yamato_hikawa |
CodePen | yama-t |
@yamato_hal | |
Wantedly | yamato |
中学時代から趣味でWebサイトを編集・制作。Web上で知り合ったファンサイトの管理人とやり取りし、副管理人としてMessenger上でHTML・CSSを送ってアップロードしてもらう形で関わる。途中から、管理人としてFTPソフトを使って自分でアップロードするようになる。掲示板やブラウザゲームの運営でCGIやPerlにも触れる。
高校時代には自営業の両親のWebサイトも制作して公開。Webサイトの閲覧をきっかけとした流入を増やした。
大学時代にはWikiサイトの編集で、記事の新規作成の他、大量のマークアップが不完全な記事のマークアップ付与などを行う。 また、大学で意気投合した学部違いの友人の執筆した小説の編集とWebサイトでの公開を行った。
2011年に職場体験先の警備・介護系企業でのWebサイトを体験期間中の3ヶ月ほどで制作し、公開。
3年前に一度頓挫していた企画だったため非常に感謝される。その縁で2012年2月より入社。在職中は交通警備・施設警備を担当した。
それまでただの趣味でしかなかったWebサイト作りが、自分の力が最も発揮できる仕事だと再認識したことで、本格的にWeb業界への転職を志す。
半年間のWebプログラミング系の職業訓練を経て、2014年株式会社レイハウオリに入社。
3ヶ月のフロントエンド基礎研修により、JavaScriptの文法・構文理解に加え、プログラミング系の仕様ドキュメントが読解できるようになったことで、後のスキルアップの切っ掛けとなる。研修後は企業サイトのリニューアルやLP作成といったOJTを通じてGitHubやBacklog、Slackを使った一般的な開発フローを学ぶ。
社内ではesaでのナレッジ共有も行っていたが、大学時代のwiki編集の経験が活き、最終的に100以上の記事を作成。
入社半年後からは客先常駐として、飲食・予約サービスのフロントエンド開発に携わり、常駐先企業のフロントエンド部分のプロダクト改善施策に注力した。
2017年5月より、社会問題解決に貢献でき、加えてフロントエンドエンジニアが当時不在であり、自分のスキルが活かせる環境にあるという理由からCBcloud株式会社に入社。
配送マッチングサービス「PickGo」の3人目の開発メンバーとなる。
入社当初はコーポレートサイトの編集やサービス紹介ページの作成といった部分から入り、サービス本体のフロントエンド開発に携わる。
新機能開発や既存機能の修正の傍ら、利用者の増加によるパフォーマンス面、運用面での問題が大きくなり、フロントエンド領域だけでは解決できない問題が大きくなったため、新たに入社してきた専門のエンジニアにも教えを乞いながらMySQLやScala、Rubyの知見を深めていき、パフォーマンスチューニングやクエリ改善も行うようになる。
また、社員数増加に伴う、他部署からエンジニアへの依頼が多発する状況を改善するため、データ修正業務のシステム化、UI上から利用できるデータ集計の効率化といった形で社内運用改善を図り、開発業務効率化として一部業務の自動化も行った。
開発については、プロダクト開発に必要となる設計・UI・UX・テストについての知見を更に深めていき、基礎力を向上させたい。 その上で、プロダクトに必要な新技術を取り入れていきたい。
また、自分の考えをよりよい形でプロダクトに反映・実現するための企画力や仲間と協力するスキルを高めていきたい。
- 日本語
- ネイティブ
- 英語
- リファレンス、英語の質疑応答を読める
- HTML
- HTML5
- Slim
- CSS
- SASS
- Stylus
- ECSS
- JavaScript
- jQuery
- TypeScript
- Ruby on Rails
- grape
- RSpec
- Scala
- Play framework
- MySQL
- Jenkins
- GitHub Actions
- gulp
- grunt
- npm scripts
- Yarn
- React + TypeScriptのSPA
- CodePenに投稿しているサンプルコードの一覧
- Git
- SourceTree
- GitHub
- Slack
- Discord
- PhotoShop
- figma
- ウォーターフォール開発(受託・客先常駐)
- タスク管理:Redmine、Backlog、JIRA
- 成果物作成→開発・顧客納品(Zip, Revision)
- スクラム開発(自社プロダクト)
- タスク管理:Trello、Asana
- 社内での知見共有を積極的に行うこと。
- ドキュメント作成力。
- 学生時代にWikiコンテンツを5000回以上編集。
- 社内共有用の記事を300以上作成。
- ゲームの攻略Wikiの作成・編集。
- 少人数ながらゲーム系コミュニティのDiscordの管理人をしている。
- SlackやDiscordコミュニティでの質問には積極的に答えている。
2017/05 - 2020/07 : CBcloud株式会社
職務:フロントエンドエンジニア・バックエンドエンジニア
荷物を運んでもらいたい依頼主と、車で荷物を運ぶ仕事をしている個人事業主を直接繋げるマッチングプラットフォーム。宅配、ラストワンマイル配送に特化。下記のサービスを担当。
- PickGo for Business(荷主向け)
- PickGo for Driver(ドライバー向け)
- PickGo for Personal(個人向け)
- AWS, GCP
- Scala
- Play2 Framework
- Ruby on Rails
- AngularJS
- Vue.js, Nuxt.js
- GitHub, SourceTree, Trello, Asana, Slack
PickGoサービスのフロントエンド・バックエンド開発
- Slackで報告の上がった不具合・バグの修正
- 暫定対応しつつ、色をつけたり目立たせるなど、少しUIを変更するだけで改善が期待できるものはすぐ変更した。
- 書いてない・書いていても確認しづらい、と言ったものは早めに対応した。
- APIの挙動に問題があるものは問題箇所を特定次第、レビューを経て対応するようにした。
- 会議での決定事項やSlack・口頭で依頼された要望の実装対応
- 緊急対応が必要なものやすぐ終わるもの以外はタスクとして積み上げていき、上司に相談しつつ優先度を付けて対応した。
サービスLPの作成・修正・アップロード
- ToB向けのサイトで、デザインはあったものの、コーディングできる当初人間がいなかったため対応。用意されたものが水色基調でポップだったため、レイアウト・掲載情報は踏襲しつつ、黒・紺系の落ち着いた色合いに変更してリリースした。
- 元々存在したドライバー向けLPの更新対応。
- コーポレートページのリニューアル。各サービスLPとの関連付け。
データベースのパフォーマンスチューニング
- ユーザーの増加により、ピーク時間のパフォーマンスに問題が出てきたため対応。
- スローログから問題のあるクエリ見つけてexplainで確認。必要のないサブクエリを多用する結果になっていたり、インデックスが貼られていない条件で絞り込もうとして効率が悪くなっているクエリを発見・修正した。
エンジニアによるSQLクライアントを利用したサービスのデータ修正から、非エンジニアが行うシステム上でのデータ修正業務化への運用改善。
- Slack等で問い合わせがあり、サービス側の機能として用意していないものは都度エンジニアが直接データ修正していた。
- サービス側で使える修正機能を拡充し、直接SQLクライアントからデータ修正するケースを減らしていった。
エンジニアによるプロダクトのデータ集計業務から、非エンジニアでもデータ確認・出力・集計が可能なフローへの運用改善。
- SQLクライアントを利用したデータ出力
- 依頼された売上等の月間データを集計して、主にxlsファイルとして出力。
- Metabaseでデータを閲覧するためのクエリ作成
- 依頼→出力では効率が悪いため、非エンジニアでも都度確認・出力が可能なようにデータ閲覧・出力用クエリを設定。効率化した。
- Googleデータポータルを使ったグラフ集計・可視化
- 社長手製のCで作ったダッシュボードで業績を一覧・確認していたものを、Googleデータポータルを使った形に移管し、レイアウトやページ数の自由度・メンテナンス性を向上させた。
- リリース通知の自動化
- リリースが成功した瞬間にSlackに自動で通知が流れるようにした。
- プルリクエストのタイトルが更新内容としてそのまま使われるため、プルリクエストに適切なタイトル付けをする運用に寄せやすくなった。
- JenkinsでSlackにリリース情報を流すのを自動化した
- リリースブランチ作成→プルリクエスト作成の自動化
- 「リリース用のブランチを作成後、GitHubにそのブランチに対するプルリクエストを手動作成する」という手順を毎回行うのは手間だったため、一連の動作を1ボタンで完結できるようにした。
- Jenkinsを使って特定のブランチ+そのブランチからmasterへのPR作成を自動化した
- コロナ禍前、昼食をほぼ毎日エンジニアメンバーと一緒に行ってコミュニケーションを取っていた。
- 後輩にCSSの余白の取り方について質問されたので、Qiitaで記事を書いて共有した所、かなり閲覧数が伸びて週間ランキング入りした。
- GitHubの各リポジトリのWikiに最初のセットアップ方法と障害時の対応方法をまとめた。新しい対応が増える度に更新も行い、暗黙知を減らし、必要な際には該当ページの閲覧を促し、適宜確認できるようにした。
- 勉強会での知見共有。記事にまとめてメンバーに共有したり、以前書いた記事を紹介することで、普段あまり記事を書かないメンバーがQiitaや社内Wikiに技術記事を書くきっかけにもなった。
- Nuxtを使ったアプリ開発時に、VSLiveShare機能を使ったペアプロで開発を進めた。
職務:フロントエンドエンジニア
LP作成
- 2週間ほどの短期案件。
- スムーズスクロール、アコーディオンを利用した詳細表示の実装。
サイトリニューアル
- 既存サイトのリニューアル。
- SASS(Compass)の利用。
- KSSを利用したスタイルガイドの作成。
開発環境
- HTML, CSS, Javascript, jQuery, grunt, gulp
- GitHub, SourceTree, backlog, Slack, esa
本番のJSP組込前のHTML、CSS、JSファイルの作成。
- 既存ページのフロントエンド改修。バグ修正。
- イメージマップを使い、マウスホバー、タップで部分的に表示が切り替わるLPの作成。
- 記事:イメージマップの出力
開発環境
- HTML, CSS, SCSS, Stylus, JavaScript, jQuery, Assemble
- SVN, Redmine→JIRA, Hipchat→Slack, Confluence
本番のJSP組込前のHTML、CSS、JSファイルの作成。
- 自動で画像が切り替わるカルーセルのインジケーターの挙動の改修。
- インジケーターに画像がサムネイル表示され、画像切り替えに合わせてスライドするタイプだったが、スライドするタイミングに無駄があったため、必要のないタイミングを削った。
- スマートフォン画面で、一覧の画像をタップしてモーダルで詳細情報が出るコンテンツの改修。
- モーダル表示時、左右スワイプ or 矢印タップで次の画像・前の画像に切り替えられるように実装した。
- 顧客向けスケジュール機能のUI実装。
- カレンダーアプリのスケジュール機能のようなものをHTML、CSS、jQueryでUI実装した。
- それまで採用していなかったSlim + Railsの開発環境をチームメンバーに導入しやすくするため、手始めの段階をドキュメント化。
- サイトリニューアル後のUIをfrontnoteを用いてスタイルガイド化した。
- チームメンバーのJavaScriptおよびjQuery研修の講師。
- 社内でのJavaScript研修を受けずに客先常駐に入ったメンバーに対しての教育と、チームメンバー全員のJavaScript基礎力の底上げを目的とした研修。
- esaに記事を書いて共有し、それを使って講義を進める形式で行った。
- 学んだことをesaの記事にして共有
- 業務上必要になった知識・勉強会に行った際の内容の共有などを200記事ほど執筆。
- コードレビュー
- JavaScriptのコードを見て、コーディング規約的に良いか、変数名が適切か、行いたいことに対してロジックに無駄がないか、といったことを確認してレビューした。
開発環境
- HTML, Slim, CSS, JavaScript, jQuery
- Ruby on Rails
- SVN, GitHub Enterprise, JIRA, Slack, Confluence
職務: 交通・施設警備員
- 自社のウェブサイト制作・公開(製作期間:3ヶ月)
- 必要な写真の撮影
- 交通誘導
- 病院の施設警備(受付・夜間巡回)
GoogleDataPortalの使い方 - Qiita
https://qiita.com/yama-t/items/0dfa954aa1a7239ad7a7
フロントエンドのプロ直伝! CSS余白設定の三原則(+線の引き方) - Qiita
https://qiita.com/yama-t/items/da7740769cfc0f8446a0
【Nuxt】ページとコンポーネントの関係と管理について - Qiita
https://qiita.com/yama-t/items/e25fd0874f816c515c0c
CBcloudにフロントエンドエンジニアとして入社して行ったこと - Qiita
https://qiita.com/yama-t/items/1abb493d06f5b7ffed1e
フロントエンドエンジニアの限界をこえて - Qiita
https://qiita.com/yama-t/items/6d51577a4aa359e07616