TechAcademy（テックアカデミー） プログラミング Python PythonでCGIスクリプトを書く方法【初心者向け】
オーダーメイドコース
icon
icon
Python

PythonでCGIスクリプトを書く方法【初心者向け】

初心者向けにPythonでCGIスクリプトを書く方法について解説しています。CGIを使うとレンタルサーバーなどでWebサイトの一部として動作させることが出来ます。Pythonでも掲示板やWebアプリケーションを作成することが出来るようになります。

テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社　調査期間：2021年8月12日～8月16日　 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名　 調査手法：インターネット調査

PythonでCGIスクリプトを書く方法について解説します。

そもそもPythonについてよく分からないという方は、Pythonとは何なのか解説した記事を読むとさらに理解が深まります。

 

なお本記事は、TechAcademyのオンラインブートキャンプPython講座の内容をもとに紹介しています。

 

田島悠介

今回は、Pythonに関する内容だね！

大石ゆかり

どういう内容でしょうか？

田島悠介

PythonでCGIスクリプトを書く方法について詳しく説明していくね！

大石ゆかり

お願いします！

 

CGI（Common Gateway Interface）とは

CGIとは、ブラウザの要求に応じ、Webサーバがプログラムや計算を実行する仕組みです。
単純なHTMLで作成したWebページは静的です(誰がいつどのようにアクセスしても同じ内容になる)。

一方、ユーザの操作やアクセス方法に応じ、Webページの内容を動的に変化させたい場合には、CGIを用います。
 

PythonでCGIスクリプトを書く方法

PythonでCGIスクリプトを書くには、cgiモジュールが便利です。
CGIスクリプトの簡単な動作確認には、http.serverモジュールが便利です。

以下のようにcgiモジュールをインポートします。

 

import cgi

 
CGIスクリプト先頭に以下を挿入するとデバッグに便利です。
これにより、CGIスクリプト中でエラーが発生した際に、ブラウザ上に詳細なレポートが出力され、デバッグが容易になります。

 

import cgitb
cgitb.enable()

 

フォームで入力された値を処理するには、FieldStorageクラスを用います。

 

form = cgi.FieldStorage()

 

[PR] 未経験からWebエンジニアを目指す方法とは

実際に書いてみよう

サンプルコード

index.html

以下内容のindex.htmlファイルを作成します。
テキスト入力フォーム2つ、送信ボタン1つのWebページです。
POSTメソッドで後述のsample.pyのCGIにアクセスします。
 

<html>
 <body>
  <form action="/cgi-bin/sample.py" method="POST">
   <input type="text" name="foo">
   <input type="text" name="bar">
   <input type="submit">
  </form>
 </body>
</html>
cgi-bin/sample.py

 
以下内容のsample.pyファイルを作成し、cgi-binディレクトリに配置します。

 

import cgi
import cgitb
cgitb.enable()

print("Content-Type: text/html")
print()   

form = cgi.FieldStorage()

for key in form:
    value = form[key].value
    print('<p>%s: %s</p>' % (key, value))

 

実行結果

以下のコマンドでWebサーバを起動します。

 

python -m http.server --cgi 8000

 

Webブラウザで http://localhost:8000 にアクセスし、フォームに入力します。
 
PythonでCGIを使う方法の結果画像

送信ボタンをクリックすると、以下のようにCGIスクリプトが実行されました。
 
PythonでCGIを使う方法の送信ボタン画像
 

監修してくれたメンター

橋本紘希

システムインテグレータ企業勤務のシステムエンジニア。

開発実績: Javaプログラムを用いた業務用Webアプリケーションや、基幹システム用バッチアプリケーションなどの設計構築試験。

 

大石ゆかり

内容分かりやすくて良かったです！

田島悠介

ゆかりちゃんも分からないことがあったら質問してね！

大石ゆかり

分かりました。ありがとうございます！

 

TechAcademyでは、初心者でもPythonを使った人工知能（AI）や機械学習の基礎を習得できるオンラインブートキャンプPython講座を開催しています。

挫折しない学習方法を知れる説明動画や、現役エンジニアとのビデオ通話とチャットサポート、学習用カリキュラムを体験できる無料体験も実施しているので、ぜひ参加してみてください。

記事を検索

関連するキーワード

関連する記事

Pythonのloggingモジュールで色付きのログを出力する方法を現役エンジニアが解説【初心者向け】

Pythonのloggingモジュールで色付きのログを出力する方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向け...
Python

Pythonのstaticmethod関数の使い方を現役エンジニアが解説【初心者向け】

Pythonのstaticmethod関数の使い方について解説します。 そもそもPythonについてよく分からないという方は、Pythonとは何なのか解説...
Python

テンソルフロー(TensorFlow)を利用したPythonによるAIプログラミングを現役エンジニアが解説【初

テンソルフロー(TensorFlow)を利用したPythonによるAIプログラミングについて解説します。   そもそもPythonについて...
Python

Pythonの始め方を現役エンジニアが解説【初心者向け】

Pythonの始め方について、テックアカデミーのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 Pythonを利用すると、人...
Python

Pythonの配列記述にあるコロンの意味について現役エンジニアが解説【初心者向け】

Pythonの配列記述にあるコロンの意味について、テックアカデミーのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 Pyth...
Python

Pythonのglobals関数の使い方を現役エンジニアが解説【初心者向け】

Pythonのglobals関数の使い方について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して、初心者向けに解説します。 &...
Python

あわせてよく読まれている記事

Laravelでformを使う方法【初心者向け】現役エンジニアが解説

今回は、Laravel のFormを利用してフォームの作成を行っていきます。 LaravelのFormを利用することで、ブラウザ画面からフォームを利用してデータを送信することが可能になります。 実務でもWebアプリケーションを開発する際、ユーザーがデータをフォーム入力して、データベースに登録する処理はよく利用しますので、非常に実践的な内容になっています。 目次 Formとは Formの例 Laravelとは Laravel の始め方 tinker の使い方 Mysqlの設定 Mysqlの利用 Laravelの処理 Laravel Collectiveの使い方   Formとは WebアプリケーションでFormというと、企業ページへのお問い合わせフォームであったり、SNSの投稿フォームだったり、多岐にわたり多用されます。 このFormという単語ですが、初学者の頃は、Fromと混同しやすくタイプミスが発生する点に注意していただくと、学習がスムーズです。   今回は、LaravelのライブラリであるLaravel CollectiveというライブラリのFormファサードを利用して実装していきます。 Formファサードとはデザインパターンで言うところの、複数のクラスを利用する上で窓口となるクラスを利用して、依存関係を含めシンプルに処理を実装することができる仕組みです。 デザインパターンというのは、プログラミングのアルゴリズムを定型化することで、誰でも高品質な処理を実装することができる考え方です。   アルゴリズムというのは、プログラミングの処理の流れです。 例えば、子供の頃、迷路の本などで入り口から出口までなぞり書きしたことがあるかと思います。 入り口から出口まで後戻りせず、一筆書きで迷路をクリアする処理をアルゴリズムとイメージすると良いかもしれません。   クラスとは、あるオブジェクトの設計図です。 オブジェクトを作るためには設計図を設計した上で、設計図に基づいてオブジェクトの作成が必要です。   オブジェクトとは、クラスという設計図から生成される製品です。 家を例にすると、家という製品（オブジェクト）は、柱や壁や電気や水道やガスなどいろいろな部品によって、クラスという設計図に基づいて構成されています。 つまり、家の設計図がクラスで、実際の家がオブジェクトというイメージになります。   そして、実際の製品をインスタンスと呼びます。 これは、生成する家が全く同じクラス（設計図）に基づくオブジェクト（製品）であっても、インスタンス（田中様の家）、インスタンス（鈴木様の家）というように、生成後は別の意味を持った家になるためです。 家の設計図であるクラスを利用して、様々な家を集積するようなWebアプリケーションを実装する場合、家というクラスだけでなく、車というクラスや、お店というクラスもあるかもしれません。 どの家とどの車が同じ所有者で、その所有者はお店も所有しているのか、お店を利用するだけなのか、というようにクラス同士が連動して動作する場合、最終的なWebアプリケーションがクラスでごちゃごちゃになりかねません。 そこで、Formファサードのような依存関係をシンプルに実装してくれる機能を利用していくと、実務でも保守のしやすい素敵なアプリケーションを実装可能になります。   [PR] 未経験からWebエンジニアを目指す方法とはFormの例 今回は次のようなFormタグを利用します。 Form::model Form::modelで、モデルデータと連動しながらForm処理を開始します。 そうでない場合は、Form::openを利用することができます。   Form::label Form::labelで、ラベルの生成処理をします。   Form::text Form::textで、テキストボックスの生成処理をします。   Form::submit Form::submitで、送信表示の生成処理をします。   Form::close Form::closeで、Formタグの実装を終了します。   今回利用するFormタグ以外にも、たくさんのFormタグが存在するので、Laravel Collectiveの公式ページを参考にしていただくと良いですよ。 LaravelCollective | HTML v6.x   Laravelとは Laravelとは、PHPでWebアプリケーションを開発する際、セキュリティも高く、効率的な開発をすることができるフレームワークです。 フレームワークとは、Web開発における共通処理であるライブラリを呼び出すことで、効率的にWebアプリケーションを開発することができるツールです。 ライブラリとは、よく利用する便利な処理をまとめて実装しているプログラムです。 同じような処理をしているライブラリが、世界中に存在するため、どのライブラリを呼び出し利用するかはプログラマーが考えて決定します。   Laravel の始め方 今回解説する実装環境は、PHP7.2系とLaravel6系とMySQL5.6系です。 MySQLの最新バージョンはMySQL8系ですが、実行環境の都合でMySQL5.6系ですので、基本的にはMySQL8系でも同じ考え方をしていただくと良いです。 今回はcomposerコマンドを利用して、techacademyというプロジェクト名で、Laravel6.x系最新版で立ち上げます。 ^6.0 と書けば、バージョン6.xの最新版が選択されます。   コマンド composer create-project --prefer-dist laravel/laravel techacademy ^6.0 Laravelのインストール方法やcomposerのインストール・使い方についてはこちらの記事を参考にしてみてください。   Laravelのバージョン Laravelの現在の最新バージョンはLaravel8です。 しかし、Laravel6を利用するのは、Laravel6がLTSというバージョンだからです。 LTSとは、長期に渡りサポートされるバージョンを意味します。 最終的なサポート期間がLaravel6のほうがLaravel8よりも長いため、実務ではLaravel6を利用することが多いです。 バージョン 公開日 セキュリティサポート 8.0 2020年9月8日 2021年9月8日まで 7.0 2020年3月3日 2021年3月3日まで 6.0 2019年9月3日 2022年9月3日まで   tinker の使い方 Laravelでは php artisan tinker というコマンドを実行すると、Laravelの機能を実行するREPLが起動します。 REPLとは対話型コマンドでアプリケーションを操作する方法です。   tinkerの起動方法 コマンドラインで次のコマンドを入力するとtinkerが起動します。 php artisan tinker   tinkerの終了方法 REPLの実行中は、行頭に>>>が表示されています。 その状態でexitと入力することでtinkerを終了することができます。 >> exit   MySQLの設定 いくつかMySQLの設定が必要です。 代表的な設定を抜粋して解説します。   config/database.php 設定内容 'default' => env('DB_CONNECTION', 'mysql'), 解説 ここでは、MySQLを利用するという指定をしています。   .env 設定内容 DB_DATABASE=techacademy 解説 ここではtechacademyというデータベースを利用する指定をしています。   MySQLの利用 MySQLの起動 コマンド sudo service mysql start sudo mysql -u root 解説 MySQLが未起動の場合、sudo service mysql startでMySQLを起動します。 sudo mysql -u rootでMySQLにログインします。 今回は学習用なので、ユーザー名がrootでパスワードがないパターンのログインコマンドです。 実務で利用する場合は、任意のログイン情報を設定していただく必要がございます。   techacademyデータベースを作成 コマンド CREATE DATABASE `techacademy`; 解説 MySQLにログイン後CREATE DATABASE `techacademy`;というコマンドを実行することで、techacademyというデータベースを作成することができます。   Laravelの処理 Laravel側で実装する代表的な処理を抜粋して解説します。   tinkerでデータベース接続を確認する方法 コマンド php artisan tinker >>>DB::reconnect(); 解説 php artisan tinkerというコマンドを実行することでtinkerを利用します。 tinkerを利用しているREPLの状態は、行頭に>>>が表示されている状態です。 その状態で、DB::reconnect();を実行します。 無事データベースへの接続が完了していれば、次のような表示がされます。 => IlluminateDatabaseMySqlConnection {#683}   マイグレーションファイルの作成と実行 マイグレーションファイルとは、テーブルの作成・削除、カラムの追加・削除に関するデータベースのテーブル管理を行うファイルです。 コマンド php artisan make:migration create_techacademy_table --create=techacademies php
PHP

JavaScriptでDocument.formsプロパティを使ってform要素を取得する方法を現役エンジニアが解説【初心者向け】

JavaScriptでDocument.formsプロパティを使ってform要素を取得する方法について、テックアカデミーのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 JavaScriptでDocument.formsプロパティを使うと、form要素を取得できます。 実務でも、JavaScriptでDocument.formsプロパティを使って入力フォームの情報を操作するので、ぜひ学習してみてください。   目次CGI（Common Gateway Interface）とはPythonでCGIスクリプトを書く方法実際に書いてみよう監修してくれたメンター   そもそもJavaScriptについてよく分からないという方は、JavaScriptとは何なのかについて解説した記事を読むとさらに理解が深まります。   田島悠介 今回は、JavaScriptに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 JavaScriptでDocument.formsプロパティを使ってform要素を取得する方法について詳しく説明していくね！ 大石ゆかり お願いします！   DOMとは Document Object Modelの略で、文章の構造を表したプログラミングインターフェイスです。 平たく言うと、文章構造を表現したり操作する部品の集まりです。 ChromeなどのブラウザでみているWebサイトは、HTMLという言語のタグを使って文章のレイアウトや表示の色などを表現しています。 DOMの中には、このHTMLの要素を操作する機能も用意されています。 HTMLの要素を操作することで、Webサイトの表示を切り替えたり色をつけたりというような動きをもたせることができます。   Document.formsプロパティとは Document.formsプロパティとは、文章を表すDocumentインターフェイスが持つプロパティの一種です。 Document.formsプロパティには、HTMLにあるformタグをすべて格納しています。 Document.formsプロパティで、formをすべて格納するため、formsと複数形のsが付いています。 Document.formsプロパティは、formタグを参照したり操作する場合に使用します。 formタグというのは、入力フォームのように、ユーザーが情報を入力する際に利用するタグです。   [PR] 未経験からWebエンジニアを目指す方法とはDocument.formsプロパティの使い方 ここでは、基本的なDocument.formsプロパティの使い方を解説します。 基本文法 document.forms[index] 解説 Document.formsプロパティは、document.formsと記述すれば使うことができます。 [index]の部分に、インデックスを指定することが可能です。 Document.formsの返り値は、配列ではなく HTMLCollection オブジェクトです。 JavaScriptに標準で用意されてる、Documentのオブジェクトであるdocumentを利用する文法です。   form要素を取得する方法 ここでは、form要素を取得する方法を解説します。 基本コード document.forms[0] document.forms['nameのプロパティ名'] 解説 Document.formsは複数のformを格納した配列のようなオブジェクトです。 厳密に言えば配列ではなく、HTMLCollection オブジェクトと言います。 document.forms[0]のようにformを指定することで任意のform要素を取得できます。 document.forms[‘nameのプロパティ名’]というように、該当するnameのプロパティ名を指定することで、該当するnameで指定されたform要素を取得できます。   form部品を取得する方法 ここでは、form部品を取得する方法を解説します。 基本コード document.forms[0].elements[0] document.forms['nameのプロパティ名'].elements['nameのプロパティ名'] 解説 document.forms[0].elementsでは、formタグの中にある入力欄などの部品を取得できます。 elements[0]の位置に、inputタグのような部品が該当する場合に、document.forms[0].elements[0]でinputタグの要素が取得可能です。 Document.formsと同じようにelementsもすべてのform部品を格納したHTMLCollection オブジェクトです。 そのため任意のform部品を扱う場合は、elements[0]やelements[【inputの名前】]のように[‘nameのプロパティ名’]を指定します。   実際に書いてみよう JavaScriptでのformの操作を見るために、まずはHTMLソースに2つのformタグを記述したものを用意しました。 HTMLに存在する要素を、Document.formsで実際に取得してみましょう。 HTMLサンプルコード <form name='form1'> 1つ目のformの入力欄：<input type="text" name='input1'> <input type="number"> <input type="checkbox" name='check' value='0'>確認する </form> <form name='form2'> 2つ目のformの入力欄：<input type="text" name='input2'> </form> JavaScriptサンプルコード document.forms[0].elements[0].value = '1つめのformの1つ目の入力欄に入る文字列です'; document.forms[0].elements[2].checked = true; document.forms[1].elements[0].value = '2つめのformの1つ目の入力欄に入る文字列です。' nameを利用した場合のサンプルコード document.forms['form1'].elements['input1'].value = '1つめのformの1つ目の入力欄に入る文字列です'; document.forms['form1'].elements['check'].checked = true; document.forms['form2'].elements['input2'].value = '2つめのformの1つ目の入力欄に入る文字列です。' 実行結果 See the Pen Document.forms by マインクラフトゲームアプリプログラミング学校 (@programjp) on CodePen. 解説 document.forms[0].elements[0].value = ‘1つめのformの1つ目の入力欄に入る文字列です’;では、document.forms[0].elements[0].valueで指定できる、HTMLの<input type=”text” name=’input1′>のvalueに、1つめのformの1つ目の入力欄に入る文字列ですを代入しています。 [0]のようなインデックスではなく、nameを利用して同じ指定を行う場合はnameを利用した場合のサンプルコードをご覧ください。 document.forms[0].elements[2].checked = true;では、document.forms[0].elements[2].checkedで指定できる、HTMLの<input type=”checkbox” name=’check’
JavaScript

Webデザインの知識がなくてもOK！Bootstrapの使い方【入門者向け】

独学でHTML/CSSを勉強してもデザインがいまいち…という経験はないでしょうか。そんなときに便利なBootstrapの使い方を初心者向けに解説します。   HTML/CSSがわからない方も読むことができますが、HTMLの書き方、CSSの書き方は理解しておいた方がスムーズに読み進めることができるでしょう。 なお、今回はBootstrapのバージョン「3.3.5」を使用します。   本記事は、オンライン完結のBootstrap講座のカリキュラムをもとに執筆しています。   なお、今回の記事の内容は動画でもご覧いただけます。 テキストよりも動画の方が理解しやすいという場合はぜひご覧ください。   大石ゆかり 田島メンター！！Bootstrapというのは何ですか〜？ 田島悠介 Bootstrapはレスポンシブデザインに対応したフロントエンドのフレームワークだよ。 大石ゆかり フロントエンドというとHTML・CSS・JavaScriptですか？ 田島悠介 そうだね。シンプルな指示でグリッドシステムを使用できたり、本格的なフォームやボタンを作成できたりと非常に便利なんだ。基本の使い方を見てみよう。   目次 本記事では、Bootstrapの基礎をおさえた上で、よく使う、グリッドシステム、テーブル、ボタン、フォームの具体的な使い方を順番に紹介します。 Bootstrapとは Bootstrapを使う準備 グリッドシステムの使い方 テーブルの使い方 ボタンの使い方 フォームの使い方 Bootstrapとは BootstrapはTwitter社が開発したCSSの「フレームワーク」です。通常CSSを書く場合、全てのスタイルを自分で作っていく必要がありますが、このフレームワークにはよく使われるスタイルがあらかじめ定義してあるので、ルールに沿って利用するだけで整ったデザインのページを作成できます。 もともとTwitter社内で作られたもので、以前は「Twitter Bootstrap」と呼ばれていましたが、現在では「Bootstrap」のみで呼ばれるようになっています。   Bootstrapを使うメリット Bootstrapを使うメリットとして、レスポンシブWebデザインに対応しているという点があります。通常、スマートフォンやタブレットなど個別に対応するスタイルを作っていると大変手間がかかります。BootstrapはCSS3のメディアクエリを使用しているので、ブラウザの横幅サイズを判断基準として、レイアウトデザインを柔軟に調整することが可能です。   このページから確認できますが、バージョン3.3.5ではこちらのブラウザに対応しています。 この際の注意点ですが、Internet Explorer 7以下とFirefox 3.6以下はサポートされません。これは、CSS3メディアクエリがサポートされていないブラウザだからです。     [PR] 未経験からWebエンジニアを目指す方法とはBootstrapを使う準備 実際にBootstrapを使う前の準備が必要ですので、まずはこちらに着手しましょう。PCだけあればすぐに準備できます。   Bootstrapを使用するには、BootstrapとjQuery（JavaScriptのライブラリ）を読み込む必要があります。読み込みの方法は下記の2パターンです。 ソースをダウンロードして、ローカルに配置して読み込む すでにホストされているファイルをインターネット経由で読み込む 今回は、前者の方法を紹介します。   ダウンロードするには、BootstrapのTOPページにアクセスしましょう。 「Download Bootstrap」のボタンをクリックしてください。   次に表示されるページで、左にある「Download Bootstrap」をクリックするとダウンロードが始まります。   ダウンロードしたZIPファイルを解凍すると、「css」、「js」、「fonts」の3つのフォルダがあることがわかるはずです。   続いてHTMLファイルを用意しましょう。Bootstrapのページにもテンプレートが用意されていますが、コメントアウトが日本語の方がわかりやすいと思いますので、TechAcademyで用意しています。こちらのコードをコピーして「index.html」としてHTMLファイルを作成してください。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Bootstrap Sample</title> <!-- BootstrapのCSS読み込み --> <link href="css/bootstrap.min.css" rel="stylesheet"> <!-- jQuery読み込み -->
Bootstrap

ApacheをPythonで利用する方法を現役エンジニアが解説【初心者向け】

ApacheをPythonで利用する方法について解説します。 そもそもPythonについてよく分からないという方は、Pythonとは何なのか解説した記事を読むとさらに理解が深まります。   なお本記事は、TechAcademyのオンラインブートキャンプPython講座の内容をもとに紹介しています。   田島悠介 今回は、Pythonに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 ApacheをPythonで利用する方法について詳しく説明していくね！ 大石ゆかり お願いします！   Apacheとは Apacheとは、Webサーバソフトウェアの一つです。 主にLinux環境をターゲットにしていますが、Windows上でも動作します。 モジュール機構を採用していて、認証、リバースプロキシ、アプリケーションサーバといった多様な機能を追加できます。   Apacheを使う手順 前提条件 この記事はCentOS7で確認した内容にもとづいています。 別のLinuxディストリビューションや、別のバージョンでは、操作方法や表示の異なる場合があります。   インストールする 以下のコマンドでApacheをインストールします。   yum install httpd   以下のコマンドでApacheサービスを起動、有効化します。   systemctl start httpd systemctl enable httpd   Apacheが動作していることを確認するため、ブラウザでマシンにアクセスします。 筆者の環境ではマシンのIPアドレスが192.168.11.12のため、 http://192.168.11.12/ にアクセスします。 テスト用Webページを参照できれば、インストールは正常に完了しています。   Apacheを設定する 以下のパスに設定ファイルがあります。   /etc/httpd/conf/httpd.conf /etc/httpd/conf.d/*.conf   PythonスクリプトをCGIで実行するため、以下のような設定を加えます。(設定済であれば変更不要です。)   ScriptAlias /cgi-bin/ "/var/www/cgi-bin/"   設定変更を反映するため、以下のコマンドでApacheを再起動します。   systemctl restart httpd   動作確認をする 以下の内容でCGIスクリプト /var/www/cgi-bin/hello.pyを作成します。   #!/usr/bin/python3 print('Content-Type: text/html') print('') print('Hello,World!')   このスクリプトは1行目でHTTP応答ヘッダ、2行目で応答ヘッダと応答本文の区切りの空白行、3行目で応答本文を出力します。 スクリプトに実行権限を付与します。   chmod 755 /var/www/cgi-bin/hello.py   CGIスクリプトにアクセスします。 http://192.168.11.12/cgi-bin/hello.py 以下のように表示されれば、CGIスクリプトは正常に動作しています。 Hello,World! 問題の発生した場合は、以下のログファイルを参照し、エラー原因を調査します。   /var/log/httpd/access_log /var/log/httpd/error_log   以上で簡単なCGIスクリプトを作成できます。 さらに高機能なCGIスクリプトを作成するには、cgiモジュールを利用すると良いです。   [PR] 未経験からWebエンジニアを目指す方法とは監修してくれたメンター 橋本紘希 システムインテグレータ企業勤務のシステムエンジニア。 開発実績: Javaプログラムを用いた業務用Webアプリケーションや、基幹システム用バッチアプリケーションなどの設計構築試験。   大石ゆかり 内容分かりやすくて良かったです！ 田島悠介 ゆかりちゃんも分からないことがあったら質問してね！ 大石ゆかり 分かりました。ありがとうございます！   TechAcademyでは、初心者でもPythonを使った人工知能（AI）や機械学習の基礎を習得できるオンラインブートキャンプPython講座を開催しています。 挫折しない学習方法を知れる説明動画や、現役エンジニアとのビデオ通話とチャットサポート、学習用カリキュラムを体験できる無料体験も実施しているので、ぜひ参加してみてください。
Python

入門から応用まで！HTMLの学習に役立つリファレンスサイト10選

HTMLで作りたい機能があるのに方法がわからない時、大きな味方になってくれるのが、リファレンスサイトです。 今回はそんなHTMLのリファレンスサイトを10サイト紹介します。HTMLでの作業に確実に役立つサイトばかりなので、ぜひ参考にしてみてください。 目次CGI（Common Gateway Interface）とはPythonでCGIスクリプトを書く方法実際に書いてみよう監修してくれたメンター そもそもHTMLの記述方法がわからない場合は、 HTMLの書き方について解説した記事を読むとさらに理解が深まります。   HTMLにおけるおすすめのリファレンスサイト 本記事では、下記のおすすめのHTMLリファレンスサイトにおける特徴を解説します。 HTMLクイックリファレンス 逆引きHTMLリファレンス TAGindex HTMLタグボード MDN HTMLリファレンス サルワカ とほほのWWW入門 HTMLリファレンス HTML5 & CSS3 リファレンス HTMLリファレンス（２） HTMLで使えるタグを網羅しているWebサイトから、目的に応じて検索できるWebサイトまで実にさまざまな種類があります。 利用シーンや、ご自分の目的に合わせて、活用するWebサイトを適宜見つけていきましょう。   HTMLクイックリファレンス HTMLを書いていて何度もお世話になるサイトです。 HTMLのリファレンスの他にも、CSSやJavaScriptなどの、Webデザインで使用される言語のリファレンスも載っています。 サイト作成における全般で役立つので、困ったらこのサイトを見に来ると良いでしょう。 HTMLクイックリファレンス   逆引きHTMLリファレンス Webデザイン初心者向けのリファレンスサイトです。 リファレンスサイトと聞くと、言葉が難しく中級者向けのイメージがありますが、このサイトはそうではなく、初心者向けに分かりやすく書いてあります。 他のリファレンスサイトがとっつきにくいと感じた方にオススメです。 逆引きHTMLリファレンス   TAGindex 基本的なリファレンスの他にカラーチャートなど、色に関わるリファレンスも多いのが特徴です。 さらには、色の組み合わせチェックも行うことができるので、デザインに困ったときにも使用したいリファレンスサイトです。 図やソースコードと共に実際の表示を確認しながら学習できるので、知らないタグが出てきてもイメージしやすいでしょう。 TAGindex   HTMLタグボード 初級者から中級者まで広く使えるリファレンスサイトです。 初心者向けのホームページ作成講座や、Webデザインの基礎、さらには収益化の方法など、HTMLを学ぶ上で知っておいた方が良い情報が詰まっています。 自分でオリジナルサイトを作ってみたいという人は参考になるはずです。 HTMLタグボード   MDN HTMLリファレンス HTMLの隅から隅まで情報が載っているリファレンスサイトです。見やすいデザインもオススメです。 各タグごとに仕様やブラウザでの実装状況を確認できるので、IEなど様々なブラウザを相手にする作業を行う場合に役立つでしょう。 MDN HTMLリファレンス サルワカ HTMLやCSSの解説を、とてもわかりやすいUIと共に紹介しているWebサイトです。 他サイトと比較しても特にCSSに関する記事が豊富なので、HTMLと併せてCSSも学習したい初心者の方に最適でしょう。 サルワカ   とほほのWWW入門 HTMLタグについて、1つひとつ丁寧に解説しているWebサイトです。 HTML以外にも、JavaScriptやCSS、その他のプログラミング言語など、Webサイト制作全般に関する非常に多くの情報が載っています。 とほほのWWW入門   HTMLリファレンス mainなどの要素の他に属性情報も多く載っています。 また、階層毎に分かれた見やすいページデザインになっているのも特徴です。 HTMLリファレンス   HTML5 & CSS3 リファレンス HTMLにおける基礎情報の他、CSS3に関する膨大な量のデータを有するWebサイトです。 セレクタの使い方に留まらず、HTMLの歴史や文書構造を丁寧に解説しています。 現代のWeb制作の知識だけでなく、過去の知識も吸収したい方向けにおすすめです。 HTML5 & CSS3 リファレンス   HTMLリファレンス すべてのリファレンスは載っていませんが、よく使用されるタグが載っているリファレンスサイトです。 リファレンスですが情報として見やすく、あまり混乱したくない初心者の方におすすめのリファレンスサイトです。 単純に知識をつけるという意味でも役立てられるはずです。 HTMLリファレンス   まとめ 以上、HTMLでの作業に役立つリファレンスサイトをまとめました。 HTMLクイックリファレンス 逆引きHTMLリファレンス TAGindex HTMLタグボード MDN HTMLリファレンス サルワカ とほほのWWW入門 HTMLリファレンス HTML5 & CSS3 リファレンス HTMLリファレンス（２） リファレンスサイトを把握することで、今後のHTML学習に役立てられます。 上記でご紹介したWebサイトをぜひチェックしていただき、ご自分に合ったリファレンスサイトを活用していきましょう。 今回の記事は以上です。   [PR] 未経験からWebエンジニアを目指す方法とはHTMLを学習中の方へ これで解説は終了です、お疲れさまでした。 つまずかず「効率的に」学びたい 副業や転職後の「現場で使える」知識やスキルを身につけたい HTMLを学習していて、このように思ったことはありませんか？ テックアカデミーのWebデザインコースでは、第一線で活躍する「プロのWebデザイナー」が教えているので、効率的に実践的なスキルを完全オンラインでしっかり習得できます。 合格率10%の選考を通過した、選ばれたWebデザイナーの手厚いサポートを受けながら、オリジナルのWebサイト制作を学べます。 まずは一度、無料体験で学習の悩みや今後のキャリアについて話してみて、「現役Webデザイナーから教わること」を実感してみてください。 時間がない方、深く知ってから体験してみたい方は、今スグ見られる説明動画から先に視聴することをおすすめします！
HTML

生成AIで簡単！新製品デモンストレーションスクリプト作成ガイド

田島悠介 AIを活用したデモンストレーションスクリプトの作成は、営業活動での強力なツールになりますね。 大石ゆかり はい、新製品の特徴や利点をしっかりと顧客に伝えるためには、効果的なスクリプトが欠かせません。 田島悠介 本記事では、LINEヤフーテックアカデミーの『はじめてのChatGPTコース』の内容を参考にして、AIを使ってスクリプトをどのように効率的に作成できるかについて解説します。 大石ゆかり よろしくお願いします！ AIを活用した新製品デモンストレーションスクリプトの作成 AIを活用することで、効果的な新製品デモンストレーションのスクリプトを簡単に作成することができます。以下に、AIを使ってスクリプトを作成する手順を説明します。 1. 明確な指示を与える AIに適切な指示を与えることが重要です。新製品の特徴、ターゲット顧客、デモンストレーションの目的など、必要な情報を明確に提供しましょう。 2. 役割を設定する AIに適切な役割を与えることで、より適切なスクリプトを生成することができます。例えば、「製品マネージャー」や「マーケティング専門家」などの役割を設定することで、専門的な視点からのスクリプトを得ることができます。 3. 背景情報を提供する 新製品や企業の背景情報、市場の状況などを詳細に説明することで、より適切なコンテキストに基づいたスクリプトを生成することができます。 4. 具体的な要件を指定する スクリプトの長さ、トーン、強調したい点など、具体的な要件を指定することで、より目的に合ったスクリプトを得ることができます。 5. AIの出力を確認し、必要に応じて修正する AIが生成したスクリプトを確認し、必要に応じて修正や調整を行います。人間の目で最終チェックすることで、より完成度の高いスクリプトを作成できます。 以下は、AIに新製品デモンストレーションのスクリプト作成を依頼する際のプロンプトの例です。 # 命令 以下の要件を踏まえて、営業部門で使用する新製品デモンストレーションのスクリプトを作成してください。スクリプトは営業担当者が使いやすく、クライアントが理解しやすい内容であることが重要です。 # 役割 あなたは、製品マネージャーとして企業の新製品デモンストレーションのスクリプトを作成します。 # 目的 - 新製品の特徴と利点を明確に説明し、クライアントに製品の価値を効果的に伝えること。 - 営業担当者がクライアントとのデモンストレーション中に安心して利用できる、明瞭かつ効果的なスクリプトを提供すること。 # 背景と課題 - 当社は、AI技術を活用した効率的なビジネスソリューションを提供する新興企業です。 - 新製品は、企業のデータ分析とプロセス自動化を一層効率化するソフトウェアです。 - 営業担当者はテクニカルな背景を持っていない場合が多く、製品の技術的な側面を明確に説明するのが難しい場合がある。 - 新製品の市場投入が予定されており、営業部門は効果的なデモンストレーションスクリプトを必要としています。 # クライアントの特性 - 主に中〜大規模企業の経営者やIT担当者。 - 既存のデータ解析や業務効率化のツールに不満を感じている。 - 技術的な背景が異なるため、簡潔でわかりやすい説明を望んでいる。 # 新製品情報 - 製品名：InsightfulAI Pro - 製品特徴： - データ分析と自動化を統合したワンストップソリューション - AIを活用した高度な予測分析機能 - カスタマイズ可能なダッシュボードとリアルタイムレポーティング - ユーザーフレンドリーなインターフェイスと簡易なセットアッププロセス - ショーケースする主なシナリオ： - データの簡易インポートと可視化 - カスタムレポートの作成 - リアルタイムデータモニタリング # スクリプトの条件 - スクリプトは15〜20分のデモンストレーションをカバーする内容であること。 - クライアントが製品の特性と利点を理解しやすい言葉を使用すること。 - 営業担当者が流暢にプレゼンテーションできるよう、自然で友好的なトーンを保つこと。 このプロンプトを使用することで、AIは以下のようなスクリプトを生成します。 #新製品デモンストレーションのスクリプト こんにちは、皆さん。 今日は当社の新製品、InsightfulAI Proのデモンストレーションをご覧いただき、その特長と利点をお伝えします。 私たちは中〜大規模企業の経営者やIT担当者向けに、データ分析とプロセス自動化を効率的に実現するためのソリューションを提供しています。 さて、InsightfulAI Proは、データ分析と自動化を統合したワンストップソリューションです。その特長を詳しく見てみましょう。 1. データ分析と自動化の統合 - InsightfulAI Proは、データ分析とプロセス自動化を一つのプラットフォームで統合しています。これにより、データの収集から分析、アクションへの自動化まで、全てを効率的に実現できます。 2. 高度な予測分析機能 - AIを活用した高度な予測分析機能が、ビジネスの意思決定をサポートします。過去のデータから未来のトレンドを予測し、戦略を立てるのに役立ちます。 3. カスタマイズ可能なダッシュボードとリアルタイムレポーティング - InsightfulAI Proは、カスタマイズ可能なダッシュボードを提供し、リアルタイムでデータを監視できます。重要な情報を一目で把握し、迅速な意思決定をサポートします。 4. ユーザーフレンドリーなインターフェイスと簡易なセットアッププロセス - 当社の製品は、ユーザーフレンドリーなインターフェイスを採用しており、セットアッププロセスも簡単です。技術的な背景が異なる方でも、簡単に利用できることをご紹介します。 それでは、InsightfulAI Proのデモを始めましょう。 以下の主要なシナリオを紹介します： 1. データの簡易インポートと可視化 - デモでは、データのインポートから可視化までのステップをご紹介します。データの取り込みが簡単で、直感的なグラフィカルユーザーインターフェイスでデータを可視化できます。 2. カスタムレポートの作成 - 次に、カスタムレポートの作成方法を説明します。InsightfulAI Proを使用して、特定のデータからカスタマイズされたレポートを簡単に生成できます。 3. リアルタイムデータモニタリング -
生成AI・ChatGPT

あなたの目的に合わせて学べるコース

副業したい方

Web制作の力を身につけ
副業までサポート

はじめての副業コース

転職したい方

未経験から
Webエンジニアに

Webエンジニア転職保証コース

スキルアップしたい方

AIも統計解析もできる
Pythonを学ぶ

Pythonコース

※ 経済産業省の行うリスキリングを通じたキャリアアップ支援事業の補助金対象コースです。条件を満たすことで支払った受講料の最大70％がキャッシュバックされます。詳しくは こちら のページをご確認ください。

TechAcademyから
現役エンジニアの方へ
お知らせ

オーダーメイドコース
TechAcademy（テックアカデミー） プログラミング Python PythonでCGIスクリプトを書く方法【初心者向け】