フリーランスフロントエンドエンジニアが2020年を振り返る

2020年初から新型コロナウイルスの流行により、世界中で普段通りの1年は過ごせなくなるような1年でしたね。

生活様式がガラリと変わったこの1年について、自分がどういうことをしていたか振り返ってみます。

フリーランスエンジニアとして

2019年9月にフリーランスになったため、1年以上をフリーランスとして生き残る事ができました。

2020年はフリーランスエンジニアとして計4社のクライアント様とお付き合いさせていただきました。

業界、会社の規模の大小、扱う技術などそれぞれ違いを肌で感じることができ、1つの会社で勤め上げていては経験のできないような知見を幅広く得ることができました。

フルコミットだけでなく週3、週2で並行稼働をさせていただいたり、週5勤務の傍で1日数時間副業ベースでお仕事をさせていただいたり、時間の使い方や融通をどう利かせるか、非常に勉強になった1年でした。

体感としては週5フルコミットの方がスイッチングコストの少なさやお任せいただける案件の粒度(腰を据えて取り組めるかどうか)の面で優れているなと感じたので、2021年も方針は継続したいと思っています。

1社目

フリーランスになって初めてご契約させていただいた会社で、新聞のWeb版を更新・新規機能開発をするお仕事でした。

バックエンドのテンプレートエンジンに集中していたリソースを、責務の分離・開発サイクルの高速化を行うためVue/Nuxtを使ってのリプレースに取り組んだり、デザイナーさんと共同で既存ページのリニューアルをしていました。

コンテンツも非常に多かったので、数ヶ月スパンで各コンテンツにリニューアルをかけていくのは日々新たな発見があって楽しかったです。

4月からはコロナウイルスの影響で原則リモートワークとなりましたが、ある程度お仕事に慣れた状態でリモートワークに移る事ができたのはロスが少なくよかったことかなと思います。

技術的にもチャレンジングなことをしてみようという環境であったので、ご縁があればまた協働させていただきたいなと思っています。

2社目

地方創生BtoBコミュニティプラットフォームを開発するベンチャー企業様とのお仕事でした。

ベンチャーらしくスピード感があり、ベータ版から正式版へのリリースの間にデザイン、フロントエンドアーキテクチャのブラッシュアップに取り組ませていただきました。

案件内で素のReactからNuxtへの置き換え -> やっぱり既存資産を生かすためNextへ置き換えというシフトチェンジがありましたが笑 モダンフロントエンドの知見を広げる良いきっかけになりました。VueよりもReactの方がいいと思うようになったのもこの頃です。

フルコミットしたい私の意向と予算の都合で契約は満了となってしまいましたが、コロナ禍で地方創生を目指す機運は高まっていると思うので今後のご活躍が楽しみな企業様でした。

3社目

現在もお付き合いさせていただいている企業様で、オンライン教育事業を手がけています。

昔から僕が好きなコンテンツを提供されていた企業でもあり憧れの企業様と協働できることを嬉しく思っています。

現在はメディア周りのリファクタリングに取り組んでいるのですが、ただのWebページよりも難易度は非常に高く感じていて、JavaScriptの基礎を見直さなくてはと痛感しています。

プロパーのエンジニアの方々、参画されているエンジニアの方々のレベルも非常に高く、なんとか自分の実力が見合うようにと必死です。

4社目

父の事業のお手伝いとしてWeb制作及び保守をさせてもらっています。

ホームページのリニューアルと題して、技術について当初はNuxtで静的サイト生成&Netlifyにホスティングさせるように組んだのですが、ドメイン周りの変更に難があり、結果旧サイトで使っていたWordPressでのテーマ開発しなおし&デザインは発注することになりました。

デザインスキルも身に付けなくてはいけないなと...WordPressはちょこちょこキャッチアップしていければ良いかなと思っています。

利用技術まとめ

HTML/CSS/JavaScriptは当然のものとして割愛。
フォーマットはpotato4d氏のこちらをまねさせていただきました。
業務と個人開発で使ったことのある技術を羅列しています。

• Language/Platform
  • TypeScript
  • Web Components
  • jQuery
• JavaScript Framework
  • React
  • Next.js
  • Vue.js
  • Nuxt.js
• UI Library
  • Material-UI
  • Vuetify
  • Chakra UI
  • lit-html
• Styling
  • Sass
  • styled-components
  • emotion
• API Layer
  • axios
  • Firebase
• Build Environment
  • Webpack
• Developer Experience
  • ESLint
  • Prettier
• Testing
  • Jest
  • React Testing Library
• Firebase
  • Firestore/Authentication/Storage/Hosting/Functions
• Backend
  • PHP(WordPressをちょっとだけ)
  • Golang(触っただけ)
  • Velocity
  • GraphQL
• データベース
  • MySQL(Google Cloud SQL)
  • PostgreSQL(Heroku)
  • Cloud Firestrore
• ミドルウェア
  • Hasura GraphQL Engine
• アプリケーションサーバー
  • Google App Engine
• 静的サイトホスティング
  • Vercel
  • Netlify
  • Firebase Hosting
• HeadressCMS
  • Contentful
  • microCMS
• IDaaS
  • Firebase Authentication
• UI Design
  • Figma
• 概念的なもの
  • JSX

羅列すると長いですね笑

2020年序盤はVue/Nuxtを中心に使っていましたが、Reactを知ってからはVueより圧倒的にReactの方が書きやすい、理解しやすい、TypeScriptフレンドリーという事がわかりReactを主軸にすることとしました。

Vueは確かにHTML,CSSが書けると書き味が良さそうに見えますが、templateに型補完が効かなかったりemitやv-modelなど双方向に影響を与え合うコンポーネントが書けるため修正の影響範囲が意外なところから発見されるパターンが起こりえて辛みも感じました。

2020年はNext.jsの盛り上がりが顕著で、2021年に個人開発をするならVercelでホスティングしつつNext.jsの恩恵に乗っかるのが間違いがないのかなと思いました。

また、業務でWeb Componentsを使う機会がありましたが、Shadow DOMの概念が難しかったり、開発手法はまだまだ確立されていない印象を受けました。

触っててかなり難易度が高かったなと記憶していますが、今後主流になるようなら確りとキャッチアップしたいです。

2021年はWebフロントエンドに留まらずReact Nativeでスマホアプリ開発に挑戦したりNode.jsを学習してバックエンドまで作れるようになりたいと考えています。

プライベートの話

家族の話

今年の3月に無事に娘が誕生しました！

スクスクと順調に大きくなってきていて、毎日かわいさが更新されていきますね。

それに伴い最近引越しをして、娘を育てやすい環境に移りました。リモートワークが中心になったので必ずしも交通の便がいいところに住む必要がなくなったのは一個人の話としてはコロナの不幸中の幸いかもしれません。

娘は「ママ」と喋れるようにはなりましたが「パパ」はもう少し時間がかかりそうです。

平均的な赤ちゃんよりも成長が速そうで、寝返りもお座りもハイハイも伝い歩きもすぐにできるようになっていました。天才かもしれません。親バカですねw

来年は手を繋いで公園でお散歩とかできるようになったらいいなぁと思っています。

サッカーの話

今年はコロナ禍でFC東京のサッカー観戦にスタジアムまでは2月までの2試合しか行けなかったのが残念でした。(ACLの2試合なのでJリーグは見れてない)

年明けのルヴァンカップ決勝はなんとか見に行く事ができるので、コロナをもらってこないように気をつけつつ優勝に向かって闘うチームを見届けたいと思います。

個人開発の話

4月頃にJリーグスタグル名鑑というWebアプリをリリースしました。

しかしながらコロナの影響で今年はスタジアムグルメの提供に制限があり、自分自身もスタジアムまで行けていないということもあり盛り上がりはほぼほぼ無い状態です。

アプリ開発にも時期や旬、時勢によって影響を受けるということを身をもって学びました。

その後もちょこちょこと趣味で開発を進めましたが、リリースには至っていないもの(リリースしたけどすぐ閉じたもの)ばかりなので、Webアプリで何かちゃんと運営できるものを開発したいですね、、何かちゃんと運用できるアプリを作りたいです。

また、このブログをNext.js×TypeScript×microCMSの技術スタックで開発しました。(執筆時点ではまだ未完成ですが)

Nuxtで作ったブログよりもパフォーマンスがかなり良くなっており、Next.js、Vercelはかなり伸びそうな実感を得ています。

このブログを作るにあたり00:00 Studioというサイトで毎日作業配信（ライブ駆動開発）をすることにしました。

人に見られることによって作業進捗へのモチベーションを維持しています。

習慣としてかなり良いと思うので、ブログの開発が終わっても続けていきたいですね。

参考）Qiita: 生放送駆動開発を1000日やったら進捗出たのでみんなもやろう！

お金の話

フリーランスに転身してからサラリーマン時代より見た目上のお金は多く入るようになったので、投資を勉強して投資信託や米国高配当ETFを積立購入しています。

税金や投資などを知ると、これまでの浪費が本当にもったいなかった、社会人になってすぐ投資を始めておくべきだったと後悔するくらいでした。

特にふるさと納税はもっと早くやるべきでした。得しかしない制度ですね。

フリーランスにとって退職金は存在しないのでiDeCoや小規模企業共済などを使ってうまく節税・老後の資産形成をしなくてはと思っています。

楽天経済圏にどっぷり浸かることでポイントで生活費を支払い、支出を最適化してより自由に過ごせるように来年も頑張りたいと思います。

FC東京＆西武ファンですが5と0のつく日の前日は楽天・ヴィッセル神戸に勝ってもらってもいいかなと笑

終わりに

2020年もあっという間に過ぎました。

仕事にもコロナの影響はありましたが、リモートワークを中心にしたことによってワークライフバランスはかなり向上したと思っています。

通勤ってストレスなんだなぁ...というのと自分が朝9時前にオフィスに着いて仕事を始められるような体にはできていないという事がよくわかりました笑

2021年も引き続きコロナの影響は残り続けそうですが、自分も家族も健康には気をつけて過ごしていきたいです。

いちエンジニアとしても来年はさらにスキルアップしていきたいです！