初めに
Web アプリケーションは、インターネットに接続して、インストールすることなく使用できるアプリのことです。本記事では、Web アプリケーションを作るための手順をまとめます。
Index
Web アプリケーションとは
Web アプリケーションは、インターネットに接続して、インストールすることなく使用できるアプリのことです。Twitter や YouTube、GMail などが有名な例になります。
Web アプリの仕組み
Web アプリは次のような手順で動作します。
処理の内容は必要に応じて、データベースを使用し、データの取得、追加、更新、削除を行ったり、取得したデータをHTMLに変換し、ページの表示内容を変えたりします。
Web アプリを作る上で必要な仕組み
- フロントエンド(クライアントサイド)
- バックエンド(サーバーサイド、データベース)
フロントエンド(クライアントサイド)
ユーザーが直接操作する部分をフロントエンドと呼びます。Web ページの見た目などユーザーに見える部分を作るときに使われるフロントエンド言語には、HTML や CSS、JavaScript があります。
フロントエンド言語 | 説明 |
---|---|
HTML | Web ページの基本的構造を記述 |
CSS | サイトの表示やレイアウトなどを制御 |
JavaScript | Webページに動きをつける |
Web ページを表示させるだけであれば、HTML だけあればよいですが、見た目をこだわるのであれば、CSS が必要になります。さらに、動的な操作を追加するのであれば JavaScript が必要になります。
バックエンド(サーバーサイド)
バックエンドは、Webアプリケーションの裏側で動作し、データの処理やサーバーサイドのロジックを担当する部分です。バックエンドは、ユーザーが直接操作するインターフェースではなく、データの取得、保存、処理、ビジネスロジックの実行、データベースとのやり取りなど、アプリケーションの基本的な機能を提供します。
サーバーで行う処理を記述する言語はサーバーサイド言語、バックエンド言語と呼ばれます。Python、Ruby、Java、PHP、C#などさまざまな言語がありますが、Web アプリを開発するうえで使用するフレームワークごとに使用言語が異なります。
フレームワークの例 | 説明 |
---|---|
CakePHP | PHP用のwebフレームワーク |
Ruby on Rails | Ruby用のwebフレームワーク |
Django | Python用のwebフレームワーク |
AngularJS, React, Node.js | JavaScript用webフレームワーク |
ASP.NET | .NET と C# 用のwebフレームワーク |