Slide 1

Slide 1 text

PerlでCGIスクリプトを書いてみた ゆるWeb勉強会@札幌 #27 / フロントエンドカンファレンス北海道2024 お疲れ様会 うーたん

Slide 2

Slide 2 text

自己紹介

Slide 3

Slide 3 text

自己紹介 ● うーたん ○ X:@uutan1108 ● 株式会社ゆめみ ○ 新卒2年目 ○ サーバーサイドエンジニア ● 趣味 ○ アニメを観ること

Slide 4

Slide 4 text

私とゆるWeb勉強会@札幌

Slide 5

Slide 5 text

初めてのLT発表|うーたん https://note.com/uutan1108/n/nffce0e70facd

Slide 6

Slide 6 text

オンラインの時のゆるWebだったけど楽しかった ● ワイワイする時間がいい ● ハッシュタグでリアクションしてくださる方が多くて いい ● 当時大学生の私でも発表しやすくてよかった ● 司会、運営のtacckさんから感想がもらえるのがいい

Slide 7

Slide 7 text

以上、私とゆるWeb勉強会@札幌でした

Slide 8

Slide 8 text

本題 「PerlでCGIスクリプトを書いてみた」

Slide 9

Slide 9 text

CGIとは

Slide 10

Slide 10 text

CGIとは? CGI とは Common Gateway Interface の略です。通常の ページでは、あらかじめ用意された HTML ページを表示す るだけですが、CGI を用いることにより、例えば、以下の ようなページを作成することができるようになります。 - カウンター - チャット - 掲示板 - アンケートフォーム CGIの概要 - とほほのWWW入門 https://www.tohoho-web.com/wwwcgi1.htm

Slide 11

Slide 11 text

CGIスクリプトとは 「CGIプログラム」のうち、Perl、awk、sh などコンパイ ル作業が不要なスクリプト言語で記述されたものを「CGI スクリプト」と呼びます。CGI プログラムは Perl で記述 されたものが多いですが、環境変数と標準入力を参照でき て、結果を標準出力に書き出せるものであれば、C言語、 C++言語、VisualBasic でも何でも構いません。 CGIの概要 - とほほのWWW入門 https://www.tohoho-web.com/wwwcgi1.htm

Slide 12

Slide 12 text

CGIスクリプトとは 「CGIプログラム」のうち、Perl、awk、sh などコンパイ ル作業が不要なスクリプト言語で記述されたものを「CGI スクリプト」と呼びます。CGI プログラムは Perl で記述さ れたものが多いですが、環境変数と標準入力を参照でき て、結果を標準出力に書き出せるものであれば、C言語、 C++言語、VisualBasic でも何でも構いません。 CGIの概要 - とほほのWWW入門 https://www.tohoho-web.com/wwwcgi1.htm

Slide 13

Slide 13 text

まずはPerlでCGIを書いてみる

Slide 14

Slide 14 text

アイドルマスター(765プロ、346プロ) のアイドル 検索アプリ

Slide 15

Slide 15 text

No content

Slide 16

Slide 16 text

No content

Slide 17

Slide 17 text

機能 - キャラクターの情報で検索 - クエリパラメータで検索機能 - キャラクターの名前漢字または名前カナで検索機能

Slide 18

Slide 18 text

構成図

Slide 19

Slide 19 text

Perl(CGIスクリプト) +Apache+MySQL

Slide 20

Slide 20 text

No content

Slide 21

Slide 21 text

Perlを書いた感想

Slide 22

Slide 22 text

書いてみてへぇと思ったところを紹介

Slide 23

Slide 23 text

サブルーチン🤔

Slide 24

Slide 24 text

ユーザーが定義する関数 Perl では様々な組み込み関数が用意されていますが、自分 で関数を定義することも可能です。 ユーザーが定義する関数をサブルーチンと呼びます。 Perl | サブルーチン https://www.javadrive.jp/perl/sub/

Slide 25

Slide 25 text

もう少し詳しく

Slide 26

Slide 26 text

サブルーチンとは🤔 #!/usr/bin/perl sub hello { my ($world) = @_; return "Hello " . $world; } my $result = hello("World"); print $result;

Slide 27

Slide 27 text

サブルーチンとは🤔 #!/usr/bin/perl sub hello { my ($world) = @_; return "Hello " . $world; } my $result = hello("World"); print $result; サブルーチンを呼び出す

Slide 28

Slide 28 text

サブルーチンとは🤔 #!/usr/bin/perl sub hello { my ($world) = @_; return "Hello " . $world; } my $result = hello("World"); print $result; @_ に引数”World”

Slide 29

Slide 29 text

サブルーチンとは🤔 #!/usr/bin/perl sub hello { my ($world) = @_; return "Hello " . $world; } my $result = hello("World"); print $result; . で“Hello”と”World”を連結

Slide 30

Slide 30 text

サブルーチンとは🤔 #!/usr/bin/perl sub hello { my ($world) = @_; return "Hello " . $world; } my $result = hello("World"); print $result; 文字列の Hello World が出力

Slide 31

Slide 31 text

へぇ 💡

Slide 32

Slide 32 text

$ と @ の違い🤔

Slide 33

Slide 33 text

$と@の違いは、データの種類 $: スカラ変数を表し、単一の値(例えば、数字や文字列) を保持する 例: $scalar = 10; → 1つの値を保持する @: 配列を表し、複数の値を保持する 例: @array = (1, 2, 3); → 複数の値を保持する

Slide 34

Slide 34 text

$: スカラ変数 #!/usr/bin/perl my $message = "Hello"; print $message; 文字列の Hello が出力

Slide 35

Slide 35 text

@: 配列 #!/usr/bin/perl my @nums = (1, 2, 3); print @nums; 配列の 123 が出力

Slide 36

Slide 36 text

もう少し詳しく

Slide 37

Slide 37 text

$ と @ の違いは🤔 #!/usr/bin/perl my $array_ref = [1, 2, 3]; my @array = @$array_ref; print @array; my ($data) = @array; print $data;

Slide 38

Slide 38 text

$ と @ の違いは🤔 #!/usr/bin/perl my $array_ref = [1, 2, 3]; my @array = @$array_ref; print @array; my ($data) = @array; print $data; 配列のリファレンス

Slide 39

Slide 39 text

$ と @ の違いは🤔 #!/usr/bin/perl my $array_ref = [1, 2, 3]; 配列のリファレンス

Slide 40

Slide 40 text

$ と @ の違いは🤔 #!/usr/bin/perl my $array_ref = [1, 2, 3]; print $array_ref > ARRAY(0x560c6a730788) リファレンスが得られる

Slide 41

Slide 41 text

$ と @ の違いは🤔 #!/usr/bin/perl my $array_ref = [1, 2, 3]; my @array = @$array_ref; print @array; my ($data) = @array; print $data; デリファレンス

Slide 42

Slide 42 text

$ と @ の違いは🤔 #!/usr/bin/perl my @array = @$array_ref; デリファレンス

Slide 43

Slide 43 text

$ と @ の違いは🤔 #!/usr/bin/perl my @array = @$array_ref; print $array_ref > ARRAY(0x560c6a730788) print @$array_ref; > 123 リファレンス先の値を参照して出力する

Slide 44

Slide 44 text

$ と @ の違いは🤔 #!/usr/bin/perl my $array_ref = [1, 2, 3]; my @array = @$array_ref; print @array; my ($data) = @array; print $data; 配列の (1, 2, 3) を出力

Slide 45

Slide 45 text

$ と @ の違いは🤔 #!/usr/bin/perl my $array_ref = [1, 2, 3]; my @array = @$array_ref; print @array; my ($data) = @array; print $data; 配列の先頭の要素を $data に代入

Slide 46

Slide 46 text

$ と @ の違いは🤔 #!/usr/bin/perl my $array_ref = [1, 2, 3]; my @array = @$array_ref; print @array; my ($data) = @array; print $data; $data の 1 を出力

Slide 47

Slide 47 text

へぇ 💡

Slide 48

Slide 48 text

最後に

Slide 49

Slide 49 text

アイドル図鑑のコード

Slide 50

Slide 50 text

No content

Slide 51

Slide 51 text

タグの閉じ忘れでスタイル崩れてしんどかった

Slide 52

Slide 52 text

宣伝

Slide 53

Slide 53 text

PHPカンファレンス沖縄2024前夜祭 で登壇します PHPカンファレンス沖縄2024前夜祭 - connpass https://phpcon-okinawa.connpass.com/event/324902/

Slide 54

Slide 54 text

Scrum Fest Mikawa 2024 で登壇します Scrum Fest Mikawa 2024 - 新卒エンジニアが組織に馴染むために勉強会を主催して職能間の境界を越える | ConfEngine - Conference Platform https://confengine.com/conferences/scrum-fest-mikawa-2024/proposal/20268

Slide 55

Slide 55 text

アイドル名簿(今回作ったアプリのコード) OHMORIYUSUKE/perl-mysql-apache-on-docker https://github.com/OHMORIYUSUKE/perl-mysql-apach e-on-docker

Slide 56

Slide 56 text

お わ り