おじんブログ

Webアプリに関する知見とか雑記です

プログラミング2021年振り返り

プログラミング勉強

全体

自分はフロントエンド得意だと思っていたのですが、「標準のHTMLのフォームでデータ送信するときってどんな感じでやり取りするんだっけ?」「mimeTypeやHeadersって知っているけどどういう仕組みだっけ?」「Web Workerって?シングルスレッドって?」「PWAってどういうものだっけ?」と基礎的なことで詰まっていたため、改めてMDNのHTTPのドキュメントを読んでサンプル書いて勉強していました。

developer.mozilla.org

ブラウザで使えるAPIについても目について面白そうなJavaScriptAPICSSをCodesanboxで書いて試していました。 Codesandboxを使った理由として、WindowsiPhoneなどの別環境での挙動確認だったりHTTPSでしか動かないAPIを試すために毎回デプロイするのは面倒なので書いてすぐ公開、Webブラウザ上(=閲覧環境)で編集できるためです。

JSのライブラリを使わず素のJSで書いて解決できるとありがたい場面は業務でも時々あるのでこういう素振りは役に立ちました。

developer.mozilla.org

codesandbox.io

アウトプットのリポジトリ

業務では経験できないことをちゃんと学習しようと思ってフロントエンドを中心にサンプルをザクザク作っていました。

github.com

Vite と Redux の学習のために作ったリポジトリ。 このあたりからViteを使い始めたのですが、既存プロジェクト以外はViteで開発するのが主力になるんじゃないかと思う程ビルドが高速でConfigも楽で快適だと思いました。

github.com

去年Next.jsで作った映画を公開順で閲覧するためのサイトですが、GitHub Actions で CI を回せるようにしました。 CI/CD に入門するためにGitHub Actionsを使いましたが、本当に無料でいいの?というぐらい機能が豊富で簡単です。 公式ドキュメントを読んでもいいし、テンプレートを選んでそこからカスタムしてもOK。

github.com

Next.jsのStatic Generateを学習するためにSpace XのAPIを使って作ったサイトです。 外部リンクからの画像最適化ってどうすればいいんだっけ?と頭を悩ませましたがVercelにデプロイする前提で解決しました。 Next.jsはReactベースのフレームワークで、ドキュメントに従って書けばなんでもよしなにやってくれてかなり便利な反面、ECMAScriptの挙動やTypeScript、ReactのHooksの書き方など、基礎的な箇所は意識して勉強しないといいコードにはなりませんね。

仕事

現在の会社に転職して2年8ヶ月経過しました。 転職前は2年半在籍していたのが最長だったので、今まで一番長い期間在籍しています。

前々からTwitterで呟いていたのですが、転職を考えています。

理由としては自分がフロントエンドが比較的得意なのですがそれを活かせる場面がなく、テストコードやCIもなく開発体制もかなり古いというのがずっと続いているためです。 自分である程度社内を改善しなきゃダメだと思って社内研修をするなど頑張っていましたが、あんまり改善できなかったのと、上司から評価されなくて、疲れて諦め気味です。

30歳になったのですが、まともな業務での開発経験がRedmineWordPressプラグインVBAぐらいしかありません。 そのため、実務でフロントエンドができていないことがコンプレックスになりかけています。

そういう状況で趣味の学習を元手にフロントエンドの開発職を狙うのは絶望的かもしれませんが、頑張っていきたいです。

2022年やりたいこと

  • フロントエンドのトレンドのキャッチアップ
  • Rustの学習入門、ライブラリ作成
  • npmのライブラリの公開パイプラインの構築
  • BFFの構築とGraphQL入門
  • AWSGCPなどのインフラ構築
  • テストコードいっぱい書く

Rustに関してはJavaScriptのツールチェインがRustベースで書かれていることが最近増えてきたのと、TypeScriptは便利だけどそれ以外の型付きの言語を学習してみたいのと、WASMのパフォーマンスを調べてみたいためです。

npmに関してはnpm publishコマンドで公開してみたのですが、ヒューマンエラーが起きそうで怖いのでGitHub Actionsでmainブランチにマージされたらpublishできるパイプラインを構築して本番に近い形で公開できる方法を練習したいです。 ただ個人で開発しているライブラリならnpm publishで公開になりそうです。

テストコードですが個人プロジェクトだと書く気がどうしても起きないのですが、業務で保守性の高いコードを書くには必要なので、個人勉強の範囲で練習して慣れておきたいです。

まとめ

フロントエンドは移り変わりが激しいと言われていたのは昔で大体ReactかVueかその派生フレーワークを使うことがトレンドで固まっていて、今後もその流れは強くなると思います。 ただReact 18の新機能やSvelteの登場、Web版PhotoshopでWeb ComponentsのライブラリであるLitが使われているそうなので、最先端の部分では動きがあるんじゃないかと思っています。

web.dev

ただ自分はまだ業務では素のJSかjQueryしか書いたことがないので、Reactを使う現場に転職できるように頑張ります。

もしこれを読んでいるをReactを使ったフロントエンドエンジニアを募集しているところがあったらお声掛けしていただけるとありがたいです。

良いお年を!