ひとりでのアプリ開発 - fineの備忘録 -

ひとりでアプリ開発をするなかで起こったことや学んだことを書き溜めていきます

Webアプリケーションを作るには

初めに

 Web アプリケーションは、インターネットに接続して、インストールすることなく使用できるアプリのことです。本記事では、Web アプリケーションを作るための手順をまとめます。

Web アプリケーションとは

 Web アプリケーションは、インターネットに接続して、インストールすることなく使用できるアプリのことです。TwitterYouTubeGMail などが有名な例になります。

Web アプリの仕組み

 Web アプリは次のような手順で動作します。

(Web アプリの動作の流れ)

  1. ブラウザがサーバーにリクエストを送る
  2. サーバーはリクエストの内容(URLなど)に応じて処理を実行し、HTMLをブラウザに返す
  3. ブラウザにHTMLが表示される

 処理の内容は必要に応じて、データベースを使用し、データの取得、追加、更新、削除を行ったり、取得したデータをHTMLに変換し、ページの表示内容を変えたりします。

Web アプリを作る上で必要な仕組み
  • フロントエンド(クライアントサイド)
  • バックエンド(サーバーサイド、データベース)
フロントエンド(クライアントサイド)

 ユーザーが直接操作する部分をフロントエンドと呼びます。Web ページの見た目などユーザーに見える部分を作るときに使われるフロントエンド言語には、HTML や CSSJavaScript があります。

フロントエンド言語 説明
HTML Web ページの基本的構造を記述
CSS サイトの表示やレイアウトなどを制御
JavaScript Webページに動きをつける

 Web ページを表示させるだけであれば、HTML だけあればよいですが、見た目をこだわるのであれば、CSS が必要になります。さらに、動的な操作を追加するのであれば JavaScript が必要になります。

バックエンド(サーバーサイド)

 バックエンドは、Webアプリケーションの裏側で動作し、データの処理やサーバーサイドのロジックを担当する部分です。バックエンドは、ユーザーが直接操作するインターフェースではなく、データの取得、保存、処理、ビジネスロジックの実行、データベースとのやり取りなど、アプリケーションの基本的な機能を提供します。

 サーバーで行う処理を記述する言語はサーバーサイド言語、バックエンド言語と呼ばれます。PythonRubyJavaPHPC#などさまざまな言語がありますが、Web アプリを開発するうえで使用するフレームワークごとに使用言語が異なります。

フレームワークの例 説明
CakePHP PHP用のwebフレームワーク
Ruby on Rails Ruby用のwebフレームワーク
Django Python用のwebフレームワーク
AngularJS, React, Node.js JavaScript用webフレームワーク
ASP.NET .NET と C# 用のwebフレームワーク

バックエンド(データベース)

 データベースでデータの取得、保存、更新、削除などを行います。データベース言語として、SQL があります。

 SQL については、下の記事をご覧ください。

fineworks-fine.hatenablog.com

参考

prog-8.com