6ヶ月間の受講を終えて
とうとう 6ヶ月間の受講が修了しました。
まだまだWEB業界で通用するレベルにはほど遠い状態ではありますが、それでもおかげ様で入学当時とは比較にならないほどのスキルアップと、たくさんの貴重な経験を積むことができました。
そして何よりも、たくさんの新しい仲間達と出会えたことが、最大の財産になりました。
人脈ができたとかそういう事ではなくて、会社のような上下関係の存在しない、世代を超えたｗ純粋な横のつながり。
ひとりひとりが個性的で魅力的で、まだまだ話し足りない人がいっぱいいましたが、きっとまたいつか S本さんか M上君か S永君か T柳君が、同窓会的なものを主催してくれると思いますので、その時を楽しみにしていますｗ
この画像はfight_2012さんに頂きました。
学生時代、遅刻と欠席で何度も退学になりかけていた自分が、今回終わってみれば皆勤賞を貰うことにｗ
皆勤賞があるなんて知らなかったし、無遅刻無欠席を目指していたわけではなかったのですが、この6ヶ月間、幸い怪我も病気も無く、休みたいと思う事も一度もありませんでした。
ただ学校に来るのが楽しかったんだと思います。
この6ヶ月間は本当にあっと言う間でしたが、新しくできた仲間たちと、デカすぎる夢を朝まで語り合った日々を思い出すと、胸が熱くなります。
現時点ではWEB業界への就職ではなく、まずは今自分に出来る事をフルに使って、いろいろともがいてみたいと考えています。
業界での経験を積むことのないまま、WEBの収入だけで生計を立てる事ができるようになるまでには、相当の年月がかかるであろう事は十分に覚悟しております。
それでも人生で一度だけ、自分の一番好きな分野でどこまでやって行けるのかを試してみたいという気持ちがあります。
同期だった受講生のみなさん、お互い次のステージでそれぞれの新しい夢や目標に向かって、がんばって行きましょう。
僕は、自分の信じた道を邁進して行きます。
最後に、手代木先生、矢島先生、本当にお世話になりました。
僕は決して模範的な生徒ではありませんでしたが、将来手代木先生に「昔俺の教えたやつに・・」と、良い意味で話に出てくるくらいの実績を作ることを目標としています。
それが最大の恩返しだと思って頑張って行きます。
矢島先生には、とても手代木先生には訊けないくらいのレベルの低い質問でも嫌な顔ひとつせず答えて頂いたり、プライベートな相談にも親身になって乗ってもらったりと、いつも感謝しきりでした。
またいっしょに飲みに行きましょうね。
これからもフェリカを原点として、いつかWEB業界に良い影響を与えるくらいの高みを目指してがんばって行きます。
手代木先生、矢島先生、6ヶ月間 本当にお疲れ様でした。
そして、ありがとうございました。
作業用音楽装置 ちょっとだけ更新しました。
作業用音楽装置のロゴ変更！
epikhigh くんに作ってもらいました。
実はネーミングがダサすぎるので、ローマ字で誤魔化していたんですが
漢字で良い感じに仕上げてくれました。
正確な時間はわかりませんが、作成まで凄まじく早かったです。
数分くらい？
２．sakamotosmile40さん tonewmeさん hansolostar1810さんと相互リンク！
３．TOP画面に超簡単な説明文を付けました。
このサイトは、これが最後の更新になりそうな予感・・・
ここから、ここまで 書き換える
既に出来上がっているサイトの好きな部分を、WEB上から書き換えるスクリプトを作りました。
書き換えしたい箇所を特定のコメントタグで挟んでおくだけで、以降何度でも書き換えできます。
場所も大きさも自由なので、頻繁に書き換えるトップページの更新情報とか、多数のページに跨る広告エリアの張り替えとかに使うと便利なんじゃないかなあと思います。
豆知識サイトを使って実験してみました。 左下の部分です。
サーバーのトップに「update.php」と「dat.txt」をアップロードするだけで使えます。
「update.php」にアクセスすると管理画面になります。
あらかじめ書き換えたい場所に、A か B のコメントタグをコピーして貼り付けておきます。
もしくは、書き換えたい個所の前後を、どちらかのコメントタグで挟みます。
次に管理画面のパターンのテキストエリアにコードを書き込みます。
実行ボタンを押すと、コメントタグで挟まれた箇所が書き換えられ、更新したページの一覧が表示されます。
タグごとのパターンを複数記入した場合は、各ページごとにランダムに書き換えられます。
実行ボタンの横の「バックアップ」にチェックをしておくと、サーバー上に「backupフォルダ」が作られ、実行毎に書き換えられる前の元ファイルがコピーされていきます。
万一タグの付け方を失敗するなどしてデザインを崩してしまった場合は、こちらの元ファイルを使って元に戻します。
現時点でのファイルの対象は、1階層目、2階層目、3階層目までの html（htm）です。
同じタグは１ページにひとつしか使えません。
AタグBタグ自体を、管理画面から自由に変更できます。
バックアップはチェック方式にしましたが、チェックすると実行する度に元ファイルが次々と増えていってしまうので、次回は違う方式を考えます。
将来的にはタグの種類とパターン数をもっと増やして、より実用的にしていきます。
update.php
<?php $y = "\n"; $sheep = "$^#"; date_default_timezone_set('Asia/Tokyo'); $snow = "ここから、ここまで 書き換える"; # dat 読み込み $dt = file("dat.txt"); $k = 5; $l = 0; for ( $i=0;$i<2;$i++ ){ $a[$i] = rtrim( $dt[$l] ); $l++; $z[$i] = rtrim( $dt[$l] ); $l++; for ( $j=1;$j<4;$j++ ){ $p[$j][$i] = str_replace( $sheep ,"\n",$dt[$k]); $k++; }} if ( $dt[4] == 1 ) { $check_b = "checked"; } else $check_b = ""; $ie = 'rows="3" cols="55" style="width:400px; height:40px;"'; //////////////////////////////////////////////////////////////////////////////////// # 実行が押されたら if (isset( $_POST["ok"] )){ # POST for ( $i=0;$i<2;$i++ ){ $rain = explode("\n",$_POST[$i]); $a[$i] = rtrim( stripslashes( $rain[0] )); $z[$i] = rtrim( stripslashes( $rain[1] )); for ( $j=1;$j<4;$j++ ){ $p[$j][$i] = stripslashes( $_POST["p$j$i"] ); }} # バックアップ処理 $bat = $_POST["backup"]; if ( $bat ){ $rabbit = date("Y.m.d.H.i.s"); if ( !is_dir( "backup" )){ umask(0); $rc = mkdir("backup",0777 ); } if ( !is_dir( "backup/$rabbit" )){ umask(0); $rc = mkdir("backup/$rabbit",0777 ); } $bone = "backup/$rabbit/"; } # A-B loop for ( $i=0;$i<2;$i++ ){ $r[$i] = 0; for ( $j=1;$j<4;$j++ ){ if ( strlen($p[$j][$i]) > 0 ){ $r[$i]++; $rnd[$r[$i]][$i] = $p[$j][$i]; } } # ファイル検索 $blood = "./"; jump(); if ( $dir1 = opendir("./")) { while (( $fire = readdir($dir1)) !== false ) { if ( $fire != "." && $fire != ".." && $fire !="backup" && is_dir($fire)) { $blood = "$fire/"; jump(); if ( $dir2 = opendir($fire)) { while (( $fox = readdir($dir2)) !== false ) { if ( $fox != "." && $fox != ".." && is_dir("$fire/$fox")) { $blood = "$fire/$fox/"; jump(); }} closedir($dir2); } }} closedir($dir1); } # 文章結合 for ( $j=1;$j<4;$j++ ){ $p[$j][$i] = rtrim( $p[$j][$i] ); $p[$j][$i] = str_replace( array( "\r\n","\n","\r" ),$sheep,$p[$j][$i] ); } } // A-B loop // # dat更新 if ( $bat ){ $bug = 1; $check = "checked"; } else { $bug = 0; $check = "";} $mouse = $a[0].$y.$z[0].$y.$a[1].$y.$z[1].$y.$bug.$y. $p[1][0].$y.$p[2][0].$y.$p[3][0].$y. $p[1][1].$y.$p[2][1].$y.$p[3][1]; $fish = fopen( "dat.txt","w" ); fwrite( $fish,$mouse ); fclose( $fish ); for ( $i=0;$i<2;$i++ ){ for ( $j=1;$j<4;$j++ ){ $p[$j][$i] = str_replace( $sheep ,"\n",$p[$j][$i]); }} } // 実行が押されたら // # html print <<< penguin <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <style> body{ background:#000; color:#fff; padding:0 20px; letter-spacing: 1px; line-height :20px; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック","MS PGothic",sans-serif; } h1{ margin :30px 0; font-size :18px; padding :10px; color :#fff ;width :370px; text-align:center; } h1,#moon{ background :#222;border :1px solid #666; } p{ font-size :12px; margin :15px 0 3px 10px; } #wrap{ width :925px; clear:both;overflow: hidden; } #block_L,#block_R{ width :410px; float :left; margin :10px 20px 30px 0; padding :10px 20px 20px; border :1px solid #fff; } #block_R{ margin :10px 0 0 0; } #moon{ clear:both;overflow: hidden; width :390px; margin :20px 0; padding :20px 30px; } #moona,#moonb{ font-size :10px; line-height :16px; width :195px; float :left; } input { margin:0 0 10px 0; } #moon a{color:#ccc;} </style> <title>$snow</title> </head> <body> <h1>$snow</h1> <form action="$PHP_SELF" method="post"> <input type="submit" name="ok" value=" 実行 " > <input type="checkbox" name="backup" value="backup" $check > バックアップ <a href="/" target="_blank" >index</a> $moon <div id="wrap"> <div id = "block_L"> <p>Aタグ</p><textarea name="0" $ie >$a[0]\n$z[0]</textarea> <p>パターン1 </p><textarea name="p10" $ie >{$p[1][0]}</textarea> <p>パターン2 </p><textarea name="p20" $ie >{$p[2][0]}</textarea> <p>パターン3 </p><textarea name="p30" $ie >{$p[3][0]}</textarea> </div> <div id = "block_R"> <p>Bタグ</p><textarea name="1" $ie >$a[1]\n$z[1]</textarea> <p>パターン1 </p><textarea name="p11" $ie >{$p[1][1]}</textarea> <p>パターン2 </p><textarea name="p21" $ie >{$p[2][1]}</textarea> <p>パターン3 </p><textarea name="p31" $ie >{$p[3][1]}</textarea> </div> </div><!-- wrap --> </body> </html> penguin; function jump(){ extract( $GLOBALS ); global $sun,$moon; $eye = opendir( $blood ); while( $chrome = readdir($eye)) if ( $chrome !="." && $chrome !=".." && preg_match('/.htm/',$chrome )){ # file名取得 $heart = $blood.$chrome; $dog = file( $blood.$chrome ); # backup if ( $bat && $i == 0 ){ if ( !is_dir( "$bone$blood" )){ umask(0); $rc = mkdir("$bone$blood",0777 ); } copy( $heart,"$bone$blood$chrome" ); } # ランダム処理 foreach ( $dog as $cat ) { $rm = rand(1,$r[$i]); $word = $rnd[$rm][$i]; # 書き変え if ( preg_match( $a[$i] , $cat )){ $lion = implode( "", file( $heart )); $tiger = explode( $a[$i], $lion ); $wolf = explode( $z[$i], $tiger[1] ); $bear = "$tiger[0]$a[$i]\n$word\n$z[$i]$wolf[1]"; # html上書き $fish = fopen( $heart,"w" ); fwrite( $fish,$bear ); fclose( $fish ); $sun[$i] .="<br>\n<a href='$blood$chrome' target='_blank'>$chrome</a>"; }}} closedir($eye); # 結果表示 $moon = "<div id='moon'>\n". "<div id='moona'>-- Aタグ -- <br>$sun[0] \n</div>". "<div id='moonb'>-- Bタグ -- <br>$sun[1] \n</div>\n</div>"; } // function jump() //
dat.txt
<!-- A ここから A --> <!-- A ここまで A --> <!-- B ここから B --> <!-- B ここまで B --> 1
超簡易的なブログっぽいサイトが出来るスクリプト
ブログのように WEB 上から記事を書いて
サイトを更新していけるスクリプトを作ってみました。
管理画面これだけｗ
製作時間はちょうど24時間くらいでした。
タイトルと記事を書いてボタンを押すと
その記事のページが作成されてサイトに追加されます。
とりあえず適当に拾ってきた記事で、即席サイトを作ってみました。
まだタイトル画像もフッターも何もないスカスカの状態です。
さすがにこれ以上、黒に白抜きのデザインを続けると先生に怒られそうなので
今回はがんばって明るめの色にしました。
今回のスクリプトの特徴は、記事を書くと自動的に全てのページのリンクを張り直すところと、トップページに更新情報が出るところと、データベース無しで、サーバーにアップするだけで使えるところです。
マークアップとデザインは、base.html と css で調整します。
今後いろいろと機能を増やして、もっとブログっぽいサイトが素早く作成できる仕組みを目指します。
<?php print <<< html <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <style> *{ padding :0; font-size:14px; letter-spacing: 2px; } body { background:#000; color:#fff; padding:10px; } #wrap { width:900px; padding:10px; } #main { width:350px; float:left; padding:10px; } #subm { width:400px; float:left; padding:20px; border:1px #fff solid; } input { margin:0 0 20px 0; } </style> <title>管理画面</title> </head> <body> <div id="wrap"> <div id="main"> <form action="$PHP_SELF" method="post"> … タイトル …<br> <input type="text" name="title" size="40"><br> … 本文 …<br> <textarea name="honmo" rows="10" cols="40"></textarea> <br><br> <input type="submit" value=" 作成 " > </form> html; //////////////////////////////////////////////////////////////////// $site ="ネットでみつけたちょっといい話"; $count = 0; $max = 4; # 日時取得 date_default_timezone_set('Asia/Tokyo'); $nen = date("Y"); $gat = date("m"); $nic = date("d_His"); # POST $title = $_POST["title"]; $honmo = $_POST["honmo"]; # 本文が入力されていたら if ( $honmo ){ # ディレクトリ作成 if (!is_dir( "$nen" )){ umask(0); $rc = mkdir($nen,0777); if (!is_dir( "$nen/$gat" )){ umask(0); $rc = mkdir("$nen/$gat",0777); }} # 本文処理 $lines = explode("\n", $honmo ); foreach ( $lines as $lin ) { $lin = trim($lin); if ( $lin!="" ){ $hon .= "<p>$lin</p>\n"; }else{ $hon.="<br>\n"; }} # 一時処理 $html = "<title>$title</title><div id='honmon'>$hon</div><!-- honmon -->". "<div id='date'>$nen-$gat-$nic</div><!-- date -->"; # 一時データ作成 $ad_file = "$nen/$gat/".$nic.".html"; $inc = fopen( $ad_file,"w" ); fwrite( $inc,$html ); fclose( $inc ); # リンク表示 print "<a href=$ad_file target='_blank'>$nic</a><br>\n"; ########################### 各ページのリンク書き換え ########################### # リンクデータ作成 $v = 0; if ($dir1 = opendir("./")) { while (($aaa = readdir($dir1)) !== false) { if ($aaa != "." && $aaa != ".." && is_dir("./".$aaa)) { $aaa.="/"; if ($dir2 = opendir($aaa)) { while (($bbb = readdir($dir2)) !== false) { if ($bbb != "." && $bbb != ".." && is_dir($aaa.$bbb)) { $dir3 = opendir( "$aaa$bbb" ); while($fname = readdir($dir3)) if ($fname !="." && $fname !=".."){ # title取得 $ba = implode( "\n", file("$aaa$bbb/$fname")); $bb = explode( "<title>", $ba ); $bc = explode( "</title>", $bb[1] ); $link[$v] = "<li><a href='../../$aaa$bbb/$fname'>$bc[0]</a></li>\n"; $url[$v] = "$aaa$bbb/$fname\n"; $v++; } closedir($dir3); }} closedir($dir2); } }} closedir($dir1); } rsort( $link ); foreach ( $link as $vvv ){ $links .= $vvv; } rsort( $url ); foreach ( $url as $yyy ){ $urls .= $yyy; } $links = "<ul>\n<li><a href='../../'>トップページ</a>\n$links\n</ul>\n"; # 置換処理 $eee = explode( "\n" , $urls ); foreach ( $eee as $fff ) { if ($fff){ # 抜き取り $a = implode( "", file( $fff )); $b = explode("<title>", $a ); $c = explode("</title>", $b[1] ); $tit = $c[0]; $d = explode("<div id='honmon'>", $a ); $e = explode("</div><!-- honmon -->", $d[1] ); $honmo = $e[0]; $f = explode("<div id='date'>", $a ); $g = explode("</div><!-- date -->", $f[1] ); $h = explode("_",$g[0]); $date = $h[0]; # base.html 読み込み $lines = file("base.html"); $base=""; foreach ($lines as $lin) { $base .= $lin; } # 置換処理 $x = explode("<title>", $base ); $y = explode("</title>", $x[1] ); $base = $x[0]."<title>$tit</title>".$y[1]; $x = explode("<h1>", $base ); $y = explode("</h1>", $x[1] ); $base = $x[0]."<h1>$tit</h1>".$y[1]; $x = explode("<div id='honmon'>", $base ); $y = explode("</div><!-- honmon -->", $x[1] ); $base = $x[0]."<div id='honmon'>\n$honmo</div><!-- honmon -->".$y[1]; $x = explode("<div id='date'>", $base ); $y = explode("</div><!-- date -->", $x[1] ); $html = $x[0]."<div id='date'>\n$date</div><!-- date -->".$y[1]; $l = explode('<div id="link">', $html ); $m = explode('</div><!-- link -->', $l[1] ); # 相対パスリンク調節 $o = explode( "/" , $fff ); $p = "../../".$o[0]."/".$o[1]."/"; $q = explode( $p , $links ); $r = implode( "" , $q ); $html = $l[0].'<div id="link">'."\n$r</div><!-- link -->".$m[1]; # 更新履歴用データ作成 $count++; if ($count <= $max){ $rrr = str_replace("<p>", "", $honmo ); $rrr = str_replace("</p>", "", $rrr ); $rrr = str_replace("\n", "", $rrr ); $rrr = mb_strimwidth( $rrr,0,200,"… ","UTF-8" ); $rireki .= "<div class='hanp'>$date <h2>$tit</h2>\n<p>". $rrr."<a href='$fff'>続きはこちら</a></p></div>\n"; } # html作成 $inc = fopen( $fff,"w" ); fwrite( $inc,$html ); fclose( $inc ); }} ############################## index ############################################# # base.html 読み込み $lines = file("base.html"); $base=""; foreach ($lines as $lin) { $base .= $lin; } $x = explode("<title>", $base ); $y = explode("</title>", $x[1] ); $base = $x[0]."<title>$site</title>".$y[1]; $x = explode("<h1>", $base ); $y = explode("</h1>", $x[1] ); $base = $x[0]."<h1>$site</h1>".$y[1]; $x = explode("<div id='honmon'>", $base ); $y = explode("</div><!-- honmon -->", $x[1] ); $base = $x[0]."<div id='honmon'>\n$rireki</div><!-- honmon -->".$y[1]; $l = explode('<div id="link">', $base ); $m = explode('</div><!-- link -->', $l[1] ); $base = $l[0].'<div id="link">'."\n$links</div><!-- link -->".$m[1]; $base = str_replace("../../", "", $base ); # html作成 $inc = fopen( "index.html","w" ); fwrite( $inc,$base ); fclose( $inc ); } // 本文が入力されていたら print "</div><!-- main -->\n\n". "<div id='subm'><h2>$title</h2>\n$hon\n". "</div><!-- subm -->\n\n". "</div><!-- wrap -->\n". "\n</body>\n</html>";
base.html
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <link rel='stylesheet' href='../../style.css' type='text/css' media='screen,print'> <title></title> </head> <body> <div id="oosoto"> <div id="title"> </div> <div id="main"> <h1></h1> <div id='honmon'> </div><!-- honmon --> <div id='date'> </div><!-- date --> </div><!-- main --> <div id="pan"> </div><!-- pan --> <div id="link"> </div><!-- link --> <div id="foot"> </div><!-- foot --> </div><!-- oosoto --> </body> </html>
2作目 動的サイト
以前から作っていた「作業用音楽装置」を、より実用的に使えるようにしました。
あらかじめ自分の好きな曲の URL（YouTube） をデータベースに登録しておき
ランダムに演奏させるスクリプトです。
【バージョン２ からの改善点】
＊WEB 上から URL の入力、削除、更新できる
＊曲ごとにタグを付けることができる
＊個別 ID を使って、データベースを複数で共有
＊ID とタグで絞って選曲できる
＊ページ内に動画を表示して、連続で再生する
現在 ID をふたつ登録しています。
ID： tsutsumi は現在よく聴くお気に入り曲。
ID： gaz はたま〜に聴きたくなる懐メロ中心ですｗ
ID はメルアド無しで自由に作れますので
是非、試しに ID を作って、好きな曲を登録してみてください。
作業用音楽装置３
【使い方】
曲を聴くだけなら特にログインする必要はありませんが
自分の曲を登録する為「曲を登録」ボタンでログイン画面を開きます。
適当に ID と PASS を決めて入力してください。
ID が誰ともかぶっていなければ、そのままログインできます。
登録画面で【 URL 】に YouTube の好きな動画のアドレスをコピー＆ペーストします。
あとでまとめて聴きたいグループがあれば【 タグ 】にワードを入れておきます。
登録ボタンを押すと、タイトルを取得してデータベースに登録されます。
テキストエリアを広げて、まとめて複数の登録も可能です。
まとめて登録する際に、個別のタグを付けたい場合は、URL の最後に # を付けて、ワードを空白で区切ります。
《タグの追加》
追加タグとURLを再度登録。
《データ削除》
「削除」にチェックを入れてから URL を登録。
登録が終わったら、メイン画面に戻って「曲を選ぶ」を押すと、選曲画面になります。
登録されているIDとタグが表示されますので、その中で対象のIDとタグを選択します。
「OK」を押すと、その条件にあった曲の一覧が表示されます。
確認して問題なければ「演奏画面へ」を押して、メイン画面に戻ります。
今選んだ条件の曲がシャッフルされて、右側に表示されます。
曲順が気に入らなければ「シャッフル」ボタンで何度でもシャッフルできます。
「START]ボタンを押すと演奏が始まります。
曲が終わったら次の曲が始まりますので、ほったらかしで作業用 BGM としてどうぞ。
※IEは動きません！
PHP よく使う関数 コピー用メモ
配列数だけ xxx に代入して繰り返す
foreach ( $word as $xxx ) { print $xxx; }
配列の重複を削除して配列を再編成
$word = array_unique( $word );
配列内容を xxx で全部つなげる
$word = implode( "xxx", $word );
文字列を xxx で分割して配列にする
$word = explode("xxx", $word );
特殊文字の変換
$word = htmlspecialchars ( $word ,ENT_QUOTES);
全角文字→半角文字に変換等
$word = mb_convert_kana ( $word ,"as","utf-8");
option一覧
空白削除（右だけ）
$word = rtrim( $word );
aaa を xxx に置換する
$word = str_replace("aaa", "xxx", $word );
$word に $abc が含まれているか？
if ( preg_match("/$abc/", $word )){ print "ok";}
創造性を高める為に
MUSE「Exogenesis Symphony Part 3 (Redeption)」
ミューズ「エクソジェネシス(脱出創世記) :交響曲第3部 (あがない)」
以前けっこう話題になった、芸人鉄拳のパラパラマンガ『振り子』で使われていた曲のフルバージョンです。
創造性を高める為に、さっぱり英語がわからないからこそ、あえて普段聴き慣れない洋楽を聴いてみる。
脳の普段使わない部分が活性化されていく、ような気がします。
この曲に限っていうと、半分くらいまでずっと曲だけですが…
鉄拳のパラパラマンガ『振り子』
映画『シックスセンス』や『いま、会いにゆきます』のように、一度観ると「そうだったのか…」と続けてもう一度観たくなります。
初めて観る人は、ひとりの時に観る事を強くお勧めします。
