プログラマーになりたい！という貴方へ

この記事は「プログラマーになりたい」という、ある特定の人へ向けた記事です。

ですが、同じ志をもった方へのアドバイスにもなれば嬉しいです。

フリーランスのプログラマーとして、一般的な生活が出来る程度にお仕事が出来るようになるまでには、かなり高いハードルをいくつもクリアしなければなりません。
趣味程度のレベルで、個人で使うソフトの開発であれば短期間で習得できると思いますが・・・。
しかし、仕事として受けたプログラムは、セキュアであることは勿論、長期間使用して頂く為に、カスタマイズしやすく製作者以外のプログラマーでも簡単に解析できるようなコーディング、それ以外にも様々な事を高いレベルで求められます。

今回は一例として、別記事でインストールの勉強をした「Wordpress」のプラグイン・デザインテーマの作成を目標として、プログラマー（ウェブデザイナー）としてどんな知識が必要なのかを勉強していきます。

phpをコーディングしてみる

phpをコーディングしてみる

エディタを用意する

phpは”.php”という拡張子の付いたテキストなので、Windowsのメモ帳でもコーディングは出来るのですが、補助機能のついた高機能なエディタを使う方が数段効率が上がります。
一例として私が使用している無料で使用可能なツール紹介します。

Visual Studio Code

Visual Studio Vode（以下VSCode)はマイクロソフト社が無償で提供している高機能エディタです。

https://azure.microsoft.com/ja-jp/products/visual-studio-code/

Sublime Text

Sublime Textもphpコーディングの補助機能が充実した高機能エディタです。日本語化も簡単に出来ます。

Sublime Text - the sophisticated text editor for code, markup and prose

Available on Mac, Windows and Linux

コーディング

Visual Stusio Codeでコーディングしてindex.phpとして保存

http://localhost/test/index.phpにアクセスした結果

phpのコーディング方法は説明しません。
PHP マニュアル等を参考に勉強して下さい。

PHP: PHP マニュアル - Manual

php入門書を見ればどこにでも書いてるコードを記述してみます。

<?php echo"Hello world"; ?>

このコードを別記事でインストールしたxamppのドキュメントルートに適当なディレクトリを作成して（今回は”test”）

c:\xampp\htdocs\test\index.php

となるようにファイル名をindex.phpとして保存します。

xamppでApacheが起動している事を確認して、プラウザから今保存したファイルにアクセスしています。

無効なURLです

echo”Hello world”;が正常に実行されていると思います。

ここまでは様々なサイトや入門書で一度は見た事があると思いますが、「じゃあ実際どうすれば綺麗なホームページを表示する事が出来るの？」と、初心者の方は感じるかもしれません。

html内にphpコードを書き込む

実際にWordpressのデザインテーマのphpファイルを開くとわかりますが、html内に沢山のphpコードが組み込まれています。

htmlはどんな場合でも変化する事はありませんが、phpコードではケースバイケースで動的に内容を変更する事が可能です。

<?php
    define("SITENAME","サンプルサイト");
?>
<!DOCTYPE html>
<html lang="ja">
    <head>
        <meta charset="UTF-8">
        <title>サンプル</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta name="description" content="">
        <style>
            body {
                background: #fff;
                font-size: 12px;
                text-align: center;
            }

            p {
                color: red;
            }
        </style>
    </head>
    <body>
        <div id="container">
            <header>
                <h1 ><?php echo("サイト名は　　" . SITENAME); ?></h1>
            </header>
            <main>
                <section>
                    <p>
                        <?php
                            for( $i=0; $i<=10; $i++){
                                echo($i);
                                if($i % 2 == 0){
                                    echo("<-偶数". "<br />");
                                }else{
                                    echo("<-奇数". "<br />");
                                }
                            }
                        ?>     
                    </p>
                </section>
            </main>
        </div>
    </body>
</html>

上のコードをindex.phpにコピペして、アクセスしてみましょう。

とても味気ないデザインですが、PHPが0から10までの数字を出力してるコードが正しく実行されている事が確認出来るはずです。

また、このデザインファイルではCSSも直接書き込まれていますが、普通はスタイルシート別ファイルで用意する事が、効率面でも必須です。

このファイルを使って、PHP マニュアルに記載されている関数を実行して、より多くの知識を習得しましょう。

このような形で大量の情報を動的に出力する為に、データベースを使ってページ書き換えてます。

ホームページ上からデータベースにアクセスして、データの読み込み・登録・修正・削除が出来るまで知識を習得出来れば、その他の新しい技術を習得する事が容易になると思います。

そうすれば、wordpressの自分オリジナルデザインテーマを作る事も出来るようになります。

以下がWordpressデザインテーマ「the Twenty Twenty」のheader.phpの冒頭部です。

難しそうな関数が沢山書かれていますね。

その他にwordpress関数やCSS,HTML等の知識も必要です。覚えなければならない事が山のようにあります。

WordPress Codex 日本語版

次回はそのデータベースへのアクセス方法を簡単に説明します。