アナログCPU:5108843109

ゲームと音楽とプログラミング(酒と女とロックンロールのノリで)

('ω') < イザユケエンジニャー

CodeIgniter入門 #1:Hello CodeIgniter World!!!

※「CodeIgniter入門する人向け記事」じゃなくて「自分がCodeIgniter入門してみた記事」です

CodeIgniter入門シリーズ カテゴリーの記事一覧 - アナログCPU:5108843109

仕事でCodeIgniter触ることになり自分でなんか作った方が理解早そうだなと思って、なんかやってみる。
あとPhalconほどじゃないけど名前がかっこいいし、高速で軽量で自由度が高いということで。
とりあえずHelloWorldまでやってみます。

開発環境はWindows、サーバーはLinuxの想定です。
まあXAMPPで動かすだけなんですけど。

CodeIgniterのダウンロード

以下からzipをダウンロードして展開します。
www.codeigniter.com

ちなみに今回ダウンロードしたのは3.1.10でした。

中身を見てみる

こんな構成でした。

  • application
  • system
  • user_guide
  • index.php
  • …などなど


えっ…これさあ…
もしかしてここがドキュメントルートになるの??自由すぎない???

applicationとかsystemとかのディレクトリを覗いてみると、
以下全ディレクトリに「403だよ」って表示するだけのindex.htmlが設置されている…。
まじかよ…。
じゃあドキュメントルートの下に置かなきゃいいじゃん、と思いましたが、ひとまずこの形で進めてみます。
(ちなみに仕事で触るプロジェクトはapplicationとsystemを外に移してました。せやろな)

ローカルで動かしてみる

きっとサンプルページ的なものは最初から出るだろうと踏んで、ダウンロードしたファイルには一切手を加えず適当なところに設置。
英語アレルギーに耐えつつreadmeを見てみるとPHP5.6以上ということだったので、適切なXAMPPを選ぶ。
httpd.confとhostsを編集してXAMPPを起動してアクセス。

f:id:honey8823:20190618130921p:plain

えー…

えーと…

このページのviewは application/views/welcome_message.php で、
controllerは application/controllers/Welcome.php だよ、ってことですかね。

とりあえず動いたっぽいので良し。

HelloWorldしてみる

じゃあ、ここを差し替えてHelloWorldしてみます。

その1:viewを書き換えてみる

application/views/welcome_message.php の内容を適当にいじってからリロード。
無事反映されました。まあそりゃそうなんですけど、確かにここに紐づいてますよということで。

元に戻します。

その2:別のviewを呼んでみる

application/views/welcome_message.php を複製して、HelloWorld仕様に適当に書き換えます。
ここでは hello_world.php としました。
それから application/controllers/Welcome.php から複製したviewを呼ぶよう変更。

public function index()
{
	// $this->load->view('welcome_message'); // これをコメントアウトして
	$this->load->view('hello_world'); // こうじゃ
}

それからリロードすると無事反映されました。
Welcome.php も元に戻します。

その3:別のcontrollerを呼んでみる

次は application/controllers/Welcome.php も複製して、HelloWorld仕様に書き換えます。
ここでは HelloWorld.php としました。
(書き換え内容はその2と同じ)

じゃあこれをどこから呼ぶんだ、と探してみた結果、
application/config/routes.php でした。

// $route['default_controller'] = 'welcome'; // これをコメントアウトして
$route['default_controller'] = 'helloworld'; // こうじゃ

こうやってwelcomeを呼んでいるのをhelloworldに書き換えてリロード。
無事反映されました。

routes.php ももとに戻します。

その4:新しくページを作る

さっきからトップページを書き換えているだけなので、今度は新しくページを作ってみます。

長くなるので結論だけ書くと、以下2つの手順でいけました。

① config/config.php の調整

// $config['index_page'] = 'index.php'; // このindex.phpを
$config['index_page'] = ''; // 消す

②ルートディレクトリ(index.phpと同じ階層)に、下記内容の .htaccess を設置

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php/$1 [L]

この調整をしてから /helloworld/ にアクセスすると無事に表示されました!

ちなみに、controllerに hoge メソッドを追加すると、/helloworld/hoge/ でアクセスできます。

おしまい

無事にHelloWorldできましたのでとりあえず今回はここまで!

蛇足:ルーティングについて

> 長くなるので結論だけ書くと
と書きましたが、その部分の補足を。

まあ新しいページ追加するつってもルーティングをなんとかすればいけるっしょ、とユーザーガイドを見てみました。
URI ルーティング — CodeIgniter 3.2.0-dev ドキュメント

URI のセグメントは通常、つぎのパターンに従います:

example.com/class/function/id/

お、もしかして設定いらない? と思って /hellowold/ にアクセスしてみるものの、404。

じゃあ一応設定してみる?と思って

$route['helloworld'] = 'helloworld';

としてみましたが、まだ404。

軽くぐぐってみると同じような?症状の人を発見。未解決だけど。
PHP - CodeigniterでURIルーティングがうまく動作しない。|teratail

(私のサーバーのドメイン)/index.php/users/list/でアクセスできた

なんじゃそりゃ、と思いつつ /index.php/helloworld/ にアクセスしてみると確かに正常に表示された。
なんじゃそりゃ。

もうちょっとユーザーガイドを見てみるとこんなページを発見。
CodeIgniter の URL — CodeIgniter 3.2.0-dev ドキュメント

デフォルトでは index.php ファイルは URL に含まれます

…?
???
え、なんで?

なんでかは分かりませんが、↓も参考にしつつ先に書いた方法で解決しました。
CodeIgniter 3でURLに付加されるindex.phpを外したい(取り除きたい) | onocom

別々の設定を持ったChromeを同時に起動する

今いる作業場所、何故かChromeのプライベートモードが使えないよう制限されていて、
いろんなアカウントを使い分けるようなテストでちょっと困るので
cookieなど無駄に汚したくないし後から全リセットするのもヤダヤダ)
調べてみたところ、普通のChromeを複数同時に起動する方法がありました。

手順は以下の通り。

  • 任意の場所に、Chromeのデータを保存するためのディレクトリを作っておく
  • Chromeのショートカットを好きなところに作る
    • もちろん、今使っているものとは別のショートカット
    • 名前は好きに変更してどうぞ
  • 作ったショートカットを右クリック>プロパティ で、「リンク先」のところに以下を追記する
    • --user-data-dir=さっき作ったディレクトリのフルパス
    • 「OK」で保存して完了

リンク先のところは要するにこんな感じになります。

"C:\ ... \chrome.exe" --user-data-dir=C:\chromedata_1

この方法で、好きなだけ別々のChromeを量産できます。
作ったショートカットから起動してみると、まっさらの状態のChromeが出てきます。
プライベートモードとは違って、こっちはこっちで「普通」に使えるのが利点になり得ます。
例えば
「仕事用と個人用」とか、
「同時に別々のアカウントでひとつのウェブサービスにログインしたい」とか。
リセットしたけりゃフォルダを空にすればいいし、
いらなくなったらショートカットとフォルダを消してスッキリ、という寸法です。

体調不良で会社を休むときの報告

朝起きて体調が悪いとき。
もしくはぶっちゃけ寝坊したけどそのまま休みたいので体調不良という設定にするとき。
ふつうの会社であれば連絡を入れて休みをもらう、という流れになると思います。

連絡方法は会社によりけりですね。
最初に勤めた会社では直属の上司に電話連絡、
前の会社や今の会社では全社ML宛にメール。
最初の会社や今の会社は有休扱いになるのでその後サイ○ウズ的なやつで有休申請。

唐突に「今日休みます」だけの内容もちょっとアレだなという感覚はあるので
「今日は体調不良で休みます」とするのにはそんなに抵抗はないんですが、
最初の会社と前の会社では症状の報告も求められました。

…何故?

頭痛か腹痛か聞いてどうするんですかね?
ノロやインフルエンザなどの「感染症かどうか」は大事だと思いますが、
病院でもないのに「症状」を聞く意味って??
プライベートな内容にも程があると思うんですけど…。

しかも一対一の電話報告内だけならともかく、
偉い人たち全員宛の有休申請とか全社宛のメールでって。
なんで自分の弱みを知らせて回らなきゃいけないんだって感じ。
あと極端な話「生理痛が重いので」とか全方位に言って回るの嫌じゃないですか。
(まあ実際問題としてはみんなせいぜい「腹痛」くらいにしか報告しないだろうけど、一定周期ごとに腹痛で休む人がいると結局「あっ…(察し)」ってなるよね)
つーか見る方としても朝から「嘔吐」「下痢」系のやつとか目にしたくないし。

前の会社を擁護するとすれば、当日の体調不良は有休ではなく欠勤扱いだったので、有休と違って理由を聞くこと自体はOKだと思います。全社宛に症状を報告というのがアレなだけで。

ということで最終的に、そういうデリカシーのない会社には何でもかんでも「頭痛」と報告するようになりました。
頭痛なら出勤しても仕事にならんし、言っても言われても不快には思いにくい症状だし、市販薬が効かないケースもまあまああるし、病院行っても原因が分からないことも多いし、プライバシー的にアレな部分にも踏み込まれにくいし。あと元々が頭痛持ちだし。

…という仮病みたいな対応策を取ることになる以上、やっぱり症状を詳しく聞く意味はないと思うんですけどねー。

パスを通す(環境変数の設定)

たまーに発生する作業ですが、毎回忘れて調べているのでメモ。

環境変数の設定画面を開く

左下の田をクリック後「環境変数」とか入力してやれば出てきます。
最近のWindowsはこういうところ便利で好き。

f:id:honey8823:20190607141904p:plain

「システムのプロパティ」が開いたら「環境変数」をクリック。

f:id:honey8823:20190607141906p:plain

設定を追加する

出てきたウインドウで「Path」を選んで「編集」。
さらに出てきたウインドウで「新規」をクリックすると入力欄が出てくるので、
そこに追加したいパスを入力すればOK。

f:id:honey8823:20190607141909p:plain

XAMPPを複数インストールして使い分ける

XAMPPを使ってローカルで環境構築する際、PHPのみダウングレードしたく
以前試した方法(最新のXAMPPに対しPHPのみ置き換える)でやってみたのですがうまくいかず…。

仕方ないので、今回は単純に古いXAMPPをインストールしました。
でも今後新しいPHPを使うこともあるかも、と思い試しにXAMPPを複数インストールしてみたら無事成功しました。

まず、古いXAMPPのインストーラはこちらからダウンロードできます。
sourceforge.net

インストール中、インストール先のディレクトリを選択するところがありますので
そこで任意の異なるディレクトリを指定するだけでOKです。
バージョン名を付けたディレクトリを用意すると分かりやすいと思います。

hostsファイルをすぐ開くバッチを作る

いや、もっとスマートな方法がありそうですけど。

以下内容のバッチファイルを作成して好きなところに置いておくと、あとはダブルクリックで開けます。

cd C:\WINDOWS\system32\drivers\etc
notepad hosts

「管理者として実行」じゃないとダメかな?と思ったら普通に開いても変更・保存できる…。なんでだろ。

とりあえずローカルでWordPressを動かしてみる

Windowsでxampp使って動かしてみます。

xamppをインストールして使える状態にする

本筋と違うので省略。
たぶんPHPMySQLが動けばOK。

WordPress(zip版)をダウンロードして解凍する

以下からzip版をダウンロードし、解凍します。
https://ja.wordpress.org/download/

解凍後はお好みの場所に設置します。
xamppやhostsの設定ができるなら設置した上で設定を行い、
設定できない・したくないならxamppのルートディレクトリに置きます。

設定方法は前に書いたことがあるので貼っておきます。
複数プロジェクトの開発環境構築 - アナログCPU:5108843109

使用するデータベースと、そのDBに対して全権限を持つユーザーを用意する

こんな感じで。
phpMyAdminとか使うなら、ユーザー作成時に「同名のデータベースを作成してすべての特権を与える」にチェックを入れるだけでOKですが、作成したデータベースの照合順序には注意)

CREATE USER 'test_wp'@'localhost'
IDENTIFIED BY 'testpass';

GRANT USAGE ON *.* TO 'test_wp'@'localhost'
REQUIRE NONE WITH MAX_QUERIES_PER_HOUR 0 MAX_CONNECTIONS_PER_HOUR 0 MAX_UPDATES_PER_HOUR 0 MAX_USER_CONNECTIONS 0;

CREATE DATABASE IF NOT EXISTS `test_wp`;
GRANT ALL PRIVILEGES ON `test\_wp`.* TO 'test_wp'@'localhost';

ALTER DATABASE `test_wp` DEFAULT CHARSET=utf8mb4 COLLATE utf8mb4_general_ci;

データベースの情報をWordPressに設定

解凍したWordPressディレクトリの中にある「wp-config-sample.php」を複製し、「wp-config.php」にリネームします。

リネームしたら、テキストエディタWindows標準のメモ帳はNG)で必要な部分を編集します。

define('DB_NAME', 'test_wp');      // DB名
define('DB_USER', 'test_wp');      // ユーザ名
define('DB_PASSWORD', 'testpass'); // パスワード
define('DB_HOST', 'localhost');    // サーバ(今回はローカルなのでlocalhost)
define('DB_CHARSET', 'utf8mb4');   // 文字セット

// 以下はユニーク値であれば何でもOK?
// https://api.wordpress.org/secret-key/1.1/salt/ で自動生成してコピペするのが早い
define('AUTH_KEY',         '?.Pf3]H-SFj9G3...');
define('SECURE_AUTH_KEY',  'Oyb-?x|s[H8v#T...');
define('LOGGED_IN_KEY',    'jK%+*2~$;;<HBw...');
define('NONCE_KEY',        'a62P|l?5v%N^l0...');
define('AUTH_SALT',        'ED~c+EzNPt|jl/...');
define('SECURE_AUTH_SALT', '0VM/Ba{O,l1q+h...');
define('LOGGED_IN_SALT',   'F~Cy$H*Je[6v7-...');
define('NONCE_SALT',       '>XF[la.LJGOu?k...');

インストールする

/wp-admin/install.php にアクセスします。

自分の場合は

http://testwp.localhost/wp-admin/install.php

でした。

アクセスすると以下のようなフォームが表示されますので、
必要事項を入力し「WordPressをインストール」を押せば完了。

f:id:honey8823:20190412122740p:plain

ここで、パスワードが脆弱だと先に進めません。
ローカル環境だから晒すけど
「hogehogefoo」だとダメで
「hogehogefooo」だと普通になり(これなら登録OK)
「hogehogefooooo1234」は強力と言ってくれるのでこれで登録しました。
「hogehogefoo1234」も普通だそうです。
単純な文字数や種類だけでなく、一般的な単語かどうかなども見ているようで
「applicatio」はOKなのに「application」はNGでした。

また、「後から変えられますよ!」みたいなこと書いてますけど、ユーザー名は変えられませんでした。なんでや。(アカウント追加はできるのでどうしてもという時は乗り換えられるけど…)

表示確認する

「/wp-admin/」で管理画面、「/」で表側の画面が確認できます。
これでとりあえず動かしてみる段階まで完了です。

既存メールアドレスでgoogleアカウントを使えるようにする

これ常識なのかしら…

会社のメールアドレスでgoogleアカウントを使いたい、ということもままあるのですが
今までは設定された状態で入社して「これ使ってね」か、もしくはgoogle禁止だったのでしらなかった。

googleアカウント作るときに「代わりに現在のメールアドレスを使用」をクリックすると
そこにアドレスを入れられるようになるので、そのまま画面の指示に従って手続きを進めるだけ。以上。
f:id:honey8823:20190228155854p:plain

メールそのものをgmailで使うには更に設定とか必要だと思いますが、
スプレッドシートやらドライブやらを使うならこれだけで充分。

Twitterのタイムラインを設置する

↓こういうやつ。意外と簡単でした。

作り方

公式でツールを用意してくれています。
これに従って進めて、出来上がったHTMLを貼り付けるだけ。

詳しい使い方はヘルプページにあります。
タイムラインを埋め込む方法

補足

…とだけ書くのも何なので。

指定ユーザーのツイートだけでなく、
特定のツイートのみ・リスト・モーメント・ハッシュタグ…など、いろいろな指定が可能です。
最初のURL入力時にもこのようにサジェストしてくれます。
f:id:honey8823:20190222120057p:plain

また、URLと表示形式を指定するだけで完成しますが、少しだけデザインを調整できます。
f:id:honey8823:20190222121101p:plain
①をクリックで調整画面が出てきます。(②で完成したHTMLをコピーできます)

この調整では横幅縦幅をpx指定する必要がありますが、
後からHTMLを直接いじればパーセンテージだろうがemだろうが好きにできますので、
そういう調整をしたい場合はとりあえず適当な値を入れればOKです。
ただ注意が必要なのは、横幅に応じてツイートの文字サイズが変わること。
おそらくjsやcssなど駆使すれば調整は可能ですが…

Atomエディタの初期設定

PHPでの開発作業用のエディタとしてずっとEclipseを使っていたのですが、
(前の会社での指定がそれだったこともあり)
自前のPCに入れるにはちょっと重いので、試しにAtomに乗り換えてみます。

まだ試している途中なので、何かあったら追記します。

やること一覧

  • インストールする(公式サイトからダウンロードしたexeを実行)
  • 起動後、出てくる青いメッセージボックスを消す(「No, Never」を押す)
  • 日本語化する(File>Settings の設定内「Install」から日本語化パッケージをインストール)
  • 「Telemetry Consent」タブを再表示されないようにする(YesかNoの好きな方を押す)
  • 「Welcome」「Welcome Guide」タブを再表示されないようにする(Welcomeタブのチェックをオフにしてから閉じる)
  • スペルチェックを無効化する(spell-checkパッケージを無効にする)
  • ファイル末尾に改行を自動で加える設定をオフにする(whitespaceパッケージのEnsure Single Trailing Newlineをオフにする)
  • タブ幅や見え方を設定する(設定画面の「エディタ設定」内を調整)

以下、それぞれについてごちゃごちゃ書いているだけです。

インストールする

公式サイトはこちら。

Windowsの場合、ダウンロードしたexeを実行するだけでインストール完了。

よくわからないメッセージを消す

f:id:honey8823:20190213135901p:plain

さっそく起動すると、こんなメッセージが出てきます。
なんやねん。

メッセージの意味がよく分からない。
直訳すると

現在、Atomは「atom://」URIのデフォルトハンドラとして設定されていません。 Atomに「atom://」URIを処理させますか?

か。
意味がわからない。
ぐぐってみると、みんな「No, Neverを押しましょう!」って書いてる。
まあそれで問題なさそうに見えるので押した。

日本語化する

英語アレルギーは早くも心が折れそうだったので日本語化できないのか調べたら大丈夫だった。

File>Settings で設定メニューを開き、
「Install」内で日本語化してくれるやつを探してインストール。
f:id:honey8823:20190213141040p:plain
どうやらこれはアドオン的なものらしい。他にも便利なものはあるだろうからまたそのうち使いそう。

不要なタブをデフォルトで開かないようにする

なんかごちゃごちゃとよくわからんタブがいっぱいあるので、全部閉じて一旦再起動してみましたが…
さっき自分で開いた設定タブ以外は復活してきました。

そしてコレ、よく見たら左右で別々のタブを開けるようになっているんですね。

まずは左側、「Telemetry Consent」タブ。
これはよくある「利用状況を開発チームに送信してもいいですか?」みたいなやつですね。
YesかNoの好きな方を選ぶまでは出続けるようです。
自分の場合は「Yes」を選択して一度再起動してみると、確かにこのタブは出なくなりました。
(新規タブがさっきまで左側に出ていたのが、何故か右側に出るようになりました)

そして同じく左側、「Welcome」タブ。
「ヘルプを見るといいよ!」みたいなことが書いてあるようです。
よく見るとチェックボックスがあり、「Atom起動時にWelcomeGuideを表示する」みたいなことが書いてあります。
このチェックを外してからタブを閉じて再起動すると、左側の「Welcome」と右側の「Welcome Guide」が出なくなりました。

ちなみにWelcome Guideをもう一度見たい場合、
メニューの、ヘルプ>ウェルカムガイド を選択するとまた開いてくれます。
要約するとこんな感じですね。

  • プロジェクトを開くと左側でツリービューが見れるよ
  • git/githubと連携できるよ
  • 「Teletype」を使って、リアルタイムでチームメンバーと作業できるよ
  • パッケージをインストールすると好きなようにカスタマイズできるよ
    • さっき日本語化したアドオンみたいなやつですね
  • テーマをインストールすると好きなデザインにできるよ
    • パッケージインストールのところに「Themes」ってあった気がするからたぶんそれ
  • CSSでスタイルを好きに変えられるよ
  • Atomの起動時の動作をJavaScriptCoffeeScriptで変更?できるよ
    • メニューの、ファイル>起動スクリプト でそれらしいのが開けました
  • スニペット機能を使うと、数文字入れるだけでコードブロックを出してくれるよ
    • メニューの、ファイル>スニペット でそれらしいのが開けました
  • Ctrl+Shift+pでコマンド一覧が見れるよ

スペルチェックを無効化する

試しに適当な文章を日本語で書いてみたら、ほぼ全文に赤線が…。
なんじゃこりゃと思って調べてみると、どうやらスペルチェックが働いている模様。

これはオフにできました。

メニューから、ファイル>環境設定 で設定画面を開きます。
パッケージ内にある「spell-check」をdisableにすればOK。
f:id:honey8823:20190213145201p:plain

ファイル末尾に改行を自動で加える設定をオフにする

最後に改行が入っていない状態で保存すると勝手に改行を追加されて困惑したのですが、
そういう設定項目がありました。

これをオフにするには、
メニューから、ファイル>環境設定 で設定画面を開きます。
パッケージ内にある「whitespace」の「Ensure Single Trailing Newline」をオフにすればOK。
f:id:honey8823:20190213155538p:plain

タブや見えない文字の処理を調整する

タブ文字の幅や、空白・タブ文字などの見えない文字について調整します。

メニューから、ファイル>環境設定 で設定画面を開きます。
エディタ設定内にある項目を調整します。
今回は「不可視文字を表示」をオンにし、「ソフトタブ」をオフにし、
さらに「タブ幅」を4に変更しました。
f:id:honey8823:20190213160054p:plain

(今後)参考(にしたい)記事


かなり膨大なので随時チェックしようと思う。