Webアプリケーションのパラダイム

〜過去・現在・未来〜

開発支援室 宮里　忍

(人型兵器21号)

2021年07月16日

Webアプリケーションとは

Webアプリケーションの例

検索 Google, Bing, Yahoo, 百度
SNS Instagram, LINE, Facebook, twitter, mixi
開発 GitHub, Atlassian, backlog, Qiita
コーディング Monaca, paiza.io, Visual Studio Codespaces
Office Microsoft365, Google Docs
作図 cacoo, draw.io
EC Amazon, 楽天, Aliexpress
配信サービス YouTube, ニコニコ動画, Hulu, U-NEXT, Amazon Prime, Netflix
ゲーム (あるにはあるが、シェアは未だ取れていない)

(補足) Google Chrome と Chromium

OSS の ブラウザ Chromium に
Google のブランドと拡張を加えたものが Google Chrome です。

ブラウザ戦争



‥
○




Hello, World!

CGI

CGI の例 

      #!/usr/bin/perl
      print 'Content-type: text/html \n\n';
      print '\n';
      print ' Hello\n';
      print ' Hello World!\n';
      print '\n';

PHP 


      <html>
        <head><title>Hello</title></head>
        <body>
        <?php
          print 'Hello World!\n';
        ?>
        </body>
      </html>

WebMagic

JavaEE

JavaEEのJSPでWebアプリケーションを記述した例


      <html>
        <head><title>Hello</title></head>
        <body>
        <?
          out.println("Hello World!");
        ?>
        </body>
      </html>

Ruby on Rails

Ruby on Rails の特徴
フロント側の仕組みとしてこの後で説明する SPA が主流になってきたこともあり、 Ruby on Rails は下火だと言われている。

Ajax による JavaScript の復権

HTML5

HTML5 の廃止と新標準 HTML Living Standard

SPA: Single Page Application

SPA フレームワーク

クライアントアプリケーションとWebフロントエンドにあまり違いがなくなった!

(補足) Google Chrome と Chromium

OSS の ブラウザ Chromium に
Google のブランドと拡張を加えたものが Google Chrome です。

ブラウザ戦争



‥
○

ブラウザ戦争の功績

ブラウザ戦争の功績

HTML, CSS, JavaScript でスマホアプリ開発

サーバサイド JavaScript

HTML, CSS, JavaScript でデスクトップアプリケーション開発

以下、2つの方法で実現可能

Electron でデスクトップアプリケーション開発

PWA でデスクトップアプリケーション開発

JavaScript と機械学習

デモ

4G -> 5G -> 6G

Webアプリケーションの未来

JavaScript で遊びたくなりましたか?




ご清聴いただき、ありがとうございました!m(__)m