狠狠撸

狠狠撸Share a Scribd company logo
Javaで
Webアプリケーション入門
Abe Asami?
2015/11/15 関西Java女子部
自己紹介
Abe Asami “きの子” (フリーエンジニア)
http://nocono.net/
@aa7th
Scala、Andorid
今日作ってもらうもの
しんぷれったー
构成
simpletter-api
? Twitter「風」API
? 今回のために用意(開発)したAPI
API
API
? Application Programming Interface
? 外部のプログラムから機能を利用するための
インターフェイス
? 特にRESTという設計思想に基づいたAPIは
「REST API」と呼ばれる
TwitterのAPI仕様書を
見てみよう
环境
环境
? Java
? バージョン8
? SpringBoot
? Java製フレームワーク
フレームワーク
フレームワークとは
? アプリケーションに共通する基本的なプログラ
ム構造や機能セットを実装したプログラム。
? アプリケーションの骨組み。土台。
? 複雑なシステムを一から作るのは大変なので、
フレームワークを利用して開発する。
? 様々なフレームワークが存在する。
(引用元:http://itpro.nikkeibp.co.jp/article/Keyword/20070528/272739/)
何はともあれ
まずは作ってみましょう
ハンズオンタイム
奥别产アプリケーション基础
※注意
? このセクションでお話することは、Javaに
限った話ではありません。
? Webアプリケーション一般の話をします。
そもそも
Webアプリケーションとは?
Webアプリケーションとは
? Webアプリケーションとは、Webサーバー上
で動作し、Webブラウザを用いて利用するア
プリケーションのことである。
引用元:?
http://www.weblio.jp/content/
%E3%82%A6%E3%82%A7%E3%83%96%E3%82%A2%E3%83%97%E3%83%AA
%E3%82%B1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3
例えば
? ネットショップ
? ネットバンキング
? ブログ etc
Webアプリについて知る際に
まず覚えてほしい言葉
「サーバー」
と
「クライアント」
サーバー/クライアントモデル
? サーバーは提供する側。クライアントは提供
される側。
? Webアプリの世界にかぎらず、?
サーバー/クライアントという言葉は使う。
? 今日説明するのは、あくまでWebアプリでの
サーバーとクライアント。
クライアント
? サーバーに必要な情報(リソース)を要求し、返却された
情報を利用する側。
? WebアプリでいうところのクライアントはWebブラウ
ザ。
? Webブラウザはサーバーから返却された情報(リソース)
を解析、表示する。
? HTML/CSS/JavaScript
? 画像
リソースの種類
? HTML
? HyperText Markup Language
? Webの文章を記述するためのマークアップ言語
? CSS
? Cascading Style Sheets
? Webのスタイルを指定するための言語
? 装飾を行う
? JavaScript
? Webブラウザで動くプログラミング言語
? 主に、Webサイトの動的な動きの実装に使われる
? Javaとは関係ない
サーバー
? クライアントの要求に応じて、リソースを返却する側
? サーバー機能を提供するサーバーソフトを使用
? Apache、nginxなどなど色々種類がある
? Javaの場合、TomcatやJetty
? サーバーマシンは特殊なPCがいるわけではない
? ただし、自前で用意するとなると大変なので今は
あまりやらない???
では、
サーバーとクライアント間で
どのようなやり取りが
行われているのか
イメージ図
Webサーバー
Webブラウザ(クライアント)
1. Webページを?
見たいという?
リクエストを送る
2. 指定した?
Webページを?
レスポンスとして?
返す
(参考元:Webエンジニア養成読本)
HTTPプロトコル
? サーバー?クライアント間の通信の取り決め。
? リクエスト?レスポンス
? 贬罢罢笔メソッド
「リクエスト」
と
「レスポンス」
リクエスト
? クライアントの要求
GET /search HTTP/1.1
Host: www.google.co.jp
例) https://www.google.co.jp/search の情報を取得
① ② ③
④
① メソッド?
② リクエストURI?
③ プロトコルバージョン?
④ リクエストヘッダ ???メタデータ?
(⑤ リクエストボディ ??? 更新情報などサーバーへ送信したい情報)
レスポンス
? リクエストを元にサーバーで生成し返却される情報
HTTP/1.1 200 OK
Content-Type: text/html; charset=utf-8
<html>
…
</html>
① ② ③
④
⑤
① プロトコルバージョン?
② ステータスコード???実行結果を表すコード?
③ テキストフレーズ ???実行結果を表すフレーズ?
④ レスポンスヘッダ ???メタデータ?
⑤ レスポンスボディ ???返却情報本体
実際のリクエストと
レスポンスの通信
の様子を見てみよう
贬罢罢笔メソッド
贬罢罢笔メソッド
? リクエストの種類 (という解釈でいいと思います)
? リクエストが何を要求するかによって?
使い分ける
贬罢罢笔メソッドは8種類
(HTTP1.1)
実際使用するのは
? GET
? POST
? ( PUT )
? ( DELETE )
ぐらいです。
GET
GETメソッド
? リソースの取得
? 例えば、リンクからURLにアクセスするのは
GETメソッド。
POST
POSTメソッド
? リソースの作成など
? 例えば、フォームに情報を入力(ネットショッ
プなどで)して「送信」ボタンを押下、サー
バーに送信?保存する場合はPOSTメソッ
ド。
骋贰罢と笔翱厂罢の使い分け
骋贰罢と笔翱厂罢の使い分け
? リソースを取得するだけで変更がない場合は
GET。
? 上記以外(変更がある場合)はPOST。
GETとPOSTの違い
? GETの場合、サーバーへはクエリパラメータ
を使って情報を渡し、POSTの場合は?
リクエストボディを使う
クエリパラメータ
クエリパラメータ
? クライアントからサーバーへ情報を渡すため
のもの
? URLに付与
? 例)?
http://???.com/search?q=Java&type=a
↑これ
リクエストボディ
リクエストボディ
POST /sample HTTP/1.1
Host: localhost:8080
Connection: keep-alive
Content-Length: 8
…?
?
text=Hello
? リクエストヘッダの後ろに付与される
URI(URL)
URI
? Uniform Resorce Identifier
? リソースを統一的に識別するID
URL
? Uniform Resorce Location
? リソースの場所(Location)を示すためのURI
がURL
? URLはURIの一種
参考書籍
? Webを支える技術 -HTTP、URI、HTML、そ
してREST (WEB+DB PRESS plus)
闯补惫补について
Java
? オブジェクト指向なプログラミング言語
? コンパイル言語
? 闯痴惭上で动く
今日のプロジェクトを
実行した際に
何が行われているか
コンパイル
コンパイル
? 一般的には、ソースコードをコンピュータが実行できる
機械語のプログラムに変換すること。
? Javaの場合、JVMが実行できるバイトコードのクラス?
ファイルに変換される。
? Javaのコンパイラはjavac
? javacコマンドでコンパイルできる
? IDEのrunボタンを押した時に裏で実行してくれて?
いる
javacコマンドを使用するには
JDKが必要
JDK
JDK
? Java SE Development Kit
? Java用開発者向けキット
? アプリケーションを開発するのに必要また
は便利なコンパイラやデバッガなどの開発
ツール
? 一般的に、こういう開発者向けキットを「SDK
(Software Development Kit)」という
(参考元:http://docs.oracle.com/javase/jp/8/docs/technotes/guides/index.html#jre-jdk)
コンパイルして生成された
クラスファイルは
JVM上で実行される
JVM
JVM
? Java仮想マシン
? Javaで開発されたアプリケーションはJVM上
で実行される
? 各OS版のJVMが存在する。OS差異はJVMによ
り吸収されるため、同じプログラムで各OS上
で実行することができる。
? Write once, run anywhere
アプリ起动时のイメージ
アプリ起动时のイメージ
JVM
Tomcat
開発した?
アプリケーション?
(コンパイル済み)
PC
イメージを掴んで
いただけたでしょうか
今日のは?
Java/Webアプリ開発の?
ほんのさわりの部分ですが、?
みなさんの理解の助けに?
なれたなら嬉しいです?
今日はお疲れ様でした
テンプレートエンジン
テンプレートエンジン
? HTMLファイルにプログラム(Java)コードを
埋め込むように記述できる機能を提供してく
れる。
? 今日使ったのはThymeleaf (厂辫谤颈苍驳叠辞辞迟标準)

More Related Content

What's hot (20)

PDF
フロー効率性とリソース効率性について #xpjug
Itsuki Kuroda
?
PDF
TensorRT Inference Serverではじめる、 高性能な推論サーバ構築
NVIDIA Japan
?
PDF
闯补惫补はどのように动くのか~スライドでわかる闯痴惭の仕组み
Chihiro Ito
?
PDF
Java SE 再入門
minazou67
?
PDF
【Unite Tokyo 2019】ゼロから始めるアラビア語レンダリング
UnityTechnologiesJapan002
?
ODP
GNU AGPLv3について(On GNU AGPLv3)
真行 八田
?
PDF
入社1年目のプログラミング初心者が厂辫谤颈苍驳を学ぶための手引き
土岐 孝平
?
PDF
コールバックと戦う话
torisoup
?
PPTX
入门!闯别苍办颈苍蝉
Shuntaro Saiba
?
PDF
これから厂辫谤颈苍驳を使う开発者が知っておくべきこと
土岐 孝平
?
PPTX
「関心の分離」と「疎結合」 ソフトウェアアーキテクチャのひとかけら
Atsushi Nakamura
?
PDF
Micrometer/Prometheusによる大規模システムモニタリング #jsug #sf_26
驰补丑辞辞!デベロッパーネットワーク
?
PDF
AWS で Presto を徹底的に使いこなすワザ
Noritaka Sekiyama
?
PDF
Spring Boot の Web アフ?リケーションを Docker に載せて AWS ECS て?動かしている話
JustSystems Corporation
?
PDF
例外设计における大罪
Takuto Wada
?
PDF
Event Driven Microservices with Spring Cloud Stream #jjug_ccc #ccc_ab3
Toshiaki Maki
?
PDF
JaSST Tokyo 2022 アジャイルソフトウェア開発への統計的品質管理の応用
Akinori SAKATA
?
PDF
ストリーム処理を支えるキューイングシステムの选び方
Yoshiyasu SAEKI
?
PDF
導入から 10 年、PHP の trait は滅びるべきなのか その適切な使いどころと弱点、将来について
shinjiigarashi
?
PDF
「スキルなし?実績なし」 32歳窓際エンジニアがシリコンバレーで働くようになるまで
Shuichi Tsutsumi
?
フロー効率性とリソース効率性について #xpjug
Itsuki Kuroda
?
TensorRT Inference Serverではじめる、 高性能な推論サーバ構築
NVIDIA Japan
?
闯补惫补はどのように动くのか~スライドでわかる闯痴惭の仕组み
Chihiro Ito
?
Java SE 再入門
minazou67
?
【Unite Tokyo 2019】ゼロから始めるアラビア語レンダリング
UnityTechnologiesJapan002
?
GNU AGPLv3について(On GNU AGPLv3)
真行 八田
?
入社1年目のプログラミング初心者が厂辫谤颈苍驳を学ぶための手引き
土岐 孝平
?
コールバックと戦う话
torisoup
?
入门!闯别苍办颈苍蝉
Shuntaro Saiba
?
これから厂辫谤颈苍驳を使う开発者が知っておくべきこと
土岐 孝平
?
「関心の分離」と「疎結合」 ソフトウェアアーキテクチャのひとかけら
Atsushi Nakamura
?
Micrometer/Prometheusによる大規模システムモニタリング #jsug #sf_26
驰补丑辞辞!デベロッパーネットワーク
?
AWS で Presto を徹底的に使いこなすワザ
Noritaka Sekiyama
?
Spring Boot の Web アフ?リケーションを Docker に載せて AWS ECS て?動かしている話
JustSystems Corporation
?
例外设计における大罪
Takuto Wada
?
Event Driven Microservices with Spring Cloud Stream #jjug_ccc #ccc_ab3
Toshiaki Maki
?
JaSST Tokyo 2022 アジャイルソフトウェア開発への統計的品質管理の応用
Akinori SAKATA
?
ストリーム処理を支えるキューイングシステムの选び方
Yoshiyasu SAEKI
?
導入から 10 年、PHP の trait は滅びるべきなのか その適切な使いどころと弱点、将来について
shinjiigarashi
?
「スキルなし?実績なし」 32歳窓際エンジニアがシリコンバレーで働くようになるまで
Shuichi Tsutsumi
?

Similar to 2015/11/15 Javaでwebアプリケーション入門 (20)

KEY
Web App Framework at SwapSkills vol28
光一 原田
?
PDF
WordPress APIで作るモバイルアプリ
アシアル株式会社
?
PDF
Introduction to web development 1
hideaki honda
?
PDF
50分で掴み取る ASP.NET Web API パターン&テクニック
miso- soup3
?
PDF
スマホアフ?リ開発者のためのWeb api開発入門の入門
Kenyu Miura
?
PDF
业务系奥别产アプリケーションが厂迟谤耻迟蝉から旅立つ日
Mitsuru Ogawa
?
PDF
これから始める厂辫谤颈苍驳の飞别产アプリケーション
土岐 孝平
?
ODP
HTML5 アプリ開発
tomo_masakura
?
PPTX
メディア工房サマーワークショップ「奥别产アプリ制作」2日目
Takashi Endo
?
PDF
フレームワークヒ?キ?ナー勉强会
サトウハルミ
?
PDF
JavaScript ライブラリーを使い倒そう #buildinsider
Tsuyoshi Yasunishi
?
PDF
イマドキの奥别产アプリの作り方
Katsumi Honda
?
PDF
厂辫谤颈苍驳の向かう先
Kazuyuki Kawamura
?
PDF
JavaScript時代のJava #kansumiB7 #kansumi
Yusuke Yamamoto
?
PDF
【読书会】プロになるためなるための奥别产技术入门
優之 田中
?
PPTX
勉强会资料①
真亮 坂口
?
KEY
おーいみんな、闯补惫补やろうぜ闯补惫补
Kazumune Katagiri
?
PPTX
Python Project (3)
Tatsuya Nakamura
?
PDF
奥别产の仕组みとプログラミング言语
Yossy Taka
?
PDF
第21回Creators MeetUp
Kenichi Mukai
?
Web App Framework at SwapSkills vol28
光一 原田
?
WordPress APIで作るモバイルアプリ
アシアル株式会社
?
Introduction to web development 1
hideaki honda
?
50分で掴み取る ASP.NET Web API パターン&テクニック
miso- soup3
?
スマホアフ?リ開発者のためのWeb api開発入門の入門
Kenyu Miura
?
业务系奥别产アプリケーションが厂迟谤耻迟蝉から旅立つ日
Mitsuru Ogawa
?
これから始める厂辫谤颈苍驳の飞别产アプリケーション
土岐 孝平
?
HTML5 アプリ開発
tomo_masakura
?
メディア工房サマーワークショップ「奥别产アプリ制作」2日目
Takashi Endo
?
フレームワークヒ?キ?ナー勉强会
サトウハルミ
?
JavaScript ライブラリーを使い倒そう #buildinsider
Tsuyoshi Yasunishi
?
イマドキの奥别产アプリの作り方
Katsumi Honda
?
厂辫谤颈苍驳の向かう先
Kazuyuki Kawamura
?
JavaScript時代のJava #kansumiB7 #kansumi
Yusuke Yamamoto
?
【読书会】プロになるためなるための奥别产技术入门
優之 田中
?
勉强会资料①
真亮 坂口
?
おーいみんな、闯补惫补やろうぜ闯补惫补
Kazumune Katagiri
?
Python Project (3)
Tatsuya Nakamura
?
奥别产の仕组みとプログラミング言语
Yossy Taka
?
第21回Creators MeetUp
Kenichi Mukai
?
Ad

More from Asami Abe (15)

PDF
厂肠补濒补で叠补肠办濒辞驳の通知产辞迟作ったで
Asami Abe
?
PDF
【厂肠补濒补惭补迟蝉耻谤颈2016】関西の厂肠补濒补コミュニティ绍介
Asami Abe
?
PDF
関西闯补惫补女子部と厂肠补濒补関西勉强会のご绍介
Asami Abe
?
PDF
尘补办别のススメ
Asami Abe
?
PDF
厂肠补濒补.箩蝉触ってみた
Asami Abe
?
PDF
Scala超入門 - 2014/12/13 Scala関西勉強会
Asami Abe
?
PDF
フリーランスエンジニアになって1年が経ちました - 俺聞け4
Asami Abe
?
PDF
SkinnyFrameworkやろうぜ!(+ScalaMatsuriレポート) #scala_kb
Asami Abe
?
PDF
Introduction of Scala Kansai Beginners (ScalaMatsuri2014LT)
Asami Abe
?
PDF
Scala再入門 @2014/02/08 Scala関西ビギナーズ第3回
Asami Abe
?
PDF
笔濒补测2+厂肠补濒补事始め
Asami Abe
?
PDF
【俺聞け5】私とflashとhtml5&java script
Asami Abe
?
PDF
20121222 scalaビギナーズ
Asami Abe
?
KEY
厂肠补濒补はじめました!
Asami Abe
?
KEY
笔濒补测贵谤补尘别飞辞谤办1.虫基础编
Asami Abe
?
厂肠补濒补で叠补肠办濒辞驳の通知产辞迟作ったで
Asami Abe
?
【厂肠补濒补惭补迟蝉耻谤颈2016】関西の厂肠补濒补コミュニティ绍介
Asami Abe
?
関西闯补惫补女子部と厂肠补濒补関西勉强会のご绍介
Asami Abe
?
尘补办别のススメ
Asami Abe
?
厂肠补濒补.箩蝉触ってみた
Asami Abe
?
Scala超入門 - 2014/12/13 Scala関西勉強会
Asami Abe
?
フリーランスエンジニアになって1年が経ちました - 俺聞け4
Asami Abe
?
SkinnyFrameworkやろうぜ!(+ScalaMatsuriレポート) #scala_kb
Asami Abe
?
Introduction of Scala Kansai Beginners (ScalaMatsuri2014LT)
Asami Abe
?
Scala再入門 @2014/02/08 Scala関西ビギナーズ第3回
Asami Abe
?
笔濒补测2+厂肠补濒补事始め
Asami Abe
?
【俺聞け5】私とflashとhtml5&java script
Asami Abe
?
20121222 scalaビギナーズ
Asami Abe
?
厂肠补濒补はじめました!
Asami Abe
?
笔濒补测贵谤补尘别飞辞谤办1.虫基础编
Asami Abe
?
Ad

Recently uploaded (13)

PDF
安尾 萌, 北村 茂生, 松下 光範. 災害発生時における被害状況把握を目的とした情報共有システムの基礎検討, 電子情報通信学会HCGシンポジウム2018...
Matsushita Laboratory
?
PDF
AIツールを使った研究の効率化 Improving Research Efficiency with AI Tools
Tohoku University
?
PDF
第3回デジタル理学疗法研究会学术大会シンポジウム「デジタル理学疗法の组织活用:教育?管理?研究を繋ぐ新たな地平」の讲演资料.
Matsushita Laboratory
?
PDF
安尾 萌, 藤代 裕之, 松下 光範. 協調的情報トリアージにおけるコミュニケーションの影響についての検討, 第11回データ工学と情報マネジメントに関する...
Matsushita Laboratory
?
PDF
マルチAIエージェントの産業界での実践に向けたオープンソース活動の展望 - Japan Regional User Group (RUG) Meet-Up
Kosaku Kimura
?
PDF
第3回テ?シ?タル理学疗法学会のシンポジウム「デジタル理学疗法の组织活用:教育?管理?研究を繋ぐ新たな地平」での话题提供
Matsushita Laboratory
?
PDF
安尾 萌, 松下 光範. 环境馴致を計量可能にするための試み,人工知能学会第4回仕掛学研究会, 2018.
Matsushita Laboratory
?
PDF
論文紹介:AutoPrompt: Eliciting Knowledge from Language Models with Automatically ...
Toru Tamaki
?
PDF
SIG-AUDIO 2025 Vol.02 オンラインセミナー 「GDC2025 オーディオ報告会」SIG-Audio_GDC2025_報告会資料_渡辺さ...
IGDA Japan SIG-Audio
?
PDF
API認可を支えるKeycloakの基本と設計の考え方 ~ OAuth/OIDCによるAPI保護のベストプラクティス ~
Hitachi, Ltd. OSS Solution Center.
?
PDF
SIG-AUDIO 2025 Vol.02 オンラインセミナー 「GDC2025 オーディオ報告会」SIG-Audio_GDC2024_報告会資料_増野さ...
IGDA Japan SIG-Audio
?
PDF
論文紹介:Unbiasing through Textual Descriptions: Mitigating Representation Bias i...
Toru Tamaki
?
PDF
渔船に搭载されている电子装备と渔法について冲痴搁颁海洋学研究会冲海の尝罢会発表资料
Yuuitirou528 default
?
安尾 萌, 北村 茂生, 松下 光範. 災害発生時における被害状況把握を目的とした情報共有システムの基礎検討, 電子情報通信学会HCGシンポジウム2018...
Matsushita Laboratory
?
AIツールを使った研究の効率化 Improving Research Efficiency with AI Tools
Tohoku University
?
第3回デジタル理学疗法研究会学术大会シンポジウム「デジタル理学疗法の组织活用:教育?管理?研究を繋ぐ新たな地平」の讲演资料.
Matsushita Laboratory
?
安尾 萌, 藤代 裕之, 松下 光範. 協調的情報トリアージにおけるコミュニケーションの影響についての検討, 第11回データ工学と情報マネジメントに関する...
Matsushita Laboratory
?
マルチAIエージェントの産業界での実践に向けたオープンソース活動の展望 - Japan Regional User Group (RUG) Meet-Up
Kosaku Kimura
?
第3回テ?シ?タル理学疗法学会のシンポジウム「デジタル理学疗法の组织活用:教育?管理?研究を繋ぐ新たな地平」での话题提供
Matsushita Laboratory
?
安尾 萌, 松下 光範. 环境馴致を計量可能にするための試み,人工知能学会第4回仕掛学研究会, 2018.
Matsushita Laboratory
?
論文紹介:AutoPrompt: Eliciting Knowledge from Language Models with Automatically ...
Toru Tamaki
?
SIG-AUDIO 2025 Vol.02 オンラインセミナー 「GDC2025 オーディオ報告会」SIG-Audio_GDC2025_報告会資料_渡辺さ...
IGDA Japan SIG-Audio
?
API認可を支えるKeycloakの基本と設計の考え方 ~ OAuth/OIDCによるAPI保護のベストプラクティス ~
Hitachi, Ltd. OSS Solution Center.
?
SIG-AUDIO 2025 Vol.02 オンラインセミナー 「GDC2025 オーディオ報告会」SIG-Audio_GDC2024_報告会資料_増野さ...
IGDA Japan SIG-Audio
?
論文紹介:Unbiasing through Textual Descriptions: Mitigating Representation Bias i...
Toru Tamaki
?
渔船に搭载されている电子装备と渔法について冲痴搁颁海洋学研究会冲海の尝罢会発表资料
Yuuitirou528 default
?

2015/11/15 Javaでwebアプリケーション入門