目次
Webアプリとは？
Webアプリケーション、通称「Webアプリ」とは、Webサーバー上で動作するアプリケーションを指します。簡単に言えば、高機能のWebサイトです。
Webアプリは、Google ChromeやSafariのようなWebブラウザで操作できます。
Webアプリを作成するには、作りたいアプリの機能に沿った言語や、言語を使いやすく簡略化したフレームワークを使用する必要があります。
Webサイトとの違い
Webサイトの主な目的は「情報の提供」です。ユーザーはWebサイトを通じて、情報の閲覧ができます。コーポレートサイトやブログなどが、Webサイトに該当します。
一方、Webアプリは情報の閲覧だけでなく、ほかの機能も利用可能です。コメントの書き込みやお店の予約、商品の購入などの機能を使えます。SNSやECサイトが、Webアプリに該当します。
ネイティブアプリとの違い
Webアプリとよく比較されるアプリケーションとして「ネイティブアプリ」があります。ネイティブアプリとは、スマートフォンやタブレットなどの端末にインストールして利用するアプリケーションのことです。
ネイティブアプリは端末にインストールする必要がありますが、インターネットを経由せずにオフラインでも利用できます。
一方、Webアプリの場合は利用にあたってインターネットを経由しなければならないため、オンライン環境が必要です。ただし、インストールせずともWebブラウザ上で操作できます。
有名Webアプリ例一覧
こちらでは有名なWebアプリの例を特徴や、使われている開発言語も含めて紹介します。
特徴
Twitterは、ユーザーが140字までのテキストと画像や動画を投稿できるSNSです。拡散性が高く、他のユーザーの投稿をシェアできる「リツイート」という機能で、自身をフォローしているユーザーのタイムラインに共有できます。
使われているJavaという言語は、コンパイラやエディタ、デバッグ機能などの大規模開発に必要な機能が搭載されており、Webアプリケーションの開発や金融機関の基幹システムにも使われています。
Javaと併せて使用されているScalaという言語は、データの処理速度を大幅に上げてくれ、Javaとの互換性も高いという特徴を持ちます。
クックパッド
特徴
クックパッドは、レシピの検索・投稿ができるサイトです。レシピを閲覧して、料理の参考にできるだけでなく、ユーザーが自分でレシピを投稿することもできます。オーソドックスな料理やオリジナル料理のレシピなど、幅広く掲載されています。
使用されている言語はRubyで、ユーザー登録やログインなどの機能の実装を可能にしています。
メルカリ
特徴
メルカリは、ネット上でフリーマーケットができるサービスです。商品の売買に関して出品者・購入者同士でやりとりし、値下げ交渉も可能です。商品の写真を撮影し、説明文を書くだけで簡単に出品できます。
個人情報を開示しなくてもよく、匿名性が高いことも特徴の1つです。
開発には、高速処理能力を持ち、コード体系がシンプルなGo言語が使われています。
食べログ
特徴
日本最大級のグルメサイトである、食べログ。ユーザーによるレストラン情報の登録も可能で、広告を出していない隠れた名店が掲載されるケースもあります。
実際にお店に行ったユーザーの口コミが投稿されるため、お店からの主観的な情報だけでなく、ユーザーによる客観的な情報も閲覧できます。
ユーザー登録やログイン機能をつけられるRubyが使用されています。
Qiita
特徴
プログラミングや情報技術に関する知識をシェアできるサービスです。ユーザー同士が技術情報を発信し、その情報に関して別のユーザーがフィードバックできます。
特にIT業界は技術革新が顕著で、最新の技術・知識が求められるため、現役プログラマー同士の情報交換を閲覧できるのは非常に有益なサービスといえます。
Webアプリのメリット
Webアプリのメリットについて、開発側・ユーザー側双方の視点で解説します。
開発上のメリット
Webアプリはインターネット上に公開すれば、ユーザーにブラウザ上で利用してもらえます。アプリケーションをインストールする必要がなく、アプリをストアに掲載する必要もありません。そのため、リリースのたびの審査が不要です。
また、複数のデバイスにも対応できます。ネイティブアプリの場合、デバイスのOSに応じて開発しなければなりません。
しかし、WebアプリはユーザーのデバイスのOSとブラウザのOSの互換性が保持されていれば、アプリの更新は簡単です。ブラウザ上でアプリが動作するので、開発や更新にあたって、1ソースで複数種類のデバイスに対応できます。
ユーザーにとってのメリット
前述の通り、Webアプリはオンライン環境さえあればインストールの必要がなく、デバイスの容量を圧迫しません。更新もサーバーで一元管理しているので、ユーザーが手動でアプリをアップデートする手間も省けます。
さらに、Webアプリにもよってはブラウザ上でアプリが動くため、対応するOSを気にする必要が無い点もメリットです。
Webアプリの仕組み
Webアプリは次の内容によって動作します。
- フロントエンド
- バックエンド
- データベース
フロントエンドとバックエンドの違い
フロントエンドとバックエンドには「ユーザーの目に触れるかどうか」といった点に違いがあります。
フロントエンドは、WebサイトやWebアプリケーションで直接ユーザーが目にする部分を指します。ユーザーが文字を入力したり、ボタンをクリックしたりする機能なども該当します。
一方、バックエンドはユーザーの目に見えない裏側の部分です。フロントエンドでユーザーが入力した内容に関してデータを処理して結果を返したり、個人情報の管理をしたりといったサーバーサイドの処理を行います。
役割が違うため、もちろん開発言語も異なります。また開発言語によっては、ある程度開発のための骨組みが入ったフレームワークも存在します。
フロントエンドの開発言語
フロントエンドで使われている開発言語は、主に以下の3つが挙げられます。
- HTML
- CSS
- Javascript
■HTML
Webページの骨組みを作成します。文章や見出し、画像の配置などが行えます。
■CSS
HTMLで作った骨組みに色や装飾などのデザインを施します。
■Javascript
HTMLやCSSで作ったWebページに動きをつけられます。スライドショーやGoogleマップの埋め込みなどの高度な動きの実装が可能です。
バックエンドについて
バックエンドでは、ユーザーに見えないサーバーやデータベースでの処理を実行します。
バックエンドの開発言語
バックエンドで使われる主な開発言語は、主に以下の5つが挙げられます。
- PHP
- Ruby
- Python
- C言語
- java
■PHP
PHPとは、多くのWebアプリケーションで利用されているブログラミング言語です。ユーザーの状況に合わせて表示内容が変えられるので、動的なコンテンツを作るのに向いています。
■Ruby
Rubyとは、日本人のまつもとゆきひろ氏によってリリースされた、読みやすくて書きやすい言語です。シンプルな少ないコードで開発できるため、多くのベンチャー企業で使われています。
■Python
Pythonとは、機械学習や人工知能などの開発ができる実用的かつ拡張性の高い言語です。
■C言語
C言語とは、自由度が高く実行処理が早い言語です。他の言語ではできない複雑な処理ができます。
■java
javaとは、Webアプリケーションだけでなく業務システムやゲーム開発など、幅広い分野で使用できる言語です。アプリ開発でよく使われます。
Webアプリの3層構造について
Webアプリは基本的に3種構造で構成されます。
- プレゼンテーション層
- アプリケーション層
- データ層
■プレゼンテーション層
プレゼンテーション層は、ChromeのようなWebブラウザとWebサーバーが役割を担います。
ユーザーからのリクエストに対して静的なコンテンツを見せたり、アプリケーション層で後述するAPサーバーに要求した処理の結果を見せたりします。
■アプリケーション層
アプリケーション層は、APサーバーが処理を実行します。APサーバーとはWebサーバーからの要求に対してプログラムを実行し、動的コンテンツを生成するサーバーです。
ユーザーの目に触れないバックエンドの部分を制御します。
■データ層
データ層はDBサーバーであり、データベースを管理します。APサーバーからの要求に従ってSQLという言語を実行し、その結果をAPサーバーに返します。
フレームワーク
フレームワークとは、プログラミング言語をより効率的に動かす枠組みのことです。フレームワークを使うことでWebアプリ開発がスムーズに進みます。ここでは、主なフレームワークを5つご紹介します。
■PHP 「Laravel」
PHPは、世界でも人気が高いフレームワークです。タスク管理アプリのような簡単なアプリケーションを自動生成できます。コードが書きやすく読みやすいので、初心者に向いたフレームワークです。
■Ruby「Ruby on Rails」
Rubyは、簡単なコードでWebアプリケーションの開発ができるように設計されています。面倒なフォルダやファイルの作成をコマンド1つで実行可能です。Ruby on Railsの使用例として「クックパッド」が挙げられます。
■Python「Django」
Djangoは、機械学習といったさまざまなシーンで利用されているフレームワークです。管理画面の生成や高い拡張性などで人気を集めています。人気の言語で使用しているエンジニアも多く、インターネット上に多くの情報が載っています。
■C言語
C言語はライブラリに依存することが多く、C言語向けのフレームワークはあまりありません。PCで使えるソフトウェアを作ることができます。例として「Google Chrome」や「Safari」などがC言語で作られています。
■java「Spring Framework」
javaは、必要と不必要な処理を分けることにより、バグ・不具合が発見された際にも原因を特定しやすいです。バグ検出のための専用テストプログラムも搭載しているので、テスト環境で動きを確かめることができます。
データベース言語
HTMLやPHPなどのプログラミング言語とは別に、データベース言語があります。データベース言語とは情報の登録や検索、更新、削除などといった操作を行うために用いられる言語です。代表的なものにSQLがあります。
データベースは、数万から数百万ものデータが保存されるWebアプリの情報源です。データベースの中には数多くのデータが保存されますが、SQLを使えば効率的に情報を取り出せます。
サーバーの種類
Webアプリケーションのサーバーは主に、次の3つで構成されます。
- Webサーバー
- アプリケーションサーバー
- データベース
■Webサーバー
Webサーバーとは、ユーザーと直接接点を持つサーバーです。ユーザーがWebブラウザでリクエストした内容を処理します。
■Webアプリケーションサーバー
Webアプリケーションサーバーは、Webサーバーからのリクエストに対してJavaやRubyなどのバックエンド言語を実行して処理します。
■データベース
データベースには、Webサイトに必要なユーザー情報や商品データなどが保存されます。アプリケーションサーバーからデータの検索・更新命令をリクエストされ、データ管理がされる流れです。
初心者におすすめのWebアプリ作成アイディア
こちらでは、初心者にもおすすめなWebアプリの作成アイディアについて解説します。
掲示板アプリ
簡単なフロントエンドの言語とPHPを用いれば、初心者でも簡単な掲示板を作成できます。
まず、フロントエンドの編集として、HTMLとCSSでWebアプリの見た目を整えましょう。フロントエンド部分を作ったらその部分にPHPの動作を追加します。ユーザーごとのIDの設定や書き込んだ日時の表示など、掲示板に最低限必要な機能を実装しましょう。
SNS
Rubyを使えば、SNSに必要なユーザー登録、ログイン、データベースの作成が可能です。作成できるのは、ログイン機能がついた簡易的な掲示板をイメージするとよいでしょう。
実際に、初期のFacebookやTwitterなどのSNSはRubyを利用して作成されています。
まとめ
本記事では、Webアプリの概要や、実際に使われているアプリ、開発言語などについて解説しました。
開発言語によって、アプリでできることは異なります。自分が作りたいアプリは「どんな言語が必要か」「どのフレームワークが向くのか」といった点は事前に確認しておきましょう。
Webアプリの開発に挑戦してみたい方は、ぜひこの記事を参考にしてください。
