1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

フレームワークって何?おいしいの?

Posted at

はじめに

私もあまり新しくない人間で、最近までjQueryをゴリゴリ使いフロントエンド開発を続けてきました。
jQueryの良いところは何でも思い通りに表現できること。
悪いところは一つ一つ要素を操作する必要があるため効率が悪いこと。
一方、かなり慣れてきたころにはそこまで時間をかけずにコーディングできるようになってきたため、デメリットをあまり感じておらず、フレームワークって何がおいしいのか全然わかりませんでした。
ただ、開発を行う上では他のメンバーにとってどうなのか?ということを考えたほうが良いだろうなと思いフレームワークまず使ってみようじゃないかとNuxt3の勉強を始めました。

そもそもフレームワーク使っていたじゃないか!

フレームワークとはなんぞや?を調べているうちにそもそも自身がフレームワークを使っていた事実がわかりました。
というのもNode.jsを使ってバックエンドを作る上でまずセットで使うであろうExpressフレームワークをすでに使っていたのですね。。
そりゃルーティングとか自前で作ったら大変だよな・・・とフレームワークなんか使わなくてもなんとかしていたと思っていた勘違いに気付かされました。

自分なりのフレームワークの旨味

ここからはNuxt3を触ってみての旨味となります。

  • コンポーネントの再利用性
  • auto importによるコードの簡略化
  • データバインディング

コンポーネントの再利用性についてはこれまであまり考えてきませんでしたが、簡単な例でXX番号検索コンポーネントなどは業務アプリケーションを作るような会社であればかなり再利用性が高いでしょう。
他、画一的なデザインに統一した繰り返し表などでしょうか?
共通的に使えそうなものは共通コンポーネントとして管理し、git submoduleなどで取り込むようなプロジェクト構成にすることで他のプロジェクトで似たようなものを何度も作る必要がないです。

auto importについては最初びっくりしました。
importしていないのにexportしたモジュールが使えるのです。
これについても例えばutilsの下に一般的な関数群やプロジェクト共通で取り扱いたい定義値などを作成し、同じくgit submoduleなどでプロジェクト共通化しておくことで有用性が上がりそうです。

データバインディングについては単純にコード量が減ります。
特に画面に反映させるイベントが多数存在する場合に優位性があると思いました。
また、一つのメモリの中で管理できるため反映漏れなどのバグを抑制することができます。

フレームワークのデメリット?

デメリットというよりは苦労するところとして、思い通りになるように作るまでにはトレーニングが必要そうだということです。
先にも記載しましたが,jQueryは自分が狙ったところにダイレクトに作用させることができるため個人的には簡単でしたが、そうもいかないことが多く発生しました。
コンポーネントへの値渡し、イベント通知のやり取り、レンダリング方式など新しく勉強することが多く初期コストは高いと思います。
ただ作るだけならまだ良いのですが、他のプロジェクトにも共通して適用させるような構成管理等々検討していくと導入初期は苦労は絶えないと思います。

で?いるの?いらないの?

必要です。
特にコンポーネントの再利用性の観点からは資産を蓄積していくと後々の開発コストに大きく影響すると考えます。
理想論ですが、これまで開発したコンポーネントを組み合わせるだけで出来上がってしまうとか・・・
こんな未来が訪れたらいいな・・・などと思いながら検討を進めている次第です。

1
0
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?