読者です 読者をやめる 読者になる 読者になる

S.F. Page

Programming,Music,etc...

ポータル的な何かを作る(1) - 環境の構築

ポータル的な何かを作り始めるため、環境構築を始めた。 ビルドシステムはgulpにして、gulpfile.jsは他のプロジェクトファイルから引っこ抜いてきたものを使用する。クライアントスクリプトはES6で書いてbabelでトランスパイルしてbrowserifyでひとまとめに…

ポータル的な何かを作りたくなってきた。

はてなブログテーマの修正から少しWeb的な何かを作りたくなってきたので、ゲーム作りは少し一休みして、自分のポストをまとめるサイトのようなものを作ろうかなと思っている。Twitter、Tumblr、はてなブログ、Youtube、Qiitaの各サービスのAPIを使ってコンテ…

はてなブログのカスタマイズ - カテゴリをブログの下につけてみる。

ちょっとカスタマイズ熱に火がついて、いろいろいじってみている。今日はブログ下にカテゴリを追加してみた。 最初はタグ・クラウド風にしてみたが、なんかいまいちで、今はBootstrapのボタンとバッジというスタイルにしている。カテゴリを見てみるといい加…

ブログの見た目を作る

ちょっとずつではあるが、新しいブログシステムの見た目を作りはじめている。正直このあたり苦手なので試行錯誤している。ようやくモバイル用のハンバーガーメニューみたいなものができたところだ。 レスポンシブ・デザインなんていうのは今ではごく当たり前…

レスポンシブUIフレームワークを作りはじめる - 勉強しながら実装しつつ、軽量フレームワークを研究しようかなと

軽量なレスポンシブUIフレームワークをいちから作ろうかなと手を動かし始めた。もうタスクランナー周りの設定でおなか一杯になっている。何も出来ていないのに趣味としては十分な満足度が得られるという、おかしなことになっている。レポジトリの状態は以下…

cssnext(postCSS)を使ってみることにする。

自分でブログシステムを作ろうとしているが、UIをどうしようかと考えていた。 Bootstrapを使おうと思っていたけど、もれなくjqueryがついてくるのでそれがちょっと無駄に思えてくる。Bootstrapもナビゲーションあたりしか使っていないし、DOM操作は最近はd3.…

Windows 10 build 10532にアップデートしたらChromeとEdgeが動かなくなった。

不具合発生 Insider Previewをダウンロード可能にして数日たった今朝、PCをスリープから復帰しようとすると、PCの電源が立ち上がっており、10532にアップデートしていた。昨日スリープして寝たはずなんだけどな。。ひょっとするとスケジュールアップデートで…

ブログシステムを作る - Ghostなどを試してみる。

またはてなブログから引っ越したくなってきて、ブログシステムの作成を再開しようと思った。しかしどこまで実装したか忘れてしまったので過去のポストを見ると、状態管理のライブラリを使って見るところで放置してしまっているようだった。 node.jsベースの…

JSのFinate State Machineを探す

ブログシステムのフローをゴリゴリ書いてもいいのだが、複雑になるとメンテナンス性に欠ける。特に状態管理が煩わしい。なのでここ何日かJS版のFSMライブラリを探していた。いろいろあるけどよさそうなものを3つ見つけた。 まずはmachinaというもの。これは…

nw.js上でdexieを使う

ブログシステムのコードを書き始めた。ダッシュボード・テンプレート SB Admin2 をベースに少しずつUIを作り替えていく作戦で始めた。実装はHubPressを参考にする。 HubPressでは設定情報を保存するデータストアとしてIndexedDBを使用している。IndexedDBはD…

JSON-LDベースのブログシステムを考える(5) - ビルド環境を整える

アイデア的に「これだ!」というものはないものの、ぼちぼち作り始めようとまずはビルド環境を整えるところから始めている。 私はまともにタスク・ランナーとかを使って作ったことはない。今回は私にしてはそこそこの規模のものになりそうなので、gulpとかを…

GitHub APIを少しいじるコードを書く。

HubPressのコードを参考に認証部分を書いてみた。といってもほとんどHubPressと同じコードだが。 sfpgmr/authtestgithub.com 実行サンプル 中身はログイン後、Personal Access Tokenを取得するところまでのコードである。HubPressではこのPersonal Access To…

js-gitとかnodegitとか

今作ろうとしているブログ・システムのコンテンツ・マネジメントのかなりの部分をGitにお任せしようと思っている。GitHub Pagesにアップするにもpushすればいいし、履歴管理もお任せできる。 ただ進めるにはアイデアが足りないし、Gitもinit,clone,push,fetc…

HubPressのコードを読む

昨日はHubPressのコードを読んでいた。 HubPress/hubpress.iogithub.com 一番興味があるのはgihub apiを使ってのPersonal Access Tokenの取得方法で、そこはかなり追っかけることができてだいたい理解できた。 AuthServices.jsが肝の部分である。 さらにHubP…

react.jsが今一つピンとこない

react.jsが今一つピンとこない。ちょっとドキュメントを読んだだけではよくわからない。当たり前か。。わかるのは普通のMVVMライブラリとは毛色がかなり違うということだ。見た目だけかもしれないが。 A JavaScript library for building user interfaces | …

JSON-LDベースのブログシステムを考える(4) - ダッシュ・ボードを作る

ぼやっとした状態ではあるが、UIから実装し始めることにした。ただ私はUI作りは大の苦手である。のでフリーのものを活用させていただくことにする。Bootstrapベースのダッシュ・ボードテーマをいくつかチェックして一番無難そうなものを選んだ。これをカスタ…

JSON-LDベースのブログシステムを考える(3)

遅々として進まないが、ブログシステムをどのようなライブラリで作るかは大体固まってきた。 UIはnw.jsとd3.jsとknockout.jsで作る。 静的HTML出力部分はnw.jsで作る。 コンテンツ更新はnw.jsからgitをコントロールして行う。 コンテンツの履歴とか更新管理…

JSON-LDベースのブログシステムを考える(2) - script要素のクローン

JSON-LDベースのブログシステムであるが、データフォーマットは今のところ以下のようになっている。まだまだ途中の段階で追加しなければいけない属性もたくさんある。 JSON-LDベースといいながら、データフォーマットはHTML5である。メタ・データをJSON-LD化…

script要素中のHTMLデータのエスケープと、JSON-LDデータのエスケープを考える。

自前ブログシステムのデータの持たせ方を考えている。 アイデアとしては以下のような、HTML中にJSON-LDデータを埋め込む形を考えている。 JSON-LDにコンテンツデータを持ち、それをスクリプトでレンダリングして表示するのである。で、コンテンツデータは当…

JSON-LDベースのブログシステムを考える

JSON-LDをデータ・フォーマットとしてブログシステムを作ろうと考えているが、なかなかうまくアイデアがまとまらない。 ちょっと整理するために実装したい機能や環境や仕様を無秩序に列挙してみる。 静的ブログシステムである。 nw.jsかio.jsをベースに作る…

ブログの引っ越しを検討する

ブログの引っ越しがしたくなってきた。不定期だが新しいブログシステムへの移行欲求が沸き上がってくる。今は静的コンテンツジェネレーターへの移行がしたくてたまらなくなっている。 きっかけはjekyllであるがrubyという障壁のためそれに代替となるシステム…

Bootstrapによるはてなブログのカスタマイズ - なんとなく方向は固まったかな。

カスタマイズしたものに変更 昨日カスタマイズしたものを実際に反映した。今見えている「見てくれ」がそうである。 LESSファイルはここにある。ソースコード自体は「boilerplate」をベースにしている。 実際行った手順は下記の通りである。 Hatena-Blog-Them…

LESS - extendの書き方と@import (reference)

ブログテーマをBootstrapベースでカスタマイズしている。 今日はLESSの知識を深めるためにLanguage Features | Less.jsを読んでいたのだけれども、extendの書き方や@importも機能が拡張されていることを知った。日本語のLESSの情報はこの辺りアップデートさ…

LESS - &:extend()と引数なしMixinの違い

LESSでクラス定義を&:extend()と引数なしMixinした場合の結果がどう違うのかテストしてみた。どちらも事前定義したクラス定義を適用するものである。 .btn-test { text-align:center; border:1px solid gray; color:black; &:hover { background-color:red; …

はてなブログをBootstrapベースでカスタマイズする

今日はBootstrapをおさらいしながら、「boilerplate」テーマのカスタマイズを行っていた。 どのようにカスタマイズするのかをもう少し具体的に言うと boilerplate.lessの@import部分をすべてリマークする。 代わりにbootstrap.lessを@importする。 boilerpla…

今後のサイト構成について考える

ブログ部分は移行したけども 思い付きでブログを移行したが、覚悟はしていたがやはりProバージョンといえどもWordpressよりは制限がある。ちょっと気づいたところを列挙すると 公開後下書きに戻すことができない。予約投稿だと公開されるまでに下書きに戻す…

Wordpressからはてなブログへ移行した。

移行した そういうわけで昨日下記のスクリプトをnode.jsで作り、WordpressデータをMT形式でエクスポートし、はてなブログにインポートした。記事数は3000ちょっとであるがインポートにはかなりの時間を要した。 記事中の自ブログへのURL等もそれなりに変換し…

結局はてなブログに引っ越すことにした

ブログ記事は静的HTMLサイト化するのはやめて、はてなブログに引っ越しすることにした。 Wordpressを公開しているVPSサーバーは静的コンテンツやnode.jsの実験場として今後も引き続き利用する。 なぜ急に?という感じだが、移行プロセスでいろいろな技術に触…

RDFa Lite , json-ld , セマンティックタグ

ここ数日はRDFa Lite 1.1 , JSON-LD 1.0, セマンティックタグを勉強しつつ、Wordpressデータベースから静的コンテンツを作るコードを書いているが、まだ完成していない。 この辺ももちろん疎いので勉強しつつということになる。ようやく本質的な部分の概要が…

コンテンツをクライアント側でレンダリングする件

クライアントレンダリングのアイデア ちょっと放置気味の過去のWordpressコンテンツの静的HTML化の話である。 静的HTMLそのものをデータとしたいがためにできる限りセマンティックなタグやメタ情報のみとしたい。 静的HTMLはモデル、外部css,jsはビューとい…

Wordpress DBからカテゴリのディレクトリツリーを作る(2)

うまく書けたような 昨日のWordpressカテゴリを元にディレクトリを作成する処理の続き。 非同期処理のためにMySQL接続をうまくクローズできない問題はコードを見直した結果、うまく解決できたような気がする。 var fs = require('fs'); var zlib = require('…

Wordpress DBからカテゴリのディレクトリツリーを作る

カテゴリのディレクトリツリーを作る ここ数日はnode.jsでWordpressのカテゴリーからディレクトリツリーを作るコードを書いていた。 Wordpressではカテゴリをwp_termsとwp_term_taxonomyの2つのテーブルで管理している。 wp_termsは以下のようなフィールドで…

静的HTMLへの移行方法について考える

大風呂敷を広げてみたものの Webの世界は広大である。HTML5 APIもさまざまなものがあり、全貌を把握するにはまだ至っていない。今日もHistory APIというものを見つけた。まずは規格書を読むのがよさそうだが、じっくり読んでいくと死ぬまでかかりそうだ。今…

移行スクリプトをnode.jsで作りはじめる

ぼちぼちと移行スクリプトを書き始める 昨日くらいからぼちぼちとWordpressコンテンツを静的HTML化するスクリプトをnode.jsベースで書き始めた。 数日くらい前からStaticPressでいろいろ試行錯誤したりソースコードも読んでみた。このプラグインは自己スクレ…

開発環境のセットアップ(3)

gitを導入 自宅のCentOSにGitサーバを構築してみたを参考にgitを導入。Windowsからもcloneやpushができるか確認。これをベースにコンテンツ更新をpushしたら自動的にコンテンツディレクトリへpullする仕組みを作ればやりたいことができそうだ。 sshの公開鍵…

開発環境のセットアップ(2)

今日までに下記のインストールセットアップを行った。 仮想マシンの作成。 8.1のクライアントHyper-Vを使用して仮想サーバーを一台作成。VPSに合わせメモリ1GB、HDD 10GBで作成。 CentOS 5.2のインストール。 仮想マシンにVPS環境と同じCentOS 5.2をインスト…

開発環境のセットアップ

とりあえずCentOSを入れ、nginxを入れ、php-fpmを入れ、MySQLを入れ、VPSのconfigを投入し、、と続けているがまだVPSと同じ環境までには至っていない。nginxは動くものの、phpとの連携がうまくいっていない状態だ。まあ数日のうちに解決するだろう。 メモリ8…

うーんしかし悩むな。。

最近いろいろなWeb技術を顔は思い出すが名前は思い出せないレベルに衰えた脳みそに詰め込みすぎたせいか、脳内はWeb技術のキーワードでごちゃごちゃした状態となっており、今後どう進めるべきか決めあぐねている。 WordpressのテーマをBootstrapベースで作ろ…

昨日からMarkdown記法を試している

今日からJetpackのMarkdownを使用し始めた。 私はタグ直書き派でもうかなり慣れてはいるのだがそれでもタグ書きは面倒である。これを使うとかなり楽になると思われたので導入してみた。すると空行を挟むと段落の<p>で囲まれるはずがなぜか囲まれない。調べると<br/>や<p></p></br/></p>…

Wordpress 3.8にアップデートしてしまった。

しまった。さっきあわててWordpress 3.8のUS版にアップデートしてしまった。というかUS版かどうかもよくわからないが。でも文字化けとかはとくにしてないけどね。あとから日本語版にアップデートできるのだろうか。。そんなにあわててアップデートする必要は…

FollowSymlinksという魔物

FollowSymlinks FollowSymlinksを知らないせいで的外れなポストをしてしまった私であるが、おかげでFollowSymlinksの危険性がよくわかった。特にロリポップの件から2-3日経ち、この件に関する的を射たブログ記事が書かれている。 ロリポップのサイト改ざん事…

ロリポップのWordpressが乗っ取られた件

いやー驚いた.. いやーもう先週はこの「当社サービス「ロリポップ!レンタルサーバー」ユーザーサイトへの第三者による大規模攻撃について」が発生したので自分のサーバーが攻撃されはしないかとヒヤヒヤしておったのですよ。ずっとウォッチしていた。原因を…

Webmatrix3でIIS ExpressもしくはApacheを80番ポートで動かす

WebMatrix3とIIS Express WebMatriX3をインストールすると同時に(強制的に)IIS Expressもインストールされる。WebMatrixは開発用WebサーバーとしてIISExpressを既定で使用する。 このIIS ExpressというのはIISのサブセット的なもので、開発用としてローカ…

Twenty Thirteenテーマを導入した。

そういうわけで Twenty Thirteenテーマの導入に踏み切った。まずは開発・テスト環境を整備しなおした。XAMPPとWebMatrixをインストールし直した。さらに本番サイトからDBとWordpressのバックアップを取り、開発環境にコピーした。そしてWordpressをXAMPPで動…

NginxのFast CGI Cacheを使ってみる

Fast CGI Cache 「Nginxを使ったもう一歩進んだWordPressチューニング」を見て知ったのだが、NginxにはFast CGI Cacheという機能がある。これは名前の通りCGIの処理結果をキャッシュするものである。現環境はServerディレクティブを2つ使って、1つをキャッ…

nginxによるWordpressコンテンツのキャッシュ

nginxのキャッシュが動作するようになった。 nginxの設定をいじってようやく動作するようになった。設定については下記サイトを参考にした。設定についてはまだまだ分からないところがある。やっぱりどのディレクティブが今適用されているかとか、ディレクテ…

apacheからnginxへ。さらにAPCの導入。

このブログのパフォーマンス このブログはServersMan@VPS+MySQL+Apache+PHP+Wordpressという環境で動作している。構築は自分で行ったけども、このあたりの情報は豊富にあるのでさほどハマることもなくできた。動作も安定しているように思う。 このブログに対…

node.jsをいじり始める(5) - HTML5・CSS・jQueryを理解するうえで私がポイントと思ったところとか

Tumblrのポストを表示するためのページ作りを進めている。CSS・JQuery中心に実装を進めていて、node.jsどころではなくなっている。モダンなWeb技術に関する知識のない私が、Wordpressのテーマかスタマイズを始めてから今まで勉強してきた中でポイントだ!と…

ServersMan@VPSにもnode.jsをインストールしてみた。

ServersMan@VPS node.js のインストールに従ってWordPressを動かしているサーバーにもnode.jsをインストールしてみることにした。 g++は入れた記憶があったので、node.jsだけをインストールすればよいと思い0.8.21バージョンをダウンロードし、./configureす…

ブログをカスタマイズする(7) - IIS Rewrite モジュールの追加とか

Wordpressの"Pretty"パーマリンクへの対応 開発用のWebサーバーをApacheからIIS Expressに変更してみたけど少々問題が発生した。Wordpressでは"Pretty" パーマリンクを使っている。なのでApacheではmod_rewriteを使ってURLを書き換えている。何もしないとIIS…