表示調整
閉じる
挿絵表示切替ボタン
▼配色
▼行間
▼文字サイズ
▼メニューバー
×閉じる

ブックマークに追加しました

設定
0/400
設定を保存しました
エラーが発生しました
※文字以内
ブックマークを解除しました。

エラーが発生しました。

エラーの原因がわからない場合はヘルプセンターをご確認ください。

ブックマーク機能を使うにはログインしてください。
なれる運営 ~30日で作る小説投稿サイト~  作者: とある個人開発者
1章 Webアプリの基本を覚える7日間

この作品ページにはなろうチアーズプログラム参加に伴う広告が設置されています。詳細はこちら

6/40

5日目 フレームワークを選ぼう!

「今日はフレームワークについて勉強していくよ」


「そろそろ覚えたことが頭からぽろぽろとこぼれそう……」


「使うときに再履修するから大丈夫。全部を覚える必要はなくて、どう使えるかのきっかけだけ覚えて、使うときにググってればOKだよ」


 * * *


「これまで勉強してきたのは、HTML/CSS/JavaScripで、これだけだと静的サイト(いつどこでアクセスしても毎回同じものが表示される、HTMLファイルで作成されたWebページのこと)だけしか作れない。


 でも、これから作ろうとしている小説投稿サイトは動的サイト(アクセスしたときの状況に応じて異なる内容が表示されるWebページのこと)。 人によって表示する内容を変えたり、ユーザー登録できるようにしたり、小説投稿をできるようにするためには、動的サイトを作る必要がある。


 動的サイトを実現させるにあたって、バックエンド側のプログラミングをする必要がある」


「バックエンドって?」


「動的サイトの構成はフロントエンドとバックエンドに分かれる。


挿絵(By みてみん)


■フロントエンド:使用するユーザー側の処理、パソコン上での見た目をコントロールする部分。ユーザーが使いやすいよう、見やすいように色々とする側のこと。

―必要な知識:HTML、CSS、Javascript、jQuery、行動心理学、デザイン、


■バックエンド:使用するユーザーが見えない部分・直接操作できない部分の処理。フロントエンドで使用するデータを集めたり整形したりしてフロントエンドに渡す側のこと。

―必要な知識:開発用プログラミング言語、データベース、サーバー、システム設計、PDCA



 これまで勉強していたのは全部フロントエンドで、バックエンドも学ぶ必要がある。



 基本的にバックエンドに大本の仕組みがあって、色々なデータもあり、そこから必要な物を取り出せるけど、普段使用する側ではそんなもの見にくいし見られたくないし見せたくもないから、色々と加工してからフロントエンド側で見せたいものだけ見せる感じ。



 専門の開発会社とかだと、ディレクター、デザイナー、エンジニアみたいに役割を複数に分けている感じ。


■ディレクター:全体の方向性、進行管理する人。システムの設計。方向性が迷子な場合はこの人の責任

■デザイナー:フロントエンド担当。ユーザーの使いやすいように画面設計する人。UIが悪い場合はこの人の責任

■エンジニア:バックエンド担当。Webサービスの提供に必要な仕組みを作る人。Webサービスの機能が多ければ多いほど大変。バグがあった場合は大体この人の責任


 複数人で開発を行う場合は片方だけ勉強するでもいいけど、一人で開発する場合は全部勉強しないといけないね。


 フロントエンドはHTML/CSS/JavaScripの3つを覚える必要がある。でもバックエンドを開発するために覚えるものはいくつも選択肢がある。いくつもある言語から開発言語を選ばないといけない。バックエンドでは色々なプログラミング言語が使えます。


 ここの選択で開発速度や難易度も替わるね。



 ただ、色々な言語がありますが、Web開発に向いた言語は大体決まっている。



 Ruby、PHP、Pythonがメジャー。あとはこれに加えてGoやJavaなんかもあるのかな。また最近ではJavaScriptも候補になってる」



挿絵(By みてみん)



「ポケ〇ンみたい」


「……とりあえず三大Webアプリケーションフレームワークが存在するRuby、PHP、Python もしくは JavaScriptを選んでおけば間違いないかな。



 一応簡単に御三家を説明しておくと、



■Ruby

Rubyは日本人が開発した言語で、日本ではかなり人気。Web開発ではRuby on Rails(単にRailsと呼ばれる)が超有名。設計思想は自由に楽しくプログラミング。みんな違ってみんないい、書きたいように書くとのこと。


■PHP

PHPは古くからWebサービス開発に使われていて、設計思想としてはWeb開発を簡単にするって感じ。


■Python

Pythonは機械学習やAIが流行して来てから有名になっている。分析系のツールが作りやすくてデータサイエンティストの御用達。設計思想としては、暗示より明示。誰が書いても同じようなコードになるように、可読性、わかりやすさを求めているとのこと。



 なんでこれら言語がお勧めなのかというと、使い勝手のいいWebフレームワークが存在しているから。



■Webフレームワーク

Web アプリケーションフレームワーク(ウェブアプリケーションフレームワーク、英: Web Application Framework)は、動的な ウェブサイト、Webアプリケーション、Webサービスの開発をサポートするために設計されたアプリケーションフレームワークである。 フレームワークの目的は、Web開発で用いられる共通した作業に伴う労力を軽減することである。たとえば、多数のフレームワークがデータベースへのアクセスのためのライブラリや、テンプレートエンジン(→Webテンプレート)、セッション管理を提供し、コードの再利用を促進させるものもある。



 とりあえず、Webサービスの開発を簡単にするための枠組みのこと。



 一からコードを書くのではなくて、共通に使いまわせる部分は部品として用意してあって、差別化できる部分だけ作ればいいようにしているということ。特に個人開発だと、人数でごりおせないので必要な部分だけつくればいいという思想から生まれたもの。




 優秀なWebフレームワークがあるからRuby、PHP、Python, JavaScriptが人気。



■三大フレームワーク+JavaScript系のフレームワーク


Ruby on Rails / Laravel / Django / React.js(厳密にはライブラリ) / Vue.js / Angular




■Ruby on Rails

言語:Ruby


Webアプリケーションフレームワークの王道。

Rubyが日本で開発されたこともあって、日本語の情報がいっぱい。


Webアプリケーションを自分で作ろうと思ったら、簡単なアプリしかできなかった問題を解決するために開発された。Webアプリケーションフレームワークという存在を世に広めた立役者。


CookPadなんかもRuby on Railsで作られている。



■Laravel

言語:PHP


Web職人のためのPHPフレームワーク。


PHPは使いやすいWebフレームワークが少ないという欠点があったが、その評判を払拭するようにさっそうと現れた。比較的後の方に開発されたフレームワーク。


Ruby on railsなどの有名なWebフレームワークの良いところを取り入れつつも、扱いやすさを重視したWebフレームワーク作りを目指している。



■Django

言語:Python


"Batteries included" の哲学に従い、開発者が "すぐに" やりたいことのほとんどを提供するフレームワーク。


Pythonで作られていて機械学習を導入することも容易にできるため、AIなどを導入したWebサービス開発が増えてきている今は人気のフレームワーク。


InstagramなんかもDjangoで作られている。



■React.js(+Next.js)

言語:JavaScript


Facebookが開発した"ユーザインターフェース構築のための JavaScript ライブラリ"


厳密にはフレームワークではなくライブラリ。といっても同列に語られることが多いので、使う側からすれば特に問題ないのでここに置いておく。開発元のFacebookやYahooなどでも使用されている。


国外で人気。使いまわしが容易なので結構人気。またReact Nativeというアプリ開発用フレームワークが存在し、iPhone, Androidのアプリを作ることができる。React.jsを知っていれば、ある程度学習が容易になる。スマホアプリも視野に入れるならReactがオススメ。



■Vue.js(+Nuxt.js)

言語:JavaScript


"ユーザーインターフェイスを構築するためのプログレッシブフレームワーク"


国内や、中国圏で人気なJavaScript系のフレームワーク。最近の小説投稿サイトで使うところもある。他のJavaScript系のフレームワークより学習コストが低いので、比較的習得が容易。


シングルページアプリケーションでよく使われる。中小規模のWebサービスに適している。



■Angular

言語:JavaScript


Google を中心としたコミュニティで開発・公開されている”モバイルとデスクトップ、ひとつのフレームワーク”


フルスタックなフレームワークで、Web アプリケーション開発に必要な機能のほぼ全てをサポートしている。学習コストが高いので、他のJavaScript系のフレームワークより取り入れられてない。


大規模なWebサービス向け。




* * *


「御三家とかヒ〇カゲ、ゼ〇ガメ、フ〇ギダネみたい。あとピ〇チュウもそろってるのすごい」


「ポケモンから離れて。



 他にもフレームワークはいっぱいあるけど、この辺りが人気。人気ってことはそれだけ情報がいっぱいあるってことで、それだけで勉強のためには有利になる。開発も進むからね。


 日本で初心者ならRubyを学ぶ人が多いかな。セミナーも多いし、日本語のドキュメントが多いっていうのも魅力的なところ。


 JavaScript系のフレームワークは最近のトレンドで利用者が増えているし、覚える言語が少なくて済むので学習コストが低いね。


 PHPは古くからWebサービスで使われているね。あとブログで有名なWordpressもPHPで作られていて、テーマを作ったり改良したいならPHPを覚えておくといいかも。


 Pythonは最近流行の人工知能や機械学習、色々な分野で利用されているからお勧めかな」


「ふーん、便利そうだね。フレームワークを使わない場合はどうするの?」


「全部機能を作る必要がある。でも、ログインとかデータベース更新とか、似たような機能をいちいち作らなくてもフレームワークを使えば簡単に作れるし、パッケージといって、他の人が作ったツールも使えるようになる。


 セキュリティもある程度考えられているから個人開発なら断然フレームワークを使って開発することを勧めるね。というか、初心者で、全部作るのは正直無理だと思ってる。時間がかかりすぎる。


 フレームワークを使わない状況を例えるなら、一人で道具もなしに無人島で家を作る感じかな。手探りで進めていかないといけない。体力や人手、知識も十分ないと厳しい。


 それに比べてフレームワークがあれば、道具も作り方や進め方が書いてる説明書が用意してある感じ。どうすすめればいいか参考書もそろってる」


「T〇KI〇ならいけるかも」



「できそうだけど……。それよりフレームワークを選ぶなら個人的なお勧めはJavaScript系かPtyhon。この2つかな、Javascriptはフロント側でも使うから使う言語が少なくなるし、React Nativeというものがあって、これを使うとアプリも対応可能になる。将来的にアプリにも対応させようと思ったらこれがいいんじゃないかな。


 PythonはAI系の分析、統計が盛り上がっていて、今後のトレンドを考えると勉強していおいた方がいい。日常業務でも使えるScript言語だから、覚えておいて損はないかな。


 Rubyは日本語資料が豊富だけど、そろそろ主流から外れてきているし、PHPもは……、Wordpress系の仕事をするんだったらいいかもしれない。もし合わないんだったら、何個か試してもいいしね」


「……うーん。まぁよくわかんないし、仕事でも使えそうなのがよさそうだね。ふーん、そういえばAIとか面白そうだよね、うちの会社でも少し話題になってた気がする。そういえばオススメ小説とかAIで自動で出せれば便利っぽいし、じゃぁPythonにしてみる」


「OK、わかった。じゃぁバックエンドはPythonでいこう。フレームワークはDjangoにするよ」


 


初心者の人がWebアプリケーションを個人で作りたかったらよほど自信がない限り何かしらのフレームワークを使って作るのがベターです。


時間短縮もそうですが、特に大きいのがログイン関係とセキュリティです。この部分はほとんど共通の課題なのでフレームワークにはだいたい実装されています。


個人で作ると抜け漏れが多いので、フレームワークに任せるのがいいと思います。


もし、その部分も作りたいなら、慣れてから自作すればよいでしょう。できる限り本質的な部分以外は簡単に済ませておくのがいいでしょう。



最近だとRustやGo言語も人気になりつつありますが、まだまだマイナーな感じ。もう少しすると変わるのかも。JavaScriptとPythonがつぶしがきくのでお勧めです。


初心者向けに仕事にするのであればNoCode系、PHPでWordpressを覚えておくと需要がいっぱいあって開発速度も速いのでいいかもしれません。複雑なことをしないのであればよさそうです。


Web業界に就職や転職を考えると日本だとRuby、PHP案件が多いのでそちらを勉強するといいかなぁと思います。Pythonは色々なところに使えるけど、仕事としては初心者向けの求人が少ないので。ただ、趣味として業務改善に使ったりできる分、オススメ。


まぁただ、技術はものすごい勢いで進化していっているので、今のトレンドがずっと続くわけではないです。できたら将来を見越して選ぶ必要があります。それにずっと勉強する必要があります。滞留は敗北。

評価をするにはログインしてください。
ブックマークに追加
ブックマーク機能を使うにはログインしてください。
― 新着の感想 ―
[一言] 最近の生物学は、遺伝子解析がほぼPythonに代わってしまったんですよ。時代はPythonですね。まぁ、私は今は使うだけなので、あんまし勉強してませんが。世知辛い世の中だから、生きて行くため…
感想一覧
+注意+

特に記載なき場合、掲載されている作品はすべてフィクションであり実在の人物・団体等とは一切関係ありません。
特に記載なき場合、掲載されている作品の著作権は作者にあります(一部作品除く)。
作者以外の方による作品の引用を超える無断転載は禁止しており、行った場合、著作権法の違反となります。

この作品はリンクフリーです。ご自由にリンク(紹介)してください。
この作品はスマートフォン対応です。スマートフォンかパソコンかを自動で判別し、適切なページを表示します。

↑ページトップへ