Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
超初心者向けWebアプリ開発講座
Search
Uchida Yuma
September 20, 2017
Education
0
82
超初心者向けWebアプリ開発講座
Uchida Yuma
September 20, 2017
Tweet
Share
Other Decks in Education
See All in Education
Info Session MSc Computer Science & MSc Applied Informatics
signer
PRO
0
190
より良い学振申請書(DC)を作ろう 2025
luiyoshida
1
3.3k
第1回大学院理工学系説明会|東京科学大学(Science Tokyo)
sciencetokyo
PRO
0
3.9k
ANS-C01_2回不合格から合格までの道程
amarelo_n24
1
260
2025年度春学期 統計学 第4回 データを「分布」で見る (2025. 5. 1)
akiraasano
PRO
0
120
Case Studies and Course Review - Lecture 12 - Information Visualisation (4019538FNR)
signer
PRO
1
2k
子どものためのプログラミング道場『CoderDojo』〜法人提携例〜 / Partnership with CoderDojo Japan
coderdojojapan
4
16k
万博非公式マップとFOSS4G
barsaka2
0
470
미국 교환학생 가서 무료 홈스테이 살면서 인턴 취업하기
maryang
0
110
Sponsor the Conference | VizChitra 2025
vizchitra
0
560
GitHubとAzureを使って開発者になろう
ymd65536
1
140
SkimaTalk Tutorial for Students
skimatalk
0
1.8k
Featured
See All Featured
We Have a Design System, Now What?
morganepeng
53
7.7k
RailsConf 2023
tenderlove
30
1.1k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
130
19k
Into the Great Unknown - MozCon
thekraken
40
1.9k
What’s in a name? Adding method to the madness
productmarketing
PRO
23
3.5k
Testing 201, or: Great Expectations
jmmastey
43
7.6k
Building Applications with DynamoDB
mza
95
6.5k
How to train your dragon (web standard)
notwaldorf
96
6.1k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Scaling GitHub
holman
460
140k
Building a Modern Day E-commerce SEO Strategy
aleyda
42
7.4k
Transcript
ະܦݧ͔Β͡ΊΔ WebΞϓϦ։ൃ גࣜձࣾϧʔτϓϥεɹଧా༟അ
ຊͷϝχϡʔ 1.ΠϯτϩμΫγϣϯ(40) 2.։ൃڥͷηοτΞοϓ(20) 3.PHPͰͷίʔσΟϯά(60) 4.࣍ճ༧ࠂ(10) 5.࣭ɺ͘͘λΠϜ(40)
• גࣜձࣾΛܦӦɹɹɹɹɹɹɹ දऔక ࣾ • 1988ੜ·Εͷ28ࡀ • ཧՊͷڭһ໔ڐΛॴ࣋ ࣗݾհ ଧా༟അ
• ٿɺࣗసंڝٕ *ࣸਅ࢜ࢁώϧΫϥΠϜϨʔε • WebΞϓϦ։ൃ • ࠷ۙσβΠϯڵຯ͋Γ ܦྺ • 20123݄ ຊେֶֶ෦ԽֶՊ ଔۀ • 20124݄ʙ 20168݄ ΩϠϊϯʢגʣͰϓϦϯλʔͷ৽։ൃɺɹɹɹ ࣭ཧʹैࣄ • 20169݄ גࣜձࣾϧʔτϓϥεΛઃཱ ϦΫΤετܕΠϯλʔϯγοϓใαΠτΛϩʔϯν झຯ
ϓϩάϥϛϯάεΩϧʹ͍ͭͯ • WebΞϓϦͷ։ൃ • ΦϒδΣΫτࢦϓϩάϥϛϯά • ֎෦APIΛͬͨ։ൃ Ͱ͖Δ͜ͱ ܦྺ 2015/11݄
)5.-$44 .Z42-1)1 खଓ͖ܕ *ϓϩάϥϛϯάΛ։࢝ 2016/6݄ *α൛ 1)1 ΦϒδΣΫτࢦ 2016/9݄ *ϩʔϯν Ϋϥυαʔόʔ Ͱͷ্ཱͪ͛ ֎෦"1*ͷར༻ 2017/3݄ ϑϨʔϜϫʔΫ ͷར༻ +"7" &DMJQTF 2016/12݄ *SNSϩάΠϯͳͲ ػೳՃ
ϓϩάϥϛϯάܦྺʹ͍ͭͯ ࠳ંVer 26ࡀ 23ࡀ "OESPJEΞϓϦɹ࠳ંʼʻ 24ࡀ 8FC੍࡞ɹ࠳ંʼʻ 3VCZPO3BJMTɹ࠳ંʼʻ 25ࡀ
+"7"࠳ંɹʼʻ Mac & iPhoneߪೖ J1IPOFΞϓϦɹ࠳ંʼʻ PHPελʔτ ίπ͕͔Ε୭ͰϓϩάϥϚʔ
ͳͥϓϩάϥϛϯάʹ࠳ં͢Δ͔ • Կ͔Β࢝ΊΕ͍͍͔Θ͔Βͳ͍ • ։ൃڥͷߏஙͰ᪴͘(ϓϩάϥϛϯάͷ४උ) • Τϥʔͷղܾํ๏͕Θ͔Βͳ͍ ϓϩάϥϜΛॻ͘ࣄҎ֎Ͱͷ͖͕᪴ཧ༝ ͍ͬͨͳ͍ʂ
ຊͷඪ • WebΞϓϦͷΈΛཧղ͢Δ • PHPΛͬͯจࣈͷग़ྗ͕Ͱ͖Δ ࣗྗͰϓϩάϥϛϯάֶश͕Ͱ͖ΔΑ͏ʹͳΔ
͜Μͳࣄ͕Ͱ͖·͢ ϓϩάϥϛϯάڭҭ WebΞϓϦ։ൃ ๏ਓͰͷறࡏҊ݅ ݪ॓ͷϕϯνϟʔاۀ ϝσΟΞӡӦ ݪ॓ͷϕϯνϟʔاۀ ϦΫΤετܕ ΠϯλʔϯγοϓใαΠτ ϚονϯάܥαʔϏεͷ
ґཔ͕ଟ͍Ͱ͢ ʙϓϩάϥϛϯάΛֶͿͱ͜ΜͳϝϦοτ͕ʙ
WebΞϓϦέʔγϣϯͱʁ • ΠϯλʔωοτଓΛલఏͱͨ͠ΞϓϦ • WebϒϥβͱWebαʔόʔ্Ͱಈ࡞͢Δ • ձһػೳΛ࣋ͭΞϓϦଟଘࡏ͢Δ
WebΞϓϦͷଓ Ϣʔβʔ ϒϥβΛ௨ͯ͡ ϦΫΤετ ϦΫΤετʹԠͯ͡ ϖʔδใΛฦ͢ Webαʔόʔ DBαʔόʔ ඞཁʹԠͯ͡ αʔόʔಉ͕࢜௨৴
WebΞϓϦέʔγϣϯͷΈ σʔλϕʔε͔Βͷग़͠ೖΕ σʔλͷग़͠ೖΕ σʔλͷड͚͠ Webϒϥβ σʔλϕʔε Webݴޠ͕հ
FacebookͰֶͿΈ σʔλϕʔεͷதΛςϯϓϨʔτʹදࣔ ݻ༗*% OBNF DPNQBOZ MBTU@DPNQBOZ BEESFTT QPTU@UJNF QPTU@DPOUFOU
ଧా༟അ גࣜձࣾ ϧʔτϓϥε ΩϠϊϯגࣜձࣾ ౦ژ࿅അ۠ ݄ ͜ͷɺגɾɾɾ σʔλϕʔεʢΠϝʔδʣ ݻ༗IDͰ ϢʔβʔΛࣝผ
FacebookͰͷ֤ݴޠͷׂ ݻ༗*% OBNF DPNQBOZ ଧా༟അ גࣜձࣾ ϧʔτϓϥε BEESFTT QPTU@UJNF
౦ژ࿅അ۠ ݄ ݟͨΛ࡞Δ σʔλͷཧ Ϣʔβʔ͔Βड͚औΔ σʔλͷอଘ σʔλͷऔΓग़͠ ϒϥβɺWebݴޠɺDBׂ͕Λ࣋ͬͯಈ͘
WebΞϓϦ։ൃͷྲྀΕ 1. اըɾཁ݅ఆٛ 2. ։ൃڥͷηοτΞοϓ 3. ϩʔΧϧڥͰͷ։ൃ 4. Webαʔόʔʹઃஔ 5.
ςετ 6. ެ։ ཁ݅ఆٛ ࠓͷϝΠϯ
ී௨ͷ։ൃڥ(ϩʔΧϧڥ)ͱ ࣗͷPC্ͰΠϯλʔωοτଓΛ࠶ݱ ٖࣅαʔόʔ 1$ͷதʹ1$Λ࡞Δ ΞΫηε
ϩʔΧϧ։ൃڥͷߏஙखॱ ࡶͳͨΊɺॳ৺ऀ࠳ં͍͢͠ 1.ԾϚγϯΛઃஔ 2.ίϚϯυϥΠϯ͔ΒԾϚγϯΛૢ࡞ 3.OS(Linux)ΛΠϯετʔϧ 4.ϛυϧΣΞ(Mysql,PHPͳͲͷιϑτ)Λɹ Πϯετʔϧ 5.FTPιϑτͰԾϚγϯʹΞΫηε
ͱ͍͏͜ͱͳͷͰʂ ϩʔΧϧ։ൃڥ͔Βಀ͛·͢
͜Ε͔ΒΫϥυ։ൃڥΛ ηοτΞοϓ͍͖ͯ͠·͠ΐ͏ʂ
Ϋϥυ։ൃڥ ʙϩʔΧϧ։ൃڥΛϒϥβͷதʹ࠶ݱʙ ٖࣅαʔόʔ 1$ͷதʹ1$Λ࡞Δ ΞΫηε
Cloud9ͱ ϒϥβͷதʹϩʔΧϧڥΛ࠶ݱͰ͖ΔαʔϏε ݁ՌදࣔΤϦΞ ։ൃΤϦΞ ϑΝΠϧཧ ΤϦΞ
Cloud9Ͱ͓खܰ։ൃ ʙϩʔΧϧ։ൃڥߏஙͱͷൺֱʙ $MPVE ϩʔΧϧ։ൃڥ ηοτΞοϓ࣌ؒ ؙ ༻πʔϧ ίϚϯυૢ࡞ ͳ͠
ඞཁ ৄࡉઃఆ ϓϩάϥϛϯάΛֶशతͳΒCloud։ൃڥ ϒϥβ όʔνϟϧϘοΫε ʴϕΠάϥϯτ
Ϋϥυ9ͷձһొ ϝʔϧΞυϨε ΫϦοΫ ϝʔϧΞυϨεͰ؆୯ʹొͰ͖·͢
Ϋϥυ9ͷϩάΠϯ ϝʔϧΞυϨε ύεϫʔυ ઌ΄ͲͷϝʔϧΞυϨεͱύεϫʔυͰϩάΠϯ
࡞ۀεϖʔεͷηοτΞοϓ ϩάΠϯޙ͜ͷը໘Ͱ͋Δ͜ͱΛ֬ೝ ʴΛΫϦοΫ WorkSpaceͷʴΛΫϦοΫͯ͠࡞ۀεϖʔεΛ࡞
ඞཁ߲ͷೖྗ ϓϩάϥϜͷ໊લ PHPΛબͿ ͷϘλϯΛΫϦοΫ ͨͬͨ3εςοϓͰOK 1. ໊લΛೖྗ 2. ͏ݴޠΛબͿ 3.
OKϘλϯΛԡ͢ ۭനͰOK ۭനͰOK
։ൃڥ͕ ೖྗͨ͠ϓϩάϥϜ໊ͷϑΥϧμ͕ଘࡏ͢ΕOK
PHPͰϓϩάϥϜΛॻ͜͏ʂ
ࠓͷษڧձͰѻ͏ൣғ σʔλͷग़͠ೖΕ σʔλͷड͚͠
ࠓͷඪ PHPͰจࣈΛग़ྗͰ͖Δ PHPͱHTMLΛΈ߹ΘͤͯίʔσΟϯάͰ͖Δ HTML͔Βड͚औͬͨจࣈΛPHPͰ͑Δ
͜ͷϓϩάϥϜΛ࡞͍͖ͬͯ·͢
PHPϑΝΠϧͷ४උ 1.Կͳ͍ॴͰӈΫϦοΫ 2.New File 3.index.phpͱೖྗ ʙαΠτʹΞΫηεͨ͠ࡍʹಡΈࠐ·ΕΔϑΝΠϧΛ࡞ʙ index.php͕࠷ॳʹಡΈࠐ·ΕΔ
HTMLͷ४උ ~PHPʹσʔλΛૹΔͨΊͷϑΥʔϜΛ༻ҙ͍͖ͯ͠·͢~ ຊޠ จࣈͷॲཧํ๏ ϒϥβͷදࣔ͞ΕΔλΠτϧ bodyλάͷؒʹ ॻ͔Εͨͷ͕ ϒϥβʹදࣔ͞ΕΔ formλάॏཁͳͷͰ࣍ϖʔδͰৄ͘͠ղઆ
formλάͷղઆ ~formλάͰPHPͱ࿈ܞ~ ࣍formͷதΛॻ͍͍͖ͯ·͢ formλάͱʁ σʔλΛૹ৴͢ΔͨΊͷϑΥʔϜΛ ࡞ΔͨΊͷλά ࠓճ͏formλάͷॻ͖ํ <form action=“” method=“post”>
</form> •action:ૹ৴ͨ࣌͠ͷಈ͖ •method:σʔλͷૹ৴ํ๏ ಉ͡ϖʔδͰσʔλΛड͚औΔͷͰۭ postͱget͕͋ΔɻࠓPOSTΛ༻
<form action=“” method=“post”> <input type=“text” name=“data”> <input type=“submit” name=“datapost” value=“໊લΛૹ৴”
</form> formͷதΛ࡞Ζ͏ จࣈྻ σʔλͷϥϕϧ(ҙʹܾΊΒΕΔ) σʔλͷϥϕϧ(ҙʹܾΊΒΕΔ) ϑΥʔϜσʔλͷૹ৴
PHPͰσʔλΛड͚औΖ͏ <form action=“” method=“post”> <input type=“text” name=“data”> <input type=“submit” name=“datapost”
value=“໊લΛૹ৴”> </form> ͜ͷϑΥʔϜ(postϝιου)ʹೖྗͨ͠σʔλ PHPͰ͏ࡍʹ$_POST[“data”]Ͱड͚औΔ͜ͱͰ͖Δ ˎHTMLϑΥʔϜͰૹ৴ͨ͠σʔλPHPͷม$_POSTʹ֨ೲ͞ΕΔ
<?php echo $_POST[“data”]; ?> ड͚औͬͨσʔλΛPHPͰදࣔ ~PHPͰจࣈྻΛදࣔ͢Δʹʁ HTMLͷதʹPHPΛॻ͘ʹ จࣈྻΛग़ྗ͢Δ໋ྩ ֯εϖʔε HTML͔Βड͚औͬͨσʔλ
໋ྩͷ࠷ޙηϛίϩϯ
PHPͰϒϥβʹจࣈΛදࣔ͠Α͏ <body> <h1>σʔλड͚औΓϓϩάϥϜ</h1> <p>໊͓લΛೖྗ͍ͯͩ͘͠͞</p> <form action="" method="post"> <input type="text"
name="data"> <input type="submit" name="datapost"> </form> <?php echo $_POST["data"]; ?> </body> </html> HTMLͷதʹPHPΛॻ͘ʹ ද͍ࣔͤͨ͞෦ʹ PHPεΫϦϓτΛૠೖ
࣍ճ༧ࠂ
σʔλϕʔεૢ࡞ฤ σʔλͷग़͠ೖΕ σʔλͷड͚͠