SlideShare a Scribd company logo
1 of 7
1	
Copyright (c) 株式会社HEART QUAKE All rights reserved .	
投稿機能をつくろう  
HTMLとPHPの連携
2	
Copyright (c) 株式会社HEART QUAKE All rights reserved .	
処理理の流流れ
情報を⼊入⼒力力する1 2 3
HTML
HTMLから情報をもらう
&SQLを実⾏行行する
情報を登録する
PHP SQL
3	
Copyright (c) 株式会社HEART QUAKE All rights reserved .	
HTMLとPHPの連携(1/3)
l ゴールイメージ
- ⼊入⼒力力されたツイート内容を表⽰示する
⼊入⼒力力画⾯面 完了了画⾯面
HTML
⽂文字を⼊入⼒力力してボタンを
押すと投稿内容が反映される
4	
Copyright (c) 株式会社HEART QUAKE All rights reserved .	
HTMLとPHPの連携(2/3)
l まずは⼊入⼒力力欄を作成しよう
投稿内容を入力してください。
<form action =”post.php” method=”get”>
<textarea name=”memo”>
</textarea>
<input type=”submit”
value=”投稿送信”>
</form>
HTML
actionには次に実⾏行行したい
phpのファイルを記述する。
methodにはGETとPOST
が存在する
textareaに名称(name)を  
つける。(名前は任意)
復復習
5	
Copyright (c) 株式会社HEART QUAKE All rights reserved .	
HTMLとPHPの連携(3/3)
l PHPで内容を受け取ろう(post.php)
投稿が完了しました。
<?php
echo $_GET[”memo”];
?>
HTMLからデータを受け取るとき
(GET形式の場合)
$_GET[”HTMLで指定したname”]
6	
Copyright (c) 株式会社HEART QUAKE All rights reserved .	
HTMLとPHPの連携(おまけ)
l PHPで内容を受け取ろう(post.php)
投稿が完了しました。
<?php
echo $_GET[”memo”];
echo ”<br>” ;
echo $_GET[”nickname”];
?>
ダブルクォーテーションで
囲むとHTMLを書くことができる。
7	
Copyright (c) 株式会社HEART QUAKE All rights reserved .	
お疲れ様でした!!

More Related Content

Viewers also liked

経営シミュレーションゲーム型研修「屋台屋本舗」
経営シミュレーションゲーム型研修「屋台屋本舗」経営シミュレーションゲーム型研修「屋台屋本舗」
経営シミュレーションゲーム型研修「屋台屋本舗」Jun Chiba
 
Reservation2
Reservation2Reservation2
Reservation2Jun Chiba
 
Array facebook2
Array facebook2Array facebook2
Array facebook2Jun Chiba
 
ゼロプロ3周年
ゼロプロ3周年ゼロプロ3周年
ゼロプロ3周年Jun Chiba
 

Viewers also liked (20)

System s2
System s2System s2
System s2
 
My sql s2
My sql s2My sql s2
My sql s2
 
Php s2
Php s2Php s2
Php s2
 
My sql s3
My sql s3My sql s3
My sql s3
 
Php2 s3
Php2 s3Php2 s3
Php2 s3
 
Php2 s1
Php2 s1Php2 s1
Php2 s1
 
Php2 s2
Php2 s2Php2 s2
Php2 s2
 
Php2 s4
Php2 s4Php2 s4
Php2 s4
 
経営シミュレーションゲーム型研修「屋台屋本舗」
経営シミュレーションゲーム型研修「屋台屋本舗」経営シミュレーションゲーム型研修「屋台屋本舗」
経営シミュレーションゲーム型研修「屋台屋本舗」
 
Php s4
Php s4Php s4
Php s4
 
System2 s2
System2 s2System2 s2
System2 s2
 
Reservation2
Reservation2Reservation2
Reservation2
 
Mg
MgMg
Mg
 
Jquery1 1
Jquery1 1Jquery1 1
Jquery1 1
 
Stristr
StristrStristr
Stristr
 
Array facebook2
Array facebook2Array facebook2
Array facebook2
 
Bootstrap
BootstrapBootstrap
Bootstrap
 
Api twitter
Api twitterApi twitter
Api twitter
 
System1
System1System1
System1
 
ゼロプロ3周年
ゼロプロ3周年ゼロプロ3周年
ゼロプロ3周年
 

Similar to Php s3

Php embedded
Php embeddedPhp embedded
Php embeddedJun Chiba
 
System2 for h
System2 for hSystem2 for h
System2 for hJun Chiba
 
Image register
Image registerImage register
Image registerJun Chiba
 
Image register for_h
Image register for_hImage register for_h
Image register for_hJun Chiba
 
Array twitter
Array twitterArray twitter
Array twitterJun Chiba
 
HTTP/2時代のウェブサイト設計
HTTP/2時代のウェブサイト設計HTTP/2時代のウェブサイト設計
HTTP/2時代のウェブサイト設計Kazuho Oku
 
System2 ajax
System2 ajaxSystem2 ajax
System2 ajaxJun Chiba
 
Tech.G HTML5 プレ講座
Tech.G HTML5 プレ講座Tech.G HTML5 プレ講座
Tech.G HTML5 プレ講座Atsushi Miura
 
Original shindan
Original shindanOriginal shindan
Original shindanJun Chiba
 
第43回HTML5とか勉強会 最新webプロトコル傾向と対策
第43回HTML5とか勉強会 最新webプロトコル傾向と対策第43回HTML5とか勉強会 最新webプロトコル傾向と対策
第43回HTML5とか勉強会 最新webプロトコル傾向と対策Kensaku Komatsu
 
FuelPHP活用事例
FuelPHP活用事例FuelPHP活用事例
FuelPHP活用事例Yusuke Naka
 
【Logic Apps編】ノンコーディングでデキる!お問い合わせフォーム機能拡張
【Logic Apps編】ノンコーディングでデキる!お問い合わせフォーム機能拡張【Logic Apps編】ノンコーディングでデキる!お問い合わせフォーム機能拡張
【Logic Apps編】ノンコーディングでデキる!お問い合わせフォーム機能拡張典子 松本
 
ドキュメントシステムはこれを使え2015年版
ドキュメントシステムはこれを使え2015年版ドキュメントシステムはこれを使え2015年版
ドキュメントシステムはこれを使え2015年版Keiichiro Shikano
 
HTTPとサーブレット
HTTPとサーブレットHTTPとサーブレット
HTTPとサーブレットTakashi Makino
 
今日からはじめるHTML5 ver.2012
今日からはじめるHTML5 ver.2012今日からはじめるHTML5 ver.2012
今日からはじめるHTML5 ver.2012Yasuhito Yabe
 

Similar to Php s3 (20)

Php2
Php2Php2
Php2
 
FormCreate
FormCreateFormCreate
FormCreate
 
Php embedded
Php embeddedPhp embedded
Php embedded
 
System2 for h
System2 for hSystem2 for h
System2 for h
 
Image register
Image registerImage register
Image register
 
Image register for_h
Image register for_hImage register for_h
Image register for_h
 
Html s1
Html s1Html s1
Html s1
 
HTML
HTMLHTML
HTML
 
Html1
Html1Html1
Html1
 
Array twitter
Array twitterArray twitter
Array twitter
 
HTTP/2時代のウェブサイト設計
HTTP/2時代のウェブサイト設計HTTP/2時代のウェブサイト設計
HTTP/2時代のウェブサイト設計
 
System2 ajax
System2 ajaxSystem2 ajax
System2 ajax
 
Tech.G HTML5 プレ講座
Tech.G HTML5 プレ講座Tech.G HTML5 プレ講座
Tech.G HTML5 プレ講座
 
Original shindan
Original shindanOriginal shindan
Original shindan
 
第43回HTML5とか勉強会 最新webプロトコル傾向と対策
第43回HTML5とか勉強会 最新webプロトコル傾向と対策第43回HTML5とか勉強会 最新webプロトコル傾向と対策
第43回HTML5とか勉強会 最新webプロトコル傾向と対策
 
FuelPHP活用事例
FuelPHP活用事例FuelPHP活用事例
FuelPHP活用事例
 
【Logic Apps編】ノンコーディングでデキる!お問い合わせフォーム機能拡張
【Logic Apps編】ノンコーディングでデキる!お問い合わせフォーム機能拡張【Logic Apps編】ノンコーディングでデキる!お問い合わせフォーム機能拡張
【Logic Apps編】ノンコーディングでデキる!お問い合わせフォーム機能拡張
 
ドキュメントシステムはこれを使え2015年版
ドキュメントシステムはこれを使え2015年版ドキュメントシステムはこれを使え2015年版
ドキュメントシステムはこれを使え2015年版
 
HTTPとサーブレット
HTTPとサーブレットHTTPとサーブレット
HTTPとサーブレット
 
今日からはじめるHTML5 ver.2012
今日からはじめるHTML5 ver.2012今日からはじめるHTML5 ver.2012
今日からはじめるHTML5 ver.2012
 

More from Jun Chiba

セルフケア研修で使えるカードゲーム『攻略!きみのストレスを発見せよ!: ゲームで身につくストレスマネジメント』
セルフケア研修で使えるカードゲーム『攻略!きみのストレスを発見せよ!: ゲームで身につくストレスマネジメント』セルフケア研修で使えるカードゲーム『攻略!きみのストレスを発見せよ!: ゲームで身につくストレスマネジメント』
セルフケア研修で使えるカードゲーム『攻略!きみのストレスを発見せよ!: ゲームで身につくストレスマネジメント』Jun Chiba
 
答えのないコンセンサスゲーム「無人島での出来事」運営用パワーポイントスライド説明資料
答えのないコンセンサスゲーム「無人島での出来事」運営用パワーポイントスライド説明資料答えのないコンセンサスゲーム「無人島での出来事」運営用パワーポイントスライド説明資料
答えのないコンセンサスゲーム「無人島での出来事」運営用パワーポイントスライド説明資料Jun Chiba
 
合意形成(コンセンサス)ゲーム「月での遭難 in 2025」(NASAゲーム2025)
合意形成(コンセンサス)ゲーム「月での遭難 in 2025」(NASAゲーム2025)合意形成(コンセンサス)ゲーム「月での遭難 in 2025」(NASAゲーム2025)
合意形成(コンセンサス)ゲーム「月での遭難 in 2025」(NASAゲーム2025)Jun Chiba
 
システム思考、全体最適、SCMを体験から学ぶボードゲーム「ビールゲーム」概要説明資料
システム思考、全体最適、SCMを体験から学ぶボードゲーム「ビールゲーム」概要説明資料システム思考、全体最適、SCMを体験から学ぶボードゲーム「ビールゲーム」概要説明資料
システム思考、全体最適、SCMを体験から学ぶボードゲーム「ビールゲーム」概要説明資料Jun Chiba
 
財務・会計を楽しく学ぶビジネスゲーム型財務・会計研修「財務の虎Lv.1」の概要説明資料
財務・会計を楽しく学ぶビジネスゲーム型財務・会計研修「財務の虎Lv.1」の概要説明資料財務・会計を楽しく学ぶビジネスゲーム型財務・会計研修「財務の虎Lv.1」の概要説明資料
財務・会計を楽しく学ぶビジネスゲーム型財務・会計研修「財務の虎Lv.1」の概要説明資料Jun Chiba
 
プロジェクトマネジメントを疑似体験するボードゲーム型企業研修「プロジェクトテーマパーク」
プロジェクトマネジメントを疑似体験するボードゲーム型企業研修「プロジェクトテーマパーク」プロジェクトマネジメントを疑似体験するボードゲーム型企業研修「プロジェクトテーマパーク」
プロジェクトマネジメントを疑似体験するボードゲーム型企業研修「プロジェクトテーマパーク」Jun Chiba
 
バルーンバ人文化を探れ!パワーポイント・動画マニュアル販売用のスライドシェア資料
バルーンバ人文化を探れ!パワーポイント・動画マニュアル販売用のスライドシェア資料バルーンバ人文化を探れ!パワーポイント・動画マニュアル販売用のスライドシェア資料
バルーンバ人文化を探れ!パワーポイント・動画マニュアル販売用のスライドシェア資料Jun Chiba
 
内定者/新入社員向け ビジネスライティング研修用パワーポイントスライド販売用サンプル
内定者/新入社員向け ビジネスライティング研修用パワーポイントスライド販売用サンプル内定者/新入社員向け ビジネスライティング研修用パワーポイントスライド販売用サンプル
内定者/新入社員向け ビジネスライティング研修用パワーポイントスライド販売用サンプルJun Chiba
 
図形伝達ゲーム「グラコミ」
図形伝達ゲーム「グラコミ」図形伝達ゲーム「グラコミ」
図形伝達ゲーム「グラコミ」Jun Chiba
 
傾聴力を高めるビジネスゲーム「傾聴チャレンジ」
傾聴力を高めるビジネスゲーム「傾聴チャレンジ」傾聴力を高めるビジネスゲーム「傾聴チャレンジ」
傾聴力を高めるビジネスゲーム「傾聴チャレンジ」Jun Chiba
 
無料アイスブレイクスライドサンプル
無料アイスブレイクスライドサンプル無料アイスブレイクスライドサンプル
無料アイスブレイクスライドサンプルJun Chiba
 
ストレスマネジメント体験ゲーム「ストマネ」
ストレスマネジメント体験ゲーム「ストマネ」ストレスマネジメント体験ゲーム「ストマネ」
ストレスマネジメント体験ゲーム「ストマネ」Jun Chiba
 
ベストチームオンライン説明スライド
ベストチームオンライン説明スライドベストチームオンライン説明スライド
ベストチームオンライン説明スライドJun Chiba
 
死の疑似体験ワーク 対面版
死の疑似体験ワーク 対面版死の疑似体験ワーク 対面版
死の疑似体験ワーク 対面版Jun Chiba
 
地図作成ゲーム「ジグソータウン」説明資料
地図作成ゲーム「ジグソータウン」説明資料地図作成ゲーム「ジグソータウン」説明資料
地図作成ゲーム「ジグソータウン」説明資料Jun Chiba
 
プロジェクトテーマパーク説明資料
プロジェクトテーマパーク説明資料プロジェクトテーマパーク説明資料
プロジェクトテーマパーク説明資料Jun Chiba
 
死の疑似体験ワーク(対面版)説明資料
死の疑似体験ワーク(対面版)説明資料死の疑似体験ワーク(対面版)説明資料
死の疑似体験ワーク(対面版)説明資料Jun Chiba
 
ヘリウムリング&フープリレー
ヘリウムリング&フープリレーヘリウムリング&フープリレー
ヘリウムリング&フープリレーJun Chiba
 
世界記録を目指すマシュマロチャレンジ
世界記録を目指すマシュマロチャレンジ世界記録を目指すマシュマロチャレンジ
世界記録を目指すマシュマロチャレンジJun Chiba
 
相互理解ワークショップ、内定者懇親会で使えるワークスタイルトランプ
相互理解ワークショップ、内定者懇親会で使えるワークスタイルトランプ相互理解ワークショップ、内定者懇親会で使えるワークスタイルトランプ
相互理解ワークショップ、内定者懇親会で使えるワークスタイルトランプJun Chiba
 

More from Jun Chiba (20)

セルフケア研修で使えるカードゲーム『攻略!きみのストレスを発見せよ!: ゲームで身につくストレスマネジメント』
セルフケア研修で使えるカードゲーム『攻略!きみのストレスを発見せよ!: ゲームで身につくストレスマネジメント』セルフケア研修で使えるカードゲーム『攻略!きみのストレスを発見せよ!: ゲームで身につくストレスマネジメント』
セルフケア研修で使えるカードゲーム『攻略!きみのストレスを発見せよ!: ゲームで身につくストレスマネジメント』
 
答えのないコンセンサスゲーム「無人島での出来事」運営用パワーポイントスライド説明資料
答えのないコンセンサスゲーム「無人島での出来事」運営用パワーポイントスライド説明資料答えのないコンセンサスゲーム「無人島での出来事」運営用パワーポイントスライド説明資料
答えのないコンセンサスゲーム「無人島での出来事」運営用パワーポイントスライド説明資料
 
合意形成(コンセンサス)ゲーム「月での遭難 in 2025」(NASAゲーム2025)
合意形成(コンセンサス)ゲーム「月での遭難 in 2025」(NASAゲーム2025)合意形成(コンセンサス)ゲーム「月での遭難 in 2025」(NASAゲーム2025)
合意形成(コンセンサス)ゲーム「月での遭難 in 2025」(NASAゲーム2025)
 
システム思考、全体最適、SCMを体験から学ぶボードゲーム「ビールゲーム」概要説明資料
システム思考、全体最適、SCMを体験から学ぶボードゲーム「ビールゲーム」概要説明資料システム思考、全体最適、SCMを体験から学ぶボードゲーム「ビールゲーム」概要説明資料
システム思考、全体最適、SCMを体験から学ぶボードゲーム「ビールゲーム」概要説明資料
 
財務・会計を楽しく学ぶビジネスゲーム型財務・会計研修「財務の虎Lv.1」の概要説明資料
財務・会計を楽しく学ぶビジネスゲーム型財務・会計研修「財務の虎Lv.1」の概要説明資料財務・会計を楽しく学ぶビジネスゲーム型財務・会計研修「財務の虎Lv.1」の概要説明資料
財務・会計を楽しく学ぶビジネスゲーム型財務・会計研修「財務の虎Lv.1」の概要説明資料
 
プロジェクトマネジメントを疑似体験するボードゲーム型企業研修「プロジェクトテーマパーク」
プロジェクトマネジメントを疑似体験するボードゲーム型企業研修「プロジェクトテーマパーク」プロジェクトマネジメントを疑似体験するボードゲーム型企業研修「プロジェクトテーマパーク」
プロジェクトマネジメントを疑似体験するボードゲーム型企業研修「プロジェクトテーマパーク」
 
バルーンバ人文化を探れ!パワーポイント・動画マニュアル販売用のスライドシェア資料
バルーンバ人文化を探れ!パワーポイント・動画マニュアル販売用のスライドシェア資料バルーンバ人文化を探れ!パワーポイント・動画マニュアル販売用のスライドシェア資料
バルーンバ人文化を探れ!パワーポイント・動画マニュアル販売用のスライドシェア資料
 
内定者/新入社員向け ビジネスライティング研修用パワーポイントスライド販売用サンプル
内定者/新入社員向け ビジネスライティング研修用パワーポイントスライド販売用サンプル内定者/新入社員向け ビジネスライティング研修用パワーポイントスライド販売用サンプル
内定者/新入社員向け ビジネスライティング研修用パワーポイントスライド販売用サンプル
 
図形伝達ゲーム「グラコミ」
図形伝達ゲーム「グラコミ」図形伝達ゲーム「グラコミ」
図形伝達ゲーム「グラコミ」
 
傾聴力を高めるビジネスゲーム「傾聴チャレンジ」
傾聴力を高めるビジネスゲーム「傾聴チャレンジ」傾聴力を高めるビジネスゲーム「傾聴チャレンジ」
傾聴力を高めるビジネスゲーム「傾聴チャレンジ」
 
無料アイスブレイクスライドサンプル
無料アイスブレイクスライドサンプル無料アイスブレイクスライドサンプル
無料アイスブレイクスライドサンプル
 
ストレスマネジメント体験ゲーム「ストマネ」
ストレスマネジメント体験ゲーム「ストマネ」ストレスマネジメント体験ゲーム「ストマネ」
ストレスマネジメント体験ゲーム「ストマネ」
 
ベストチームオンライン説明スライド
ベストチームオンライン説明スライドベストチームオンライン説明スライド
ベストチームオンライン説明スライド
 
死の疑似体験ワーク 対面版
死の疑似体験ワーク 対面版死の疑似体験ワーク 対面版
死の疑似体験ワーク 対面版
 
地図作成ゲーム「ジグソータウン」説明資料
地図作成ゲーム「ジグソータウン」説明資料地図作成ゲーム「ジグソータウン」説明資料
地図作成ゲーム「ジグソータウン」説明資料
 
プロジェクトテーマパーク説明資料
プロジェクトテーマパーク説明資料プロジェクトテーマパーク説明資料
プロジェクトテーマパーク説明資料
 
死の疑似体験ワーク(対面版)説明資料
死の疑似体験ワーク(対面版)説明資料死の疑似体験ワーク(対面版)説明資料
死の疑似体験ワーク(対面版)説明資料
 
ヘリウムリング&フープリレー
ヘリウムリング&フープリレーヘリウムリング&フープリレー
ヘリウムリング&フープリレー
 
世界記録を目指すマシュマロチャレンジ
世界記録を目指すマシュマロチャレンジ世界記録を目指すマシュマロチャレンジ
世界記録を目指すマシュマロチャレンジ
 
相互理解ワークショップ、内定者懇親会で使えるワークスタイルトランプ
相互理解ワークショップ、内定者懇親会で使えるワークスタイルトランプ相互理解ワークショップ、内定者懇親会で使えるワークスタイルトランプ
相互理解ワークショップ、内定者懇親会で使えるワークスタイルトランプ
 

Php s3

  • 1. 1 Copyright (c) 株式会社HEART QUAKE All rights reserved . 投稿機能をつくろう   HTMLとPHPの連携
  • 2. 2 Copyright (c) 株式会社HEART QUAKE All rights reserved . 処理理の流流れ 情報を⼊入⼒力力する1 2 3 HTML HTMLから情報をもらう &SQLを実⾏行行する 情報を登録する PHP SQL
  • 3. 3 Copyright (c) 株式会社HEART QUAKE All rights reserved . HTMLとPHPの連携(1/3) l ゴールイメージ - ⼊入⼒力力されたツイート内容を表⽰示する ⼊入⼒力力画⾯面 完了了画⾯面 HTML ⽂文字を⼊入⼒力力してボタンを 押すと投稿内容が反映される
  • 4. 4 Copyright (c) 株式会社HEART QUAKE All rights reserved . HTMLとPHPの連携(2/3) l まずは⼊入⼒力力欄を作成しよう 投稿内容を入力してください。 <form action =”post.php” method=”get”> <textarea name=”memo”> </textarea> <input type=”submit” value=”投稿送信”> </form> HTML actionには次に実⾏行行したい phpのファイルを記述する。 methodにはGETとPOST が存在する textareaに名称(name)を   つける。(名前は任意) 復復習
  • 5. 5 Copyright (c) 株式会社HEART QUAKE All rights reserved . HTMLとPHPの連携(3/3) l PHPで内容を受け取ろう(post.php) 投稿が完了しました。 <?php echo $_GET[”memo”]; ?> HTMLからデータを受け取るとき (GET形式の場合) $_GET[”HTMLで指定したname”]
  • 6. 6 Copyright (c) 株式会社HEART QUAKE All rights reserved . HTMLとPHPの連携(おまけ) l PHPで内容を受け取ろう(post.php) 投稿が完了しました。 <?php echo $_GET[”memo”]; echo ”<br>” ; echo $_GET[”nickname”]; ?> ダブルクォーテーションで 囲むとHTMLを書くことができる。
  • 7. 7 Copyright (c) 株式会社HEART QUAKE All rights reserved . お疲れ様でした!!