ブログ作成に関するあれこれ
ここのサイトを作成するにあたって行き詰まったことなどの備忘録を、
参考にしたサイトを紹介しながら書いていこうと思います。
目的
そもそもなんで今ブログを自作したのか。
それは、WPF+C# に関する記事を web にアップしたかったんですが、
WordPress はソフトに使われている感じがして自分には合わなかったし、
そもそもテーマのカスタマイズとかが面倒でした。
所詮他人が作ったものなのでどこをどういじればいいのかほとんどわからないし、
WordPress のバージョンアップで
使っているテーマが対応できなくなったとかってこともあり得なくはないし。
やっぱり自作したほうが自分好みになっていろいろ捗ります。
ASP.NET か PHP か
まず始めに悩んだのがサイト作成のために使用するプログラミング言語です。
今さら生の html タグをメモ帳で直打ちして手動管理するなんてことはしたくなかったので、
MySQL を使ったデータベースで運用することは前から考えていました。
しかし、そうしたときに MySQL を扱うための言語をどうしようか悩んでいました。
その選択肢として C# による ASP.NET か PHP か少し考えました。
ただ、ASP.NET を選択する場合、サーバが IIS に対応していなければならず、
現在レンタルしているサーバでは使えないとのこと。
結局 PHP を選択せざるを得ない状況でした。
なぜ Ruby などの他の言語が挙がってこないかというと、
PHP は 10 年ほど前に使ったことがあるからです。
ただその頃はちょうど PHP 5.0 がリリースされたかどうかくらいのときで、
自分の技術力不足も相まって、できることが限られていました。
最近 WPF+C# による開発をするようになり、
C# という素晴らしい言語と出会えたため、
せっかくなら web サイトも C# でできたらいいなぁと思っていたのですが、とても残念です。
機会があれば ASP.NET にも触れてみたいです。
本で勉強
PHP を過去に使ったことがあるとはいってももう 10 年ほども経っているので、
変数をどうやって使うかなどきれいさっぱり忘れていました。
ネットで調べながらでもよかったんですが、
ここは基本をしっかり押さえておこうと思い、
本を購入して勉強しました。
かなり初学者向けでしたが、
PHP の基礎から MySQL によるデータベースアクセスまで一本道で、
今の自分にぴったりの本でした。
最後はソースコード全掲載で丸投げという豪快な終わり方も素敵です。
レスポンシブデザイン
「レスポンシブデザイン」という言葉は聞いたことがあっても、
実際にそれが一体なんのことなのかについて今回初めて知りました。
以前からブラウザ依存問題で web サイト作成は苦労するということがありましたが、
今はそれに加えてデバイス依存問題で苦労する、ということですね。
とりあえず OXY NOTES の記事を参考に
ヘッダ、フッタ付きの 3 カラム形式のデザインを作成しました。
そして画面横幅に応じて 3 形態に変化するデザインにしています。
デスクトップ環境で閲覧している方はブラウザの横幅を変更すると
デザインが変化する様子がわかるかと思います。
ただ、まだまだ調整が足りないので、
特にスマホで見ると現在は記事一覧が隠れてしまう謎仕様になってしまっています。
無理にレスポンシブデザインにする必要がなかった気がするけど、
興味があったので実装してみました。
まあおまけ機能程度に考えています。
記事投稿専用ページのこだわり
通常ユーザには見えないページの話ですが、
ブログの記事を投稿するための専用ページを自作しました。
WordPress などでは専用のページがかなり作りこんであり、
到底自分には真似できる代物ではありませんが、
web ブラウザ経由で新規投稿する機能はとても使いやすいので、
そこだけはなんとか頑張ってみました。
この作業をしているとき、まったく別件で teratail を利用していました。
teratail では、回答を編集するとき、
リアルタイムで編集結果のプレビューが同時に表示されていました。
このプレビュー機能が非常に使いやすくて感動したので、
これはぜひとも導入しなくてはいけない義務感に駆られて実装しました。
導入にあたり、IT かあさんにお世話になりました。
そこで紹介されている「リアルタイムにテキストエリアのvalue値を取得する」方法が
ズバリそのものだったので、これを応用してプレビュー機能を実現できました。
ちなみに JQuery はかなり有名なライブラリですが、
自分は使ったことがなかったので WEB 企画 LABO の記事で少し勉強しました。
だいぶ前から存在は知っていましたが、
JavaScript を無効にする設定が流行っていた時代もあり、
今まで使ったことがありませんでした。
ユーザ認証のためのパスワード
投稿用のページを作ってしまったので、必然的にユーザ認証が必要になりました。
パスワードによる認証では SHA-2 などが有名で、
C# では一度実装したことがあったため、
ハッシュとかソルトとかいった話は理解していました。
でもこれを PHP でどうやるの？っていう部分を知らなかったので調べたところ、
Qiita に良い記事がありました。
さすがにハッシュ計算などを自作しようとは思っていなかったので助かりました。
その他いろいろ
その他、hr 要素を素敵にデザインする方法とか、
JavaScript でゼロサプレスする方法とか、
見出しのスタイルとかを調べながら作成しました。
所感
とりあえず一通り作ったことで達成感はあります。
でもまだまだ足りない機能がたくさんあるので、
これからコツコツと作り上げていきたいです。
追記 (2017/3/23)
ブログ記事を新規に編集していたのに間違えてページを移動してしまったでござる…。
— ゆうじろ@遺伝子組換えでない (@twyujiro15) 2017年3月23日
新規にブログ記事を編集中で完成間近だったのに
ページを移動したことによってまさかのロスト！！
速攻で実装しました。
いつかやるんじゃないかとドキドキしながら
緊張感のあるアップデート作業をしていたが、ついにやってしまった…。
最初から実装しておけばよかった…。反省。
Tweet
|
<< 古い記事へ 自作ブログ始めました。 |
新しい記事へ >> Tips コンテンツの追加 |