  |
はてなキーワード: プラグインとは
web製作に関しては素人なので用語などわからぬことも多いのですがご容赦くださいませ。
最近スマートフォンを買いまして、android 2.3.3ちゃん可愛いなあペロペロという生活をしています。
＜!DOCTYPE html＞ ＜html lang="ja" xmlns:fb="http://www.facebook.com/2008/fbml"＞ ＜head＞＜title＞サイトタイトル＜/title＞＜/head＞ ＜body＞ ＜div id="fb-root"＞＜/div＞ ＜script src="http://connect.facebook.net/en_US/all.js"＞＜/script＞ ＜script＞ FB.init({appId : 'xxxxxx', status : true, cookie : true, xfbml : true }); ＜/script＞ ＜div style="border:1px red solid;"＞ ＜fb:comments href="example.com" num_posts="2" width="500"＞＜/fb:comments＞ ＜/div＞ ＜/body＞＜/html＞
こんな感じのコードをスマホのブラウザから表示すると、赤い枠がどんどん拡張していくのですが何故でしょう？
https://developers.facebook.com/docs/plugins/
ここにあるプラグインのうちいくつかはandroidブラウザでも正常に動き、
いくつかは縦にどんどん伸びていくし、いくつかは横にどんどん伸びていくみたいです。
このあたりの動作の影響なのか、スマホで閲覧ができないサイトが、一部ではクラッシュまでしてしまうサイトもあるようです。
あるサイトXでは横幅・縦幅がどんどん大きくなっていくので、
文章の入ったコンテナ部分がどこか遠くに行ってしまい読みようがないのです。
あるサイトYでは、FBその他のプラグインを大量に張っており、相性の問題もあるのか
私が検証した範囲では、
Opera mini：問題なし
でした。
これって私だけ？
なぜ両方使うという選択肢がない。真の技術者はウェブ標準だろうがFlashだろうがネイティブだろうが、その場その場でユーザーの体験を最善にし、クライアントの要求を最高に満たすベストの技術を使う。JavaScriptかFlashかなんて動きさえすればユーザーには関係ないんだから。実際、HTML5スゲＥＥＥＥＥ！！！ってページにFlashタグのブクマが間違ってつけられたりしてるよ？（笑） ウェブ標準の崇高さなんてパンピーにはわからんのです。
そもそも分からないんだけど、HTML5が「投資」するほどたいしたもの？ 誰もが基礎教養として身につけているはずの、これまでのHTML＋CSS＋JavaScriptの延長線上の技術でしょ。今まで普通にやってきたウェブ開発者ならすぐにキャッチアップできるはずだよ。
どうせHTML5の実装の普及には当分かかるし、その時点のブラウザ環境で使用可能なものをゆっくりまったりと導入していけばいいだけ。その意味ではいわゆる遅延評価学習で十分。あわてることはないです。どうせ皆使うことになるんだから。
一応言っておくと、いいものだと思いますよ、HTML5は。現段階で頑張って凝ったものを動かしておられるイノベーターの方々もたいしたものだと思います。敬意を。マリオやらグラディウスやらは著作権的にどーなのかと突っ込みたいが。
それはシナリオのひとつですよね。Googleの甲斐性次第では十分にあり得る。それと、ジョブズが翻意するというシナリオもありますよ。今までに散々あったことですが。どこかでそれをネタにしている記事があったと思いますが。
もしEdgeを見てそう思ったのなら、Flash CSを使って制作したことがありますか？ Edgeを実際に使ってみましたか？ と問いたい。
他にも、最低でも、
これらにきちんと答えられない人間にHTML5 vs Flashなど語る資格はないです。そもそも対立させる時点でわかってないなー ┐(´д｀)┌ って感じなのだけど。
あとFlashへの投資が無駄になると思ってるようですが、俺はFlashは投資判断「Buy」継続だと見てますよ。たとえこのままiOSで動かずともね。AIRもあるし、ブラウザのプラグインとしてのFlashだけ見ていると考えを誤るよ。ブラウザのほうにしても、GPUアクセラレーションつきの3Dが真っ先に使用可能になるのはFlash。プレイヤーの普及が速いから、WebGLと異なり、今後1～2年内に実案件で使用可能になるでしょう。そういった面ではなおカッティングエッジな技術だよ。
まあ、プラットフォームや言語の選択は投機だから、どの銘柄が買いか売りかで紛糾するのはわかる。ただ、それなら分散投資だとか、インデックス投資という考え方もあるのでね。HTML5に惚れ込んで一点買いなんて若いエンジニアがいたら、それはもう相当危なっかしいなと、視野も相当狭くなるだろうなと危惧するよ。
というか、JavaだろうがC++だろうがObjective-CだろうがLLだろうがアセンブリ言語だろうが関数型言語だろうが、一度全部触ってみなよ。いいから。HTML5で手一杯なんてのでは話にならんですよ。
週末に行ってきたイベントだが、ちょっとインパクトが強すぎて、あとたぶん昼から通しで追っかけてるのは自分だけなので、この話誰かに伝えたい！と柄にもなく思ってしまった。
ここまで、日本語でウケを取り、アメリカ人にしか聞こえない英語をしゃべりつつの話。まじありえないレベルの覚悟と実践なんだが・・・！
この人のセッション、ブラジル事情の紹介みたいな話で大ホール側のセッションも覗いてみようかなと思っていた所にこれで、ただちに絶対参加すべきレベルのセッションに格上げされた。こんな人がいるとは。
で、昼休み後の問題のセッション。結局ツイートどころじゃなかったが、こんな感じ：
Javaはあれが酷いとかPHPがとかいう態度でRubyを使うのも無駄だ。
なんという激熱トーク。本当に小さかった南米のRubyコミュニティを仲間と共に成長させ、いまやRubyConf Brazilとか南米で何個もイベントが立ち上がるまでに育てた。この伝道のため、ここ数年で８０箇所は回って普及に努めたとかとか。ブラジル事情への関心と関係なく、この熱量を体験できてよかった。
最後の時間オーバー後の「あと一言だけ（本当はあと１分だけと本人は言っていたのだが、わざと誤訳してタイマー役の人に会場から叫んだ自分w）」でどんなにダメだとされていても、諦めずに進めという、過去の偉人が貶められたり失意にあった時代の動画もよかった（もっとも、この話は知っていたのでインパクト自体は薄めだった）。
この後はLTとクロージング。
インパクト強すぎｗ
これ漫画系展開をバックボーンにしたエンタテイニングなスタイルだと理解せずに真に受けると大変だなと心配になったり。なにしろ上は三行だけど全部通しで書くと
真面目に受け取ったらヤバイ発言多すぎだろ・・・
こ れ が 締 め の 講 演 か よ ！
そういえば途中にまどマギネタも入ってた記憶があるのだが、上のインパクトが強すぎてどこかに飛んでった。
その後の高橋さんの最後の挨拶とスタッフを集めてのスタンディングオベーションはちょっとうるっと来た。初参加だから今回の運営自体への思い入れはないのだけど、この回だけでも感激することが多かった。この完成度に達するまでどれだけの努力と熱意が投入されていたかと考えると。
隣の席が実はtdtdsさんでびびってたのだが、最初に立ち上がったのを見て、続く二人目のタイミングが大事！とすぱっと立ち上がってみてよかった。その後前列の人がみんな！立とうよ！みたいにやって一気に雪崩状態。
これで会議は閉幕したのだが、さらにherokuの緊急パーティーが開催され、思い切って行ってみた。まあ、懇親会に輪をかけたリア充な雰囲気でまともに話せなかったのだが、
こんな一日だった。熱かった・・・
http://anond.hatelabo.jp/20110707195830
初音ミクLAライブ、外国人の感想その５。これまで紹介した感想は「ヴァーチャル・アイドルとしての初音ミク」を論じていたが、今回はミクの本来の姿、即ち「歌声合成ソフトとしての初音ミク」に注目しているのが特徴だ。また外国における歌声合成ソフトの将来性についてかなり厳しい見方をしているが、その指摘には耳を傾けるべきところも多い。初音ミクの海外進出に関する先行きを占ううえでも目を通しておく価値はあるだろう。
urlは以下の通り。
http://lelangiric.wordpress.com/2011/07/07/i-didnt-go-to-ax-but-yeah-anyway/
ミクのイベント後にはいつもヴァーチャルスターの構成要素は何かって議論が巻き起こる。クラウドソースな人格か？ touhou［東方］っぽさ？ オリジナルのないdoujin［同人］？ それともインターネットとDTMの力に関するフリードマン風の熱狂か？
確かに日本じゃ大うけだが、アメリカではこれからどう成長するんだ？ オレは英語のVocaloid3が発売されるのを待っている。いいものであってほしい。アメリカでのボーカロイドの発展には英語Vocaloid3の性能が極めて重要なんだ。けどな、アニメ産業とボーカロイドとの結びつきについては、オレは戸惑っている。つまりAXがミクノポリス会場になったことにな。今後も長期にわたって、アメリカではボカロオンリーのイベントはないだろう。アメリカに拠点を置く企業製のボーカロイドすら未だにない。オレが知っている［英語ボカロの］２つの会社はPower FX（スウェーデン）とZero-G（英国）だ。
でもな、そこでオレは考えてみたんだ。
ボーカロイドはvst［ヴァーチャル・スタジオ・テクノロジー］（とかその他のapi［アプリケーションプログラミングインタフェース］）といくつかの重要で理論的な方法は似ているんだが、極めて重要な具体的手法は根本的に違っている、とオレは理解している。基本的に（ある人間の）音声ソースを取ってきてあらゆる音素と音程を録音し、ボイスバンクを作った後で、ヤマハのVocaloid2プログラムがボイスバンクを「読む」ことができるようアプリケーションをコードする必要がある。オレはヤマハがこの部分で相当用心していると思っている。なぜなら公式のボーカロイドは（もしオレが間違っているなら訂正してほしいが）全部ヤマハのVocaloid2エディターと一緒に販売されているからだ。この意味でvstとは根本的な差異が存在する。（１）vstは通常daw［デジタル・オーディオ・ワークステーション］と一緒に流通することはない（２）vstの開発者であるスタインバーグは、vstプラグインを規格として作成しており、従って誰もがvstプラグインを作り出せる。
http://en.wikipedia.org/wiki/Virtual_Studio_Technology
http://en.wikipedia.org/wiki/Digital_Audio_Workstation
http://en.wikipedia.org/wiki/Steinberg
つまり、誰もがボイスバンクを作れるってことだ。UTAU現象がそれを示している。UTAUは違うソフトで動くボーカロイドの単なる「代替手段」（本当の意味でではないがオレは耐えられる）のフリーウエアに過ぎない。自家製ボーカロイドが登場するには（『ファンの作ったボーカロイド』はあるが、本物の商業ベースのボーカロイドとは違う）２つの条件を満たさなければならない。ある団体が充分な資本を集めて（１）高品質のボイスバンクを作成し（２）ヤマハからそのVocaloidエディターを頒布する許諾を得ることが必要なんだ。既に言った通り、紛らわしいのはボイスバンクをプログラムに「読ませる」ためのアプリをヤマハとサードパーティのどっちがコードしているのかってこと。思うに、もしおれがAXの会場にいてこの質問をしていたら、特にヤマハからVocaloid2の許諾を得るのにいくらかかるかを聞いていたら、オレは殺されていただろうな。日本のdoujin歌手を使えば高品質なボーカルを作るのはそんなに難しくないだろう。必要なのはインターフェイスと集音マイク。ダチを作ってそいつらに作業をさせる。そしてUTAUのファンダム全体を見れば分かるが、自分自身を体現したボイスバンクを作ろうとするモチベーションの持ち主は山ほどいるぜ。
http://utau.wikia.com/wiki/UTAU_wiki
オレが何を言おうとしているか分かるだろう。つまり、アメリカ製のインディー・ボーカロイド・スタジオの実現性ってのはどのくらいあるんだ？
少なくとももっと注意深く考え抜く必要がある４つの条件があると思う。
１． アメリカのアニメ業界とボーカロイドの関係。オレが思うに、ブランドイメージと、それからボーカロイドとアニメを結び付けているメーンストリームの連中のことを考えれば、こいつは最も重要な問題だ。「アニメ」はアメリカでその「あるべきもの」（つまりdirty japanese hentai shit）より遥かに大きな概念/カテゴリーになるべきだ。でもまあオレが見てきた限り、日本のボーカロイドにも同じ混同の問題があるようだけどな。とにかく、メーンストリームが一般的にアニメをどう見ているかがボーカロイド関連商品の売れ行きに影響するってことなんだが、この問題はオレには重過ぎる。omoやalexが考えてくれんじゃねーの、多分。
http://twitter.com/#!/alexleavitt
２． 誰か英語ボーカロイド使ってるヤツいる？ 西洋ボーカロイドファンダム総体の認識として、１人だけすげえアメリカ野郎がいて、そいつがボーカロイドランキング（ニコニコのやつで毎週ボーカロイドの歌/動画をコメント/再生数/マイリストに従ってランク付けしている）に［英語ボカロを］ぶち込んだことがあった。でもそいつは突然自分の動画を全削除しちまった。この一度こっきりの出来事を除けば、ボーカロイドは完全に日本のものだ。他にも英語が母国語の作り手はいるんだが、皮肉なことに英語話者のボーカロイド製作者が基礎を置く発生核となりそうな連中の大部分は、日本語ボーカロイドにengrishをしゃべらせようとしている有様だ（大笑い）。
この問題にはさらに深い根がある。
３． そんな真面目な議論じゃないんだが、ある文化の労働的な基底はどうして特定の製品に同調し他の製品には抵抗するのかについて話がなされている。歴史的かつ社会経済的な問いだ。どうしてチリは銅を掘っているのか？ なぜならそれがくそったれなほど沢山あるからだ。結果として採鉱は（おそらく）経済的な基盤が上部構造へと波及していくのと同じように（違うか？）文化的な行為となる。なぜアメリカは基底からやって来る沢山のボーカロイド曲を持っていないのか？ その理由はもう挙げているな……（１）なぜならdirty anime hentaiだから（２）アメリカにいるデスクトップミュージック人種はテレビゲームと映像作品に集中してやがるから。
http://www.imdb.com/title/tt0132477/
http://en.wikipedia.org/wiki/Base_and_superstructure
４． ２番目に上げたデスクトップミュージックの問題は重要だぜ。もしお前が独立した作曲家としてメシを食っていきたいのなら、お前の時間と貴重な音楽的アイデアをボーカロイドのように不安で子供じみた音に賭けてみようなんて考えは二度と起こさないだろう。そいつは正直、新しすぎる。西洋諸国は上出来なデスクトップミュージックを作っている。問題は、ボーカロイドは今も、そしておそらくは長期にわたって、もしかしたら決して、独立したアーティストにとって頼れる収入源にはならないってこと。たとえそれで生計を立てる気がないとしてもだ。アメリカでボーカロイドは、他のデジタル関連のインディー業界のように花開くことはできるのか？ アメリカのボーカロイドが日本のdoujin業界のようになるにはどうしたらいいんだ？
http://anond.hatelabo.jp/20110707195830
初音ミクLAライブ、外国人感想その２「再生の約束」フリーダム訳
http://anond.hatelabo.jp/20110708223459
初音ミクLAライブ、外国人感想その３「ミクノポリスのボカレタリアートたちよ、団結せよ！」
http://anond.hatelabo.jp/20110709211718
初音ミクLAライブ、外国人感想その４「仮想の歌姫：初音ミクの人気と未来の音色」
http://anond.hatelabo.jp/20110710234300
初音ミクLAライブ、外国人感想その６「ミクノポリス：７月のクリスマスと世界征服」
http://anond.hatelabo.jp/20110712205546
初音ミクLAライブ、外国人感想その７「AX11：ミクノポリスの印象」
http://anond.hatelabo.jp/20110713211501
初音ミクLAライブ、外国人感想その８「ミクノポリス：コンサート・リポート」
http://anond.hatelabo.jp/20110714210122
初音ミクLAライブ、外国人感想その９「アニメ・エキスポ：初音ミク」
http://anond.hatelabo.jp/20110715222900
初音ミクLAライブ、外国人感想その10「アニメ・エキスポ2011（抄訳）」
http://anond.hatelabo.jp/20110716194029
初音ミクLAライブ、外国人感想その11「世界は彼女のもの：初音ミクはいかにして全てを変えたのか」
http://anond.hatelabo.jp/20110717201147
初音ミクLAライブ、外国人感想その12「アニメ・エキスポ2011でのボーカロイド体験」
http://anond.hatelabo.jp/20110719031316
初音ミクLAライブ、外国人感想その13「ミク：日本のヴァーチャル・アイドルとメディア・プラットフォーム」
http://anond.hatelabo.jp/20110719203237
VOCALOID2へのバージョンアップに伴い、キャラクター性を押し出したのがクリプトンの初音ミク以降のシリーズって感じだわな。
まぁ、フォルマントシンギング音源全般での話で行くなら、XG音源のプラグインボードとかあったし、それ持ってるわ。
ただ、以前の音源系はバックコーラス用途でも音楽素材切り貼りしたほうがマシなことが多かったし、VOCALOID2シリーズも出た当初はボーカルとして使えるようなレベルではなかった。
ユーザー数が増えて、テクニカルな使い方が深化してきたからこそ商業ベースに食い込んでくる作品が出来てきたんだし。
ボカロは、ソフト名を姓名を持ったネーミングにしたりパッケージのキャラを前面に押し出したりして「歌声を操作できるキャラクター」として売ることでヒットしたものの
それは、クリプトンやインターネット、AHS等の戦略であってそれを「ボカロ」と定義するならそうだろうな。
個人的には、「ボカロ」で金が集まったおかげで、VOCALOID3の開発が早まったとするなら、大いに有難い所。
VOCALOID3はインターフェースがDAWっぽくなってきたから、そもそもFL Studio使っててVOCALIODプラグインで使えない身としては大助かりだ。
いや、海外メーカーはキャラクター性で売ってないし、ビープラッツもそうだろ。
商業ベースに乗せるために、ニコ動界隈の知名度を利用できるだけでも相当良い事じゃないかと思うよ。
何もなしに商業ベースに乗せるなんて、人間が歌っていても無理なことが多いんだから。
さらに言えば、各種のボーカロイド操作のテクニックを編み出してきたのはニコ動界隈だから、今後しばらくはニコ動界隈が牽引して行くんじゃないかね？
これは、不利な点ではないし、むしろテクニックの深化という意味ではニコ動みたいな「コメント可能な動画メディア」と「スキルが必要な何某」のシナジーは凄いと思う。
※ちなみに6月21日現在は、「5」までの公開。丁寧な記事なので、今後も期待。
1.PHPとは
http://stocker.jp/diary/wordpress-1/
2.開発環境の構築
http://stocker.jp/diary/wordpress-2/
3.WordPressとは
http://stocker.jp/diary/wordpress-3/
http://stocker.jp/diary/wordpress-4/
5.WordPressをWebサービス用のCMSとして使うために
http://stocker.jp/diary/wordpress-5/
8.WordPressの軽量化
10.資料
Wordpressに標準装備されているTwentyTenを、カスタマイズしていきたいときにお役立ち。
第一回目の投稿から読んでいってみてください。メチャクチャ分かりやすいです。
http://vanilla-rock.com/blog/wordpress/45-absolutely-install-wordpress-plugin/
基本的なプラグインが紹介されているので、最初に見ておくと大体揃いそうな感じです。
http://kachibito.net/category/wordpress/plugin
さらに背伸びして個別にプラグインを探していくなら、ここに勝るところはないのでは？ってぐらい充実。
http://phpspot.org/blog/archives/2011/01/twittermixiface_1.html
http://webdesignrecipes.com/tag/wordpress/
さらなる高みを目指すのなら、おススメ。カスタマイズ前にはバックアップも取っておきましょうね。
http://weble.org/category/wordpress
こちらもさらなる高みを目指すのに、おススメ。
Wordpressを使ったWebサービスを怒涛の勢いで作られているので、凄いです。
ただでも質問できるようになりましたが、ポイントをつけたほうが回答率は高いです。
http://ja.forums.wordpress.org/
過去に似たような質問がないかに注意。分かりやすく質問しないと、怒られやすいです (´・ω・`) 。
WEBデザイン用のフリー素材が載ってるサイトを沢山教えてください！ | ラジック
http://rajic.2chblog.jp/archives/51811012.html
１年に１回くらい趣味でwebサイトを作ったりする独学素人ノンプログラマーです。
仕事はＩＴ系にかすりもしないけど、たまにサイトが作りたくなるんです。
htmlもCSSも知識不足ですが、作成ソフトに頼ればなんとかなります。
そんなレベルで無謀にも「JavaScriptも使いたいな」とか思ったりするわけですよ。
で、たまに「簡単にわかるJavaScript入門」なんてサイトや記事がありますよね。
ああいうのを書いてくださる人に、ちょっと言いたい。
あなた方の想像を絶するほどに、俺のＩＴ系理解能力はゴミクズですよ！
「簡単に分かる入門」にさえ入門できません助けて先生！
と、鼻水をたらしながら泣き出すような底辺レベルのスキルしかないザコであります自分は。
ですが、jQueryと出会い、見よう見まねと思いつきで作ったら、こんなんできました。
jQueryってやつを使えば、ド素人にもこんなものが作れるんですね。
用語とかあんまり使わずに、中高生でも読めるレベルで語ります。
web制作にくわしくない方にも「どうなってるのか？」って雰囲気は伝わるかと思います。
技術はないけど、人とは違ったwebサイトを作りたいって方、jQueryマジオススメです！
きちんと勉強されてる方からすれば失笑ものの内容かもしれませんが、ご容赦を。
よくある「入門」すら難しく感じる自分のような方々に届けるつもりで書きます。
くわしい方は、間違いなどがあれば温かくご指摘いただければ幸いです。
あと、「知識不足の人間はこんな思考をしてるのか」という参考になればうれしいです。
前置きが長くなりましたが、それではサイトで使用した４つのjQueryを説明します。
プログラマーさんたちが作った高性能なjQueryのコードなんですが、このプラグインってのが超便利なんです。
使い方は、すでに作られているコードをコピーして、ちょっとのアレンジするだけ！
昔、jQueryの知識がほぼゼロだったころ、このプラグインを知りました。
で、俺も「カッコいいプラグインが使いてええ！」と考えて試しに使ってみたわけです。
けどまあ、プロが作ったコードを、知識ほぼゼロで動かそうなんて甘すぎですよね。
でも、あんまり深く考えずに、貼りつけて動かしてみたところ――
あっけないほど簡単に動きました。
それがサイト内の、パッケージ画像にマウスを合わせると大きくなる部分です。
プラグイン「Bubbleup」
紹介記事１ マウスオーバーを気持ち良くするjQueryプラグイン「Bubbleup」 | Web活メモ帳
紹介記事２ JavaScript + Ajax 実践サンプル集 - jQueryのbubbleupプラグインでアイコンを拡大する
配布元（英語）BubbleUp jQuery Plugin to Spice Up Your Menu | AEXT.NET MAGAZINE
ネット上にはこういうのがいっぱいあるんで、ぜひいろいろ眺めてくださいませ。
こういうの眺めても、「どうせこんなの使えないし」と思えますよね。
でも、「これがコピペで使えるのか！」と思えば楽しくなってきません？
このプラグインってのを使いこなすには、htmlとCSSの知識が必要です。
ですが逆に言えば、それと切り貼りアレンジだけで、高性能のjQueryが使えるわけです。最高ですぜ。
プラグインを貼ってカッコよく動いたんで、
と考え、最初に作った自作のjQuery部分が、サイトの表紙です。
世の中には、JavaScriptを有効にしていない人がいます。
たとえば、決して私ではありませんが、エロサイトで出る変な広告表示をさけるため、それを切っている人もいます。
で、頻繁にエロサイトに通いすぎて、切ったままなのを忘れて普段のサイトを巡ると、たまに表示がおかしくなる。
で、そんな人のために「JavaScriptを有効にしてください」と書いた表紙をつけたわけです。
ですが、jQueryはまだよく分かってなかったんで、「入門」のサイトを眺めてました。
で、いくつか読んでみても、やっぱりすぐには分からん……。
でもね、そういうとこには、「練習用サンプル」ってのがあるんですよね。
練習台で「ボタンをクリックすると画像が非表示になる」みたいなのがあったんで――
みなさま、いかがでしょ？
サイトのjQueryは、「画像をクリックすると画像が非表示になる」とアレンジしています。
最初に現れる画像をクリックすると、画像が消えて下の画面が現れましたでしょうか？
（JavaScriptを切っていると動きませんのでご注意を）
この表紙は１枚の大きなjpg画像で、それをクリックすると消えるようになってます。
よく分からんまま見よう見まねで貼りつけて動かしただけなんですが、こ、こいつ、動きます！
・５分ほどのスライド。最初見たときは知識不足で理解不能だった。
・初心者の神・西畑一馬様の入門講座。jQueryの雰囲気が分かる！
なお、「はじめてのjQuery」を見たのが、このドラクエサイトを作るきっかけでした。
黒い画面に浮かぶスライドを見て、「ドラクエの画面っぽい」とひらめいたのです。
いろんなjQueryのサイトを見てパクれる……いや、参考になるのを探すのは面白いかと思います。
うちのサイトを見て、「懐かしのゲームブック風サイトを作りたい！」とかひらめいてください。
個人的に楽しみたいので、ホントぜひどうか誰かひらめいてください！
で、簡単に動くのを見て、jQueryのすごさを改めて思い知り、きちんと勉強しようと考えました。
そこで助けられたのが、jQuery初心者の救世主「西畑一馬」さんの記事です。
なお、本格的に勉強しようという人は、入門の「速習講座」より、
ASCII.jp：Web制作の現場で使えるjQuery UIデザイン入門
これも同じく西畑さんの記事なのですが、こちらは量が膨大にあります。
速習講座では軽く流された部分も、一個ずつ丁寧に解説されています。
というか、西畑さんは本を書いてはるので、それを買いましょう（布教）。
ここは入門によく書かれる「アコーディオンパネル」をアレンジして作りました。
アコーディオンのように開いたり閉じたりするアニメーションでの演出です。
jQueryは、簡単にいろんなアニメーション効果がつきます。これが楽しんです。
そこから３種類を紹介すると、
自分のサイトの「すすむ」「もどる」で使っているのは、スライドアニメーションです。
＜「すすむ」の仕組み＞
「すすむ」を押すと、表示部分が上に隠れて消え、次が表示されます。
という変な動きをしています。
たぶんもっと簡単な処理ができると思うんですが、自力で考えてやるとこんな感じになりました。
＜「もどる」の仕組み＞
こっちは簡単。
クリックしたら、表示部分の前の部分がスライドして現れるだけです。
けど、ちょっと苦戦して勉強するところがあるのもまたよいです。
htmlとかCSSとかからすると、jQueryはなんか信じられないくらい大量のことができます！
たぶん、jQueryの元になってるJavaScriptがすごいんでしょうね。
わずかに勉強して改めて、使いこなしているプログラマーのすごさを思い知りました。
で、順調に進んでいたサイト作成の最後で壁になったのが、こいつです。
１つめの、「マウスを合わせたときの動作」は「hover」というものを使っています。
なんか難しいのが出てきましたが、実はこれも入門講座の例をパ、参考にしました。
上で挙げた、「はじめてのjQuery」に出てきた「hover」の使い方の例です。コピー万歳。
でも、いきなり「hover」とか言われても意味が分からん人も多いですよね。
なので、どんな感じで動いているか、「ふーん」とイメージだけ見ておいてください。
ということをやっています。
（なお、パッケージ画像をクリックしたときも同じ移動を使っています）
処理の内容としては、たとえば「ドラクエ１・１話」の項目に飛ぶ場合、
（実際に見えるのは、２のスライドして出てくるところだけ）
が、なぜかここでエラーが。
「ドラクエ１・１話」に飛んだ後、「すすむ」がうまく使えない……。
まるで「次が存在しない」みたいに進まなくなってしまうんです。
ぶっちゃけると、ここは今でも原因が分かりません。
で、理屈が分からないから、思いつく方法を手当たり次第試してみました。
その中で成功したのが、「次が存在しないなら存在させてしまえ」というものです。
何を言っているか分からないと思いますが、大丈夫、俺も分かりません。
いちおう処理としては、
1・「ドラクエ１・１話」の前の部分すべてをスライドさせて消す。
1.5・「ドラクエ１・１話」の後ろの部分すべてをスライドさせて出す。
（実際に見えるのは、２のスライドして出てくるところだけ）
と、１．５を入れたものです。
自分でもなんで成功したのかはよく分かりませんが、きちんと表示はされています。
よく分からないなりにも動いてしまったのは、きっとjQueryのパワーだと勝手に納得しておきます。
（ここはきちんと知識のある人に見せるのが恥ずかしい内容ですね。変なコードですみません）
つまるところもありましたが、以上がjQueryでの処理です。
たまの休日に作成する趣味レベルのサイトとして、自分でもすごく満足です！
jQueryは何がすごいかって、これ、めっちゃ楽しいんですよ。
・プラグインをコピペするだけで見違えるように、サイトが動く。
・ちょっと表現を覚えるだけで、表現にアニメーションが加わる。
・さらに研究すればするほど、いろんなことができるようになる。
今までJavaScriptとか、独学素人なんで、なかなか勉強する気が出ませんでした。
しかも、「関数や引数がどうたらで、まずは足し算をアラート表示」とか、あまりやる気が出ません。
でも、jQueryは勉強の成果がすぐにめっちゃ分かりやすく出ます。
たぶん、自分にとって一番効果が大きかったのは、簡単さよりも便利さよりも、「やる気が出る」ってことでした。
それは「すすむ」の部分。
「最後のページで『すすむ』をクリックすると、始めに戻る」という機能です。
ここは、jQuery独自の機能を使ったわけではありません。
JavaScriptの「if構文」を勉強して作りました。
jQueryもJavaScriptの一種なんで、こういう構文が使えるんですよね。
どんな感じの処理かを説明すると、
という、単純なものです。
単純だけど、初めてのJavaScriptの構文で、自分には大きな一歩です。
今まで進むことができなかった、本当に大きな一歩を、自然と踏み出せていたのです。
届けたいので、もう一度書きます。
今はまだ技術はないけど、魅力あるwebを作る力を身につけたい方、jQueryマジオススメです！
自分も取れる時間は少ないなりに、楽しみながら少しずつ進歩していきたいと思います。
HTMLはわかるけど、サーバーサイドはお遊びでphpを触ったぐらいだったので、会員制でデータをためこむサイト作りに初めて挑戦した。
今回重視したのは、「いかに個人情報をお漏らししないようにして、万が一漏らしても被害を少なくするか」ということ。
世の中、有償サービスでもパスワードを平文で保存してるサービスが意外と多いらしいので、流出した時のリスクを少しでも減らせる対策として書きます。
サーバー：ロケットネットのキャンペーンにでレンタルサーバ年１０００円ポッキリプラン クライアント側の処理：HTML+CSS+jQuery（とプラグインもろもろ） サーバ側の処理：PHP Webサーバー：Apache データベース：MySQL
俺も巻き込まれたところでは、サミータウンがメールアドレスとパスワードセットでお漏らししてお詫びに１ヶ月無料なにそれこわい。
サミータウンだけならまだいいけど、メアドとパスワードを他のサービスで共通化して使ってる情弱なので、
共通化してメアドとパスワードをどこかのサービスが一箇所でも漏らすと、ヤフオクID乗っ取り事件みたいなことになる。
http://internet.watch.impress.co.jp/cda/news/2008/09/26/20967.html
俺だってできれば人様のメールアドレスとパスワードとか預かりたくない。
万が一、肉親のメールドレスを発見してパスワードにrapemeとか入ってたら明日からどういう顔すればいいかわからない。
ググってみてもどこにも情報のってない。うーん困った。ダメもとで「個人情報ってどうやって保存したらいいんだろう。。。」
って、twitterでつぶやいたら、「住所とかは可逆暗号化でいいけど、パスワードはハッシュで不可逆化しないとだめだよ！」
「住所とかは可逆暗号化でいいけど、パスワードはハッシュで不可逆化しないとだめだよ！」
何のことかわからなったので、調べてみると、
・ハッシュ＝ハッシュ値を使った、元のデータに戻せない暗号化方式
うーん。。。よくわからん。。。
電話番号とか住所は、第三者が使用する情報なので、可逆が必要。パスワードは、認証にしか使わないので、
ハッシュ値の結果が一致すれば元のデータがわからなくてもOK、という方式なのでこういった暗号の使い分けをする。
●可逆暗号のイメージ（もとにもどせる） 暗号化キーは開発者が指定する。 090-xxxx-xxxx →（暗号化）→ !'&%($% →（復号化）→ 090-xxxx-xxxx ●ハッシュのイメージ（もとにもどせない） 登録password（DBに保存）→（ハッシュ値抽出）→!"$#'$#=" ログインpassword →（ハッシュ値抽出）→!"$#'$#=" ※二つのハッシュ値が合っていれば、パスワード一致として認証する。
今回はMySQLの関数で実現した。encode関数で暗号化して、decode関数でもとに戻す。
例えばtel_noという項目だけあるテーブルがあるとすると、
//データベースに保存する時 insert into テーブル名 (tel_no) values (encode(tel_no,'暗号化キー')); //データベースから取得する時 select decode(tel_no,'暗号化キー') from テーブル名;
これで、データベース格納時は暗号化（バイナリ化）されて、データベースから取り出してHTML表示する時に復号化はされる。
＜ユーザ登録時＞
$password=（フォームから取得） $hash=hash('sha512',$password) //ユーザ登録時は、ここで生成した$hashをデータベースにぶっこむ。
ユーザ認証時は、入力されたパスワードと、データベースのパスワードが一致するかチェック。
//フォームから入力されたパスワード $input_password=（フォームから取得） $input_hash=hash('sha512',$input_password); //MySQLに保存されたパスワードを取得（略） $db_hash==（データベースから取得） //判定 if($input_hash==$db_hash) echo 'ログインしますよ！'; //ここにログイン処理を書く else die('メアドとパスワードがあってないよ！');
これでもしSQLインジェクションとかでデータが流出しても、ハッシュ暗号のパスワードに関してはまず解析されないはず。。。
可逆暗号のデータもphp側の暗号化キーが盗まれない限りバレない。。。はず。。。
何でもかんでも暗号化するとコードが煩雑になるし、パフォーマンスにも影響でそうなので、
住所データの都道府県とか、漏れても良いような情報は暗号化しませんでした！！
個人情報保護法 2条による定義 「個人情報」とは、生存する個人に関する情報であって、当該情報に含まれる氏名、生年月日その他の記述等により特定の個人を識別することができるもの（他の情報と容易に照合することができ、それにより特定の個人を識別することができることとなるものを含む。）をいう。
これで、もし漏れても、俺、ウンコ漏らして臭いけど、パンツから出てないからいいよね？というレベルにはなった。はず。
万が一漏れても大丈夫！と書いたけど、そもそも漏らすなというお話になる。色々調べた結果、以下の対策をほどこした。
・当初jQuery側でSQL組み立ててPHPに渡してたので、これだと任意のSQLが実行できて漏らし放題なのでやめる。
・GETとかPOSTでDBに渡すパラメータを扱ってる場合、ちゃんとエスケープする。
例えばログイン認証するPHPで、GETメソッドでフォームからデータを取得するような場合、
$id=$_GET['id'] $pwd=$_GET['pwd'] $sql="select * from ユーザーテーブル where uid='$id' and pwd='$pwd'
とかやってると、login.php?id=admin'&pwd=' OR '1'='1とかパラメータを渡されるとあら不思議！
select *from ユーザテーブル where uid='root' and pwd='' or 1=1
で、誰でもログイン出来ちゃう！ので、mysql_real_escape_stringでエスケープしたり、渡されたパラメータが想定した値かどうか（例えば数値かどうか、とか）のチェックをいれたりする。
・保存するデータにタグやJavascriptを埋め込まれないように、保存されたデータを出力する場合はPHP側でhtmlspecialchars関数使ってエスケープするようにする。
こんな感じでお漏らし対策をした。間違いがあったら教えて欲しい。
ちなみに出来上がったサイトはこれ。
これからWordpressを始める方、あるいは始めている方が
Wordpressのプラグインを探す際に便利になるかな、と思いまとめてみました。
(1)基本的なプラグイン
2011年版！絶対にインストールしたいWordPressプラグイン45個｜Vanilla Rock
http://vanilla-rock.com/blog/wordpress/45-absolutely-install-wordpress-plugin/
Wordpressを始めた人が最初に見ておくと、何かと便利かと思います。
WordPressでブログを作ったら入れるべき27個のプラグイン｜AUTHORITY SITE
http://www.authority-site.com/2010/04/wordpress/27-wordpress-plugin.html
記事内やサイドバー内で、PHPを扱うことができるものなどの紹介。
使用中のおすすめWordPressプラグイン15個 | Webクリエイターボックス
http://www.webcreatorbox.com/tech/recommended-wordpress-plugin/
フォーム用キャプチャのプラグインReally Simple CAPTCHAや、
管理画面に行かなくてもタイトルや本文、カテゴリー名などを編集できるFront-end Editorなどの紹介。
WordPressプラグイン 必須なものから便利なちょっとしたものまで（Webデザインレシピ）
http://webdesignrecipes.com/my-favorite-wordpress-plugins/
記事中の画像を1枚だけ取得してサムネイル表示してくれるPost Thumb Revisitedや、
携帯電話から記事を投稿できるKtai Entryなどの紹介。
あまり知られていないかもなSEO関連のWordPressプラグイン集:phpspot開発日誌
http://phpspot.org/blog/archives/2011/03/seowordpress_1.html
かなりマニアックなSEOに関するまとめです。検索対策にこだわりたい方向けです。
クライアントに頼まれやすい機能を補えるWordPressプラグインいろいろ-かちびと.net
http://kachibito.net/wordpress/plugins-for-commercial.html
アップロードした画像を一括で記事内に挿入できる、File Galleryや、
管理画面TOPにメモを加えるQuickNotes on WP Dashboardなどの紹介。
特集記事や新着記事を見栄えよくスライドショーしてくれるWordPressプラグインまとめ « Web制作覚え書き
http://webdevtoolsoboegaki.wordpress.com/2010/06/22/%E7%89%B9%E9%9B%86%E8%A8%98%
E4%BA%8B%E3%82%84%E6%96%B0%E7%9D%80%E8%A8%98%E4%BA%8B%E3%82%92%E8%A6%8B%E6%A0%84%
E3%81%88%E3%82%88%E3%81%8F%E3%82%B9%E3%83%A9%E3%82%A4%E3%83%89%E3%82%B7%E3%83%A7%E3%83%BC/
イメージをフェードイン・アウトしてくれるプラグインWordPress Content Slideなどの紹介。
（URLが長いので繋げてアクセスするか、記事名で検索するかしてください）
WordPressでサイトを構築した際に活用したプラグイン5個＋α - id:HolyGrailとid:HoryGrailの区別がつかない日記
http://d.hatena.ne.jp/HolyGrail/20110228/1298889864
会員登録時に必要な項目を追加する、Cimy User Extra Fieldsなどの紹介。
WordPress 3.0対応のとっても便利なプラグイン集｜コリス
http://coliss.com/articles/blog/wordpress/plugin/best-plugins-for-wordpress-3.html
管理画面のメニューに好きなアイテムを追加できるFavorites Menu Manager
や、投稿編集ページにカスタムフィールドのHTMLを挿入できるInsertMeta ShortCodeなどの紹介。
WP Social Bookmarking Light | NINXIT-BLOG
http://www.ninxit.com/blog/2010/06/13/wp-social-bookmarking-light/
はてぶ、Facebook、Twitter他、表示させたいものは各々で選択可
WordPress用Twitterコメントシステムプラグインリリース！– [Mu]ムジログ
http://musilog.net/webdesign/wordpress/twitter-anyware-comment-system.php
RTしてくれたTwitterの呟きがコメント欄に全文表示されるプラグイン “BackType Connect”がとても良い！
[WordPress] [Twitter] [net] | No Second Life
http://www.ttcbn.net/no_second_life/archives/1144
1つ上のと同じような機能です、お好みでどうぞ。
WordPresプラグイン「Twitter tools」のバージョンアップ版のインストールと設定、使い方を日本語で解説！：WordPress｜アマモ場
http://www.amamoba.com/wordpress/twitter-tools2.html
Greasemonkeyが0.9にアップデートされてから？かどうかは分からないけどAutoPagerizeやLDRizeが動かなくて困った。
エラーコンソールを見たらVimperatorプラグインのldrize_cooperation.jsの
GreasemonkeyService = Cc["@greasemonkey.mozdev.org/greasemonkey-service;1"].getService().wrappedJSObject;
this.addAfter(GreasemonkeyService,"evalInSandbox",function(code,codebase,sandbox){
if(sandbox.window.LDRize != undefined && sandbox.window.Minibuffer != undefined){
でエラーになっていた。
greasemonkey.jsをみてみたら
evalInSandbox: function(code, sandbox, script) {
で0.8のgreasemonkey.jsは
evalInSandbox: function(code, codebase, sandbox, script) {
だった。
- this.addAfter(GreasemonkeyService,"evalInSandbox",function(code,codebase,sandbox){ + this.addAfter(GreasemonkeyService,"evalInSandbox",function(code,sandbox,script){
したらAutoPagerizeは動くようになった
LDRizeはこれでもまだ動かない。Vimperatorを無効にしても同じ。
どうやらGreasemonkey 0.8ではMinibufferでのwindowとLDRizeでのwindowが同一のXPCNativeWrapperオブジェクトだったけど0.9では別のオブジェクトになったようだ。だからLDRizeでのwindow.MinibufferもundefinedになるしGM_MinibufferLoadedのイベントリスナーを設定してもwindowが違うから発行されないということみたい
ううむ
追記
0.9.0から0.9.1の間のこの変更が原因ぽい…
https://github.com/greasemonkey/greasemonkey/commit/6a4ffd52c90091714e6f49376ef07e2ce5009f79
それぞれ「これはもっと早い・遅い時期じゃないの？」という指摘はあると思うけど、今回は個人的な主観で振り分けた。はてブや SNS で見かけるあの人や、身近なあの人がどの辺りに属するだろうと考えながら読むと面白いかも。
2011年時点の今書くとこんな感じだけど、それぞれの時期にどのインターネット上のサービスを使っているかというのは着目点ではないと思う。昔は SNS も RSS も、さらに検索なんて無かった時代でも、それが別のものに置き換わるだけで「知識を蓄え段々と発信者になっていく」という流れは大筋でずっと変わっていないのではないかと。逆に言えば、それぞれのフェーズに適したサービスがうまくこのインターネットの流れに溶け込めているんじゃないかと。
インターネットに初めて触れる。
覚書。
Internet Explorer8(64bit版ではない)にてGyaO!、Yahoo!ニュース、DMM等の動画サイトを閲覧するとブラウザがクラッシュする。
Internet Explorer は動作を停止しました
強制終了されるページはMicrosoft Silverlightプラグインを使用したもの。
障害が発生しているアプリケーション名: iexplore.exe、バージョン: 8.0.7600.16700、タイム スタンプ: 0x4cd23213
障害が発生しているモジュール名: getflash.dll、バージョン: 1.0.0.1、タイム スタンプ: 0x4506208e
例外コード: 0xc0000005
障害オフセット: 0x00008c40
障害が発生しているアプリケーションの開始時刻: 0x01cbbb667d383d68
障害が発生しているアプリケーション パス: C:\Program Files (x86)\Internet Explorer\iexplore.exe
FlashGet1.73をインストールしていたのだが、こいつとSilverlightの相性がわるいのか。
2010年の年末から年始にかけて10連休ほどあったので、新しいサイトを作ろうと思い立った。
月に１万円だと、毎日コーヒーを飲んでるだけでなくなってしまうので、コーヒー代くらい稼げたらうれしいなあ。じゃあどうする。何を作る？
ということで、まずTwitterを使ったものを作ることにした。
ひとつのジャンルにしぼってツイートをかき集めれば、面白い流れになるんじゃないか。人が来るんじゃないか。そう思った。togetterみたいな。で、ジャンルは、個人的に興味がある子育て。ていうか毎日帰宅してから朝まで子どもの寝かしつけや夜泣きの対応でサイトを更新する暇も、俺が寝る暇もあんまりない。ので、手がかからないことが大前提。なんだったら自動更新でもいい。
自動更新かー。と思って「ブログ 自動更新」でググったら、wordpressにRSSから更新するプラグインがあるらしいことを知った。はい決定。その瞬間、「TwitterのAPIからRSSを引っ張ってwordpressに投稿するサイト」に決まった。
さくらインターネットのスタンダードを申し込んだ。１４日お試しがあるらしいけど、仮申し込みの時点で住所も入れてコンビニ請求にしたら、数日後に請求書が送られてきてビビった。（同時にドメインも申請しちゃった）
まあ、webで申し込んで、すぐにサーバコントロールパネルという画面に入れるようになった。「クイックインストール」というリンクがあったので見てみたらMovableTypeとWordPressを自動でインストールしてくれるらしかったので、ボタンを押した。インストールできましたというので発行されたURLをクリックしたけど404だった。１時間くらい404で、その日はもう寝た。
次の日の夜。これはもう、１０連休を利用して毎晩1時間ずつ捻出するしかない、さくらのお試し１４日あるから約14時間で作りきるしかねえ、と思った。
サイトにアクセスしたらwordpressが入ったページが出てきた。おお、サイトができてる！
まずTwitterを調べるか、と思って、「Twitter API」で検索したけどOauth？とかいう面倒なことをしないといけないらしかったのでやめた。じゃあ普通に検索は？と思って「Twitter 検索」で検索したら、search.twitter.comの結果はjsonかatomで取得できるし、APIコール制限もないらしいのでこれに決定。検索だけで１時間たった。
夜も更けて、続けて作業した。「wordpress xml 投稿」で検索していくつか探したらFeedWordpressというプラグインがあったので入れた。あ、事前知識としてMovableTypeでのブログはやったことがあったので、プラグインを入れるみたいな話はスムーズに進められた。
で、twitterの検索結果をatomで返した結果を入れてみた。ら、本当に投稿されてた。よっしゃできた、と思った。１ツイートが１エントリになってたし、投稿者もツイートした人になってた。よかった。でも、満足できなかった。
次の日。同じことを自力でやる方法を探した。「wordpress xml 投稿」で検索して、XMLをパースできるようになればいいんじゃないかと思い、simplepieというPHPライブラリにたどり着いた。が、PHPなんてまったく知らないし、憶える気もなかった。actionscriptで書かせてよ、とずっと思ってた。
次の日。「wordpress xml 投稿」でまた検索。どうやらwordpressの投稿って、xmlrpcというやり方を使ってるらしかった。ので、「wordpress xmlrpc 自動投稿」で検索したら、なんかサンプルコードが載ってたのでそのまんまコピペ（結局PHPだった）。したらちゃんと投稿されていた。ふむ。ここで何を思いついたのか、「wordpress xml パース」と昨日みたいなことを検索した。simpleXML？というライブラリがあるらしかったので、それを試してみることにした。（たぶんPHPが動いたので気をよくしてたんだと思う）
こういう流れでいけると思った。考え方はactionscriptをエディタに書いて、ノリであてにいった。変数に宣言するのはできた。＄var1とかで宣言したことになるらしい。URLRequestに相当するコードを探したら「file_get_contents」らしいことが分かった。（「PHP 外部ファイル」で検索）
で、ゲットしたのはXMLなんだけど、上記検索したなかにたまたま書いてあった「simplexml_load_string」というのを使うとXMLをパースできそうな気がしたので、ノリで書いたactionscriptでは
var req:String = "http://search.twitter.com/?q.atom=mogemoge";
var r:URLRequest = new URLRequest(req);
var kekka:XML = r.send() as XML; ←いまここ
なので、XMLにキャストしたんだろうなみたいな感じだった。E4Xを使えればいいのにPHPって馬鹿ねと思いながら寝た。
年があけて、３が日が終わりそうだった。年末にやってたこと（上記までのこと）を思い出しながら、XMLの必要な部分だけ抜き出す方法を模索した。atomっていってもentryがたくさん入ってたから配列にするんだろうけど、ってんで「php foreach」を検索。なんとなくサンプルコードをまねしながら、記事タイトル、記事本文だけ取得した。あとはxmlrpcのサンプルにあわせて投稿するようにした。できた。寝た。
次の日の朝、ブログを見た。昨日更新したものしかあがってない。自動じゃねーじゃん。
で、「自動 投稿」で検索したら、クローン(cron)という仕組みを使わないといけないのだった。クローンはサーバの仕組みらしく、そういえば俺はPHPをはじめDB、サーバという単語を極力さけて仕事してきたので、もう気持ちが悪くなってきた。「さくらインターネット cron php」で検索して、なんとかやり方を見つけて、cronを登録した。(1時間に１回にした。設定は * * * 0)
仕事から帰ってきて、サイトを見ると、投稿が大量にたまっていた。やった！で、調子に乗ってツイッターアカウントを作った。なんだったらツイッターも自動化したかったので「twitter bot」で検索した。Easybotterというサンプルボットがあったので使わせてもらった。自動で一行ずつつぶやくようにした。
ツイートを集めることは成功したけど（毎時間１００件のツイートを１エントリとして投稿してる）、それを眺めて面白いんだろうか？ ボットを動かしてるけど人がくるんだろうか？
そんなとき「trivist」がはてブに載ってた。なんかにたものを感じた。やっぱツイートを引っ張ってきて投稿するサイトはアリなのか？アリなはずだ！
サイトの体裁を整えた
trivistをまねて、記事を評価（はてなスターとかいいねボタンとかに近いもの）する仕組みが欲しくなった。「wordpress 評価 プラグイン」で「wp-postratings」というプラグインを発見して、入れてみた。どうやら１エントリーに１評価しかできないらしい。俺のサイトは１エントリーに１００ツイートあるから、どのツイートを評価するのかが分からない。
いったん、wordpressの全投稿を削除した。で、cron に登録されてるPHPを、１記事に１エントリーにした。
エントリーを投稿するついでに、Yahoo日本語解析APIをつかってツイートを分析して、名詞と動詞だけを取り出そうと思った。それをタグにすれば、タグクラウドが作れると思った。はてブはずっとずっと昔からやってるから、Yahoo日本語解析っていうのが2006年くらいに流行ったことをなぜか憶えてたので、やってみた。できた。
なんか俺、PHP書くのが早くなってね？
アクセス解析を入れてみた。サイトに来てる人は、俺だけだった。
どうにかして人を増やしたい。サイトの広告募集はする気がないし、ベタベタとバナーを貼りたくなかった。みんなが気軽に見に来て、軽い気持ちで評価してくれて、更新を楽しみにしてくれるサイトにしたかった。コミュニティサイトじゃないけど、やっぱりサイトはコミュニケーション設計をしないと意味がないんじゃないか、見てくれるユーザはどうやったら楽しいんだろう、ということを考え続けて１０日ほど経った。Twitter経由で来てくれた人が３人ほどいるようだけど、何がダメなのか分からないので増田にお願い。
ここまで書いて教えてくんじゃねーか、と思われるかもしれないが、ググレカス的な検索は上記で書いたみたいにいろいろやってきた。でも、サイトを作ってみてはじめて、ユーザに向けたサイトってどう作ればいいのかが分からないということに気づいた。
小遣い稼ぎもしたいんだけど、面白いサイトを作るヒントがほしいと思った。
kanzen21やtrivistみたいに、俺も過程を全部さらしたから、辛辣な意見を求む。そしてはてブされるのを待ってます。
なのに、なぜかいちいちプロジェクトが火を噴いたりする。その原因を考えてたんだけども。
欧米では、まず「技術」があり、「さあこれらの技術を組み合わせて、どんなサービスを展開しよう？」と考える。
日本では、まず「こんなサービスがいい、画面はこんなデザインがいい」という具体的・絶対的な要求があり、技術屋がそれに応える──プロジェクト開始直後に想定していた部品でどうにもならない問題は、自力でなんとかする必要がある。たとえば PHP や Smarty や jQuery やそのプラグインなどは、肝心なところで何も手助けしてくれない（・・ばかりか、我々の努力を邪魔する事もある。例えばもうメンテされていない「thickbox.js」は、いや、もういいや以下略）
・・とかって妄想してみた。
もちろん欧米のプロジェクトの全部がそうってわけでも、日本のプロジェクトの全部がそうってわけでも無いんだろうけど、割合としてはどんなもんだろうね？
そりゃあ、やろうと思えば様々な手法があるだろうけど…
いかに余計な作業を減らして「やりたいことを実現」するための作業に専念するか、を考えている。
いろんな言語への興味はあるが、むしろそのせいで今まで時間食いまくってるので、そろそろ「手早く作る方法」を知りたい。
あんまり色々な手法を試してもいられない。
「これ！」ってやり方を決めたい。
プログラミング言語は、C C++ Java Python Perl VB C# HSP PHP JavaScriptなど、どれも基礎を触ったりしてばかりで何年も過ごしてきた。
FLASHは持ってない。(PalaFlaは触ったことあるけど、いまいちイメージしにくかった)
なんだかんだで一番慣れてるのがHTML+CSSで、次点でPHPかJavaScript。
ただ、PHPだのjavaScriptだのSQLだの、複数言語を同時に扱ってると非常に面倒。
そこでサーバーサイドJavaScriptに目をつけたものの、『Jaxer』は2008年に書かれた記事がちょっとあるばかりだし…
Node.jsってどうなんだろう…？
うーん、あまり纏まってないが、とりあえず現状をダンプしておく。
なんか参考になるものがあればなー。
こういうこと色々聞ける相手も周りにいないし…
自分でWEBサービスを作りたいと思っている人へ ( http://anond.hatelabo.jp/20101203150748 ) を読んで、初心者じゃなくてある程度の経験者が作ったらこうなるんだよってことで書いています。でも正直4ヶ月でそこまでできるようになるなんておそらく相当頭がいいんじゃないかなと思うんです。いや、本当に凄いと思う。
まず作ったサービスはグルーポンチケットのまとめサイト。 グルーポンナビ( http://gp-navi.net/ )まず自分のスペックだけど、昔から趣味でプログラムやったり仕事でプログラムしたりしてました。Web系ばっかりやってるいちおうこういうのを作るのには慣れてる方です。
それで私ですが、まず最初に http://anond.hatelabo.jp/20101203150748 の人と同じで全然お金を使いたくなかったです。だからいろんなホスティング会社を探したりしたんですが、VPSを借りちゃうと大金がかかるんですよね。そこで、いわゆる流行のクラウドであるHeroku( http://heroku.com/ )を使う事にしました。
このHerokuは無料で使えるから良いんですけど、バッチ処理を行うには有料のサーバを契約しなくちゃいけないんです。しかもWebの一回のリクエストは30秒までに押さえなくちゃいけないっていう制限があったりで、正直無料で使うには厳しい。
でもやっぱり無料っていう響きに吸い寄せられてHerokuを使うと決めてアプリケーションを書き始めました。Railsで書いて賞味2週間くらいちまちまと進めてアプリを完成させました。だいたい一日2時間くらいかな。Railsにはそこまで詳しくはなかったけど、Webで検索すれば結構情報がヒットするからそこまでの苦労は無かったです。それよりも制限のあるHerokuでどうやって実現するかというのが、結構問題でした。
それでしばらく運用してました。このときは全然宣伝しませんでしたから、ほとんどページビューはあがらなかったです。宣伝大事。これほんと。それでHerokuで作った仕組みなんですが、無料でやりたかったので、Workersを契約しないでアプリをつくってました。だからWebのリクエストをトリガーとして普通にクロールさせるよう作ったんです。でも、クロールするサイトを徐々に増やしていくと30秒以内にリクエストが終了しなくなってきてさぁ問題。どうしようかと考えたあげく、レンタルサーバもいいなっておもったけど、結局自宅サーバをたてることにしました。たぶん、これが一番コストパフォーマンスが良い。でも気をつけなくちゃ行けないのが、サーバ自体の管理を自分でやらなくちゃいけないから結構めんどくさいんですよね。結局自宅サーバかよって感じです。
サーバをNTT-X Storeで発注して発注して、16,800円。かなり安いです。このサーバの詳細は http://wiki.nothing.sh/page/NEC%20Express5800%A1%BFGT110b に書かれています。なんでこのマシンにしたのかというと、VMWareのESXiで仮想化をしたくて、それに対応している安いサーバがこれだったというわけ。ちなみに、これをすると管理が楽になる。例えば、マシンのバックアップが取りたいなと思ってもすぐできるんですね。だから仮想化は凄く良い。
でも、素のGT110bを使うとメモリも少ないしCPUも弱いしハードディスクも少ないので、これはネットで買い足しました。あ、あとデスクトップ用のモニタが無かったのでそれも中古で買いました。それが次のような感じ。
ずいぶんと安い買い物だったと思います。もちろん、マシンの上で動かしているOSはLinuxなので、ライセンス料もかからないしとてもリーズナブルです。
ここまできたら後はアプリを作り直すだけでした。Herokuで作ってたときにはHerokuの制限を考えながらアプリを作ってたので作りづらかったですが、自宅サーバを使うとそういった制限はなくなるのですごく作りやすい。お金を払うだけの価値はあると思います。やっぱりお金をかけるべきところはかけないとダメですね。
それから結構このアプリケーションは携帯ユーザの女の子がよく使ってくれます。結構教えると毎日見てくれるんですよ。やっぱりお買い物と言えば女の子ですね。だから、携帯対応しました。携帯はいままでやった事は無かったんだけど、Railsのプラグインであるjpmobile( https://github.com/darashi/jpmobile )を使ったところすごく簡単に対応する事ができた。凄いですね。id:darashiさんに感謝です。
iPhoneも対応していますが、こちらもあまり詳しくなかったので最初はjQuery mobileを使って構築しました。でもちょっと重かったのでjQuery mobileはやめて手組しています。そもそも一ページしか無いのでそんない難しい事は無いですね。
ウェブサービス公開するのはそこまで難しくないんですが、それを流行らせるのはかなり難しいですね。面白いサービスとかであれば結構色んなところがとりあげてくれたりするんですけど、後発のサービスになるとなかなか。。。開発者の方は作る事よりもどうやってみんなに知ってもらうかを考えるのがすごく大変な事だと思います。お金かけて広告うてれば楽なんですけどね。
とにかく作ったら公開。やる事は各方面への宣伝です。今のところやってるのはTwitterへの投稿と、ここへの投稿ですかね。これからいろいろ試そうとしているところ。このサービスがある程度知名度が上がってきたらまたそのとき軌跡を書きたいと思います。
完全に一致を作るための勉強法
コメントもたくさん頂いてまして、それにお答えするのに「ブログでもつくろうかいな」とのぼせましたが、そんなテーマで続くわけもないので、やはりアノニマスダイアリーにしました。
【製作期間について】
まず、皆さん仕事しながらたった4ヶ月で！と褒めて頂いてますが、たったじゃないですよ。4ヶ月って。
仕事が終わって、毎日2～3時間。土日関係無くやると、多分300時間くらいになります。
専門学校の2年間の授業時間がこのくらいだったりするんじゃないですかね。結構長いです。
【モチベーションの維持について】
モチベーションを保つのがすごいというのも褒めてもらいましたが、私は一回やり始めると、意外に長く続きます。
コツがあるんです。
毎年、日々の単純作業が続かない新入社員が入ってきますが、そんな新人に言います。
「息をするように続けるんだよ。」
毎日やるんです。土日関係無く。毎日。
前回の日記で「勉強した」と何度も使ってしまった為、誤解をされている方が多くいらっしゃいます。
正確には、「調べ」ました。
職業柄「調べる」という事が多い為、WEBサービスを作るという事に関してはそれが訳に立ちました。
追記でも書いているのですが今回のシステムはほとんどが、先人達が作った既存のシステムがベースになっています。
ぱくりと言われてしまえばそれまでなんですけど、丸ごとはやってないですよ。というか、丸ごと合うモノがなくて、いろんな所からソースコードを拝借させてもらいました。
なので、中身はぐちゃぐちゃです。けど、検索システムはそれでも200行くらいしかありません。クローラーは80行くらいでしょうか。
【HTMLについて】
というか、それすら途中で挫折してAdobe社のDreamWeaverというソフトを使いました。
適当に書けばソースは綺麗にしてくれるし、CSSの体裁はプロパティを設定しながら見た目のまま調整すれば良いし、一番助かったのはテンプレート機能でした。
最初は全部のHTMLファイルをコピーしながら作っていたのですが、ヘルプを見るとテンプレートとライブラリという機能があるのをしってライブラリがいまいち分らなかったのでテンプレートを使いました。
■Dreamweaver便利
■テンプレート便利
【Javascriptとの出会い】
最初に本やで立ち読みした本に、「プログラムをやってみよう」ということでJavascriptの事が書いてありました。
なので、自然とプログラムの最初のさわりがコレになっただけなんですね。
でも、アラートを出したりとかばっかりで、面白くありませんでした。
インターネット黎明期からのネットユーザーなのですが、「最近よく見るページが移動しないのにページの中身が切り替わるやつかっこいいよな」と思って「ページ遷移しない 読み込み」で検索をすると、Ajaxという文字を見つけ、「ajax 入門」で検索してトップに出たサイトでAjaxの概要だけ調べて、「ajax 簡単」でprototype.jsとjQueryの文字を見つけて「ああ、jQueryってよく見るな」というのがjQueryとの出会いでした。
「最近よく見るページが移動しないのにページの中身が切り替わるやつ」は、非同期通信という名前でした。
jQueryを使うと、下記のように1行コピペするだけで外部のHTMLを読み込む事ができました。
--------------------------------------------------------------------------
var http = $.get("abc.html",null, function(data) {$("#main").html(data);});
--------------------------------------------------------------------------
すごい簡単。最初は意味は分りませんでしたが、目的の事ができればそれで良いので次に進みました。
■jQueryすごい
■非同期通信かっこいい
【Perlとの出会い】
jQueryがちょこっと書くとダイナミックに色々変わってくれるので、日々いろんなプラグインを探して遊んでいました。
でも、作りたかったのは検索システムだったのを思い出し、また近くの大きな本屋に。
検索するパソコンで”プログラム 検索”で探しだした棚に行くと、「CGI/Perl」の本棚でした。
大量にありすぎてどれをかって良いか分らなかったので、いくつか立ち読みして家に帰り、「CGI/Perl 入門」で検索すると
このページにたどり着きました。
Windowsだった為、ActivePerlを入れていくつかプログラムをやりましたが、これがまた面白くないんですね。
すごい地味で。このPerlをさわった最初の1日は正直かなり苦痛でした。
その後、”AV女優の検索システムって不動産の検索システムに似てるな”って思って「CGI/Perl 不動産検索 無料」で検索したら、http://www.yumemaboroshi.net/ってサイトが引っかかって、ここのおかげでかなり進みました。
先人が作った大量のプログラムがダウンロード出来るサイトなんですね。
【PHPとの出会い】
いくつもダウンロードしては、サンプルと中身を見てを繰り返してたら、Perl/CGI以外にPHPがたくさんありました。
どう違うのかと思い検索したら、PHPはすごい叩かれてて、Perlがえらいみたいに書いてあったのですが、叩かれてる理由がいまいち理解できませんでした。
結果PHPを使う事になったのですが、その大きな理由は、DreamweaverでPHPが開ける。なおかつHTMLファイルをそのまま使うテンプレート機能のプラグインがあったという事でした。
PHPでテンプレートを使うには、Smartyというプラグインを使えば良いということが分って、「Smarty 入門」で調べて、いくつかのタグを覚えました。
実際にSmartyで使ったタグは、{$変数}と{if}{/if}と{foreach}{/foreach}の3つだけだと思います。
色々高機能らしいのですが、まあ目的は達成できたのでいいか。と。
PHPの検索プログラムは、HTMLファイルでボタンを押すと、テキストファイルに書いてある内容を、表示してくれる簡単なものを作って、そこに肉付けしました。
（最終的にテキストファイルがSQLサーバーになりましたが。）
■PHPはDreamweaverと相性がいい
■Smartyでやると見た目が壊れない
【Rubyとの出会い】
簡単にPHPで動くプログラムが出来たので、実際に女優のデータを登録しようと思い、DMMに行きました。
DMMのサイトを見ていると、いったい何人いるんだってくらいAV女優が登録されています。
数人集めてみて「こりゃぁ。無理だな。」と途方にくれて1日を過ごしました（笑）
次の日、「ホームページ 自動 巡回 プログラム」とかで検索して、ボットとクローラーという存在を知りました。
自動巡回で拾ってくるのは、どちらかというとクローラーと呼ばれるそうで、「クローラー 作り方」で調べたホームページに、Perl+LWPモジュールで似たことができるということで、とりあえずペタペタとソースを貼ってうごかしてみたら、まあなんと簡単に取れました。
しかし、取ってきた後に気がついたのが、HTMLファイルをそのまま取ってきても結局手動でコピペの必要があり、あんまり意味がない。と。
で、もう少し調べると、「WWW::Mechanize」を使うといいよって書いてあって、Mechanizeで調べたサイトをみるとrubyを使ったサイトが出てきました。
rubyのサンプルがすっごい短くてわかりやすかったので、Perlは苦痛だったのでRubyにしようと、このときRubyを始めました。
■Rubyきれい
■Mechanize簡単
【デザインは・・・】
はてなブックマークのコメントで、DoCoMoのサイトが元ネタと書いてありましたが、ハズレです。
デザイナーの友人が居て世間話でどうやって作るの？って聞いたら、「まあ、パｋ、じゃない。参考にするよ。他社のを。」っていうもんでどうやって見つけるか聞いたら、あるんですね、綺麗なデザイン集めたサイトが。http://www.ikesai.com/ここでたくさん見ました。
それから、スライダーのインターフェースは、「selectToUISlider」jQueryのプラグインそのまま使ってます。
■世の中のデザイン全てぱｋ（略
■selectToUISliderかっこいい
という感じで、ほんとにちょっとずつ進みました。
楽しかったですね。Perl以外は。なんであんなに読みづらいんでしょう。
と、またもや長くなりすぎたのでこの辺で。
DMMのクリックが10万クリックほどあり、その結果、購入された金額が、なんと！
報酬額が245円。
----------------------
今回のサーバーダウンは結構深刻でなかなか復旧が出来ていません。。。
申し訳ないです。
----------------------
http://twitter.com/#!/kanzen21_com
----------------------
[概要]検索と保存性の問題で､PDFで保存､読む時にJPGに分離して読む｡
→理由:JPGでは内部検索が出来ない｡Leeyesの機能でガンマを変えて読めるため､PDF保存は､ややこしい事をせずに､ほぼデフォルトで行うことができる｡
────────────────────────────────────────────
☆蔵書記録作業
●[ISBN_BarCodeReader]
URL:http://mhsodai.kazelog.jp/chalog/2009/11/webusb-96dd.html
とWEBカメラ UCAM-DLU130H を使って､書籍のバーコードを読み取りISBN番号を書き出しておく｡
●[メディアマーカー]
にまとめて登録(登録 →一括登録)
●メディアマーカーの蔵書リストページをPDFでプリントし､PDF化しておく｡(別にHTMLでもテキストでもいいけど)
────────────────────────────────────────────
☆スキャン作業
●本の解体
･表紙表裏･帯･見返しとカッターで切る｡
URL:http://search.rakuten.co.jp/search/mall/%E5%A4%A7%E5%9E%8B%E3%83%9A%E3%83%BC%E3%83%91%E3%83%BC%E3%82%AB%E3%83%83%E3%82%BF%E3%83%BC/-/
で本をバラバラにする
設定:
#アプリ選択 タブ
･ScanSnapOrganizer 選択
#保存 タブ
･ファイル名の設定 →yyyyMMddHHmmss
#読み取りモード タブ
･読み取り面の選択 →両面読み取り
#ファイル形式 タブ
→他すべてデフォルト(OFF)
#原稿 タブ
･圧縮率1
→カラーページと白黒ページで設定を変えるなどは手間がかかるので､全部カラーでスキャンする｡
●スキャン時に、紙詰まりを少なくする方法。
→S1500に紙を装填前に、中指の長さ程度、差し込む側の紙の中央を縦に山折りにする。こうすることで、紙詰まりが1/5程度に激減する。
────────────────────────────────────────────
☆データ保存
●ページを整える
ScanSnap Organizerで､編集したいファイルをダブルクリックすると､ScanSnap Organizer ビューアーが立ち上がる｡
･いらないページを削除(ただし､偶数･奇数を守らないと､見開きで読みづらくなる)
･傾いてしまったぺージを修正
ScanSnap Organizer上のファイルを右クリック →開く､で､Adobe Acrobatで開く｡
→文書 →OCRテキスト認識 →OCRを使用してテキスト認識
→すべてのページ
･日本語
→HDDに余裕がない場合は、検索可能な画像/最低(600dpi)に。ただし、その場合は[画像梱包]で画像を分離できなくなるので注意!
つまり、Acrobat以外で読めなくなる。
･ →OK
理由:
-[探三郎]
URL:http://www.geocities.jp/koutarou_y1926/sin3rou.html
●メディアマーカーの蔵書リストををPDF化したファイルを開き､ScanSnapOrganizer上でタイトルを変更する｡
●Acrobatで開き､左右綴じ(左右開き)をチェックする｡縦書きなら右綴じに変更する｡
────────────────────────────────────────────
☆閲覧
●PDFそのまま閲覧可能(文字が大きい)なものは､Acrobatでそのまま読む(WXGAで見開き)
→まず、
で、「液晶画面用」に変更しておく。要するにアンチエイリアシングのことで、これをやっておかないと、とても読めたものではない。
Acrobatの画質を上げる。
｢2Dグラフィックすアクセラレーションを使用｣をOFF、それ以外全部ON。
●ほとんどのコミックと書籍は､jpgファイルになおしたほうがずっと読みやすい｡
→理由は､Acrobatの絵の拡縮アルゴリズムよりも､Leeyesのほうが高画質の設定だから｡
URL:http://www.vector.co.jp/soft/win95/writing/se377893.html
･｢開梱｣設定
-Origin優先 にチェック →よくわからないが一応
-BASE 0､ STEP 1
-Colmun 3
-jpgのチェックを外す(チェックが入っていると､再度エンコードをするので画質が落ちる)
→だが､起動ごとにいちいち設定しなおすのは面倒なので､以下の文章をメモ帳にコピーし､
｢pic2pdf.ini｣という名前で｢C:\Program Files\pic2pdf｣のフォルダ内に入れると､設定が保存される｡
#-------------ここから
[SaveOptions]
UseingSaveFile=1
ConvertBmpToFax=0
ConvertBmpToJpeg=0
JpegCompressPer=85
MetaLoading=1
DisplayView=1
JepgImplant=1
NoOriginalName=0
WindowTitle=1
UseingDPI=0
OriginalDPIValue=100
UseingPaper=0
OriginalPaperValue=7
DobulePageRight=0
Centering=0
FixedPageSize=0
ShowOutThumbs=0
PortLandAngle=0
ViewFactor=2
PageType=0
ViewMenuBar=1
ViewToolBar=1
ViewWinowUI=1
NoProducer=0
NoTimeStamp=0
[PDFCrypt]
PrintPrivileges=0
CopyPrivileges=0
ModifyPrivileges=0
AnnotePrivileges=0
CryptStrength=0
[TakeoutOptions]
UseingSubDirectory=1
ReFileName=0
UseingOriginalName=1
NumericColmun=3
BaseNumber=0
StepNumber=1
OutputStyleBMP=1
OutputStyleFAX=0
#-------------ここまで
[Leeyes]
URL:http://mitc.xrea.jp/diary/020
で読む｡(ドラッグ&ドロップ)
･イメージ→綴じ方向 で､綴じ方向を合わせる(横組みは左綴じ､縦組みは右綴じ)
･なぜか[画像梱包]で画像を抽出すると､ファイル名が逆順になるので､
表示→並び順→降順 にして昇順から降順に変える｡(ファイル一覧の｢名前｣をクリックし､▽を△にしてもOK)
にだけチェックを入れ､
設定は
出力レベル:0-255
とする｡
･オプション→設定の保存
で､設定ファイルを保存する｡
色々教えてください偉い人。
自分で考えろってのはご尤もですが、色々な方の意見が聞いてみたいのです。
・Struts（ver2じゃないほう）上でのJava（max2000行程度）
・perl（max7000行程度）
・c/c++（ちょっと）
・Haskell（ほんの少し）
・VisualBasic（.NETじゃないほう）（ほとんど忘れた）
・HTML/CSS（セマンティック厨）（HTML5は勉強中）（バイトでWEBデザイン経験有）
・javascript（簡単なものなら）
・MovableType（CMSとして利用。ちょっとした企業サイトレベルくらいのものの構築。簡単なプラグインの作成とかも）
・Apache（セットアップと最低限の設定くらい）
・Tomcat（同上）
・Linux（CentOSとUbuntu。セットアップとちょっとした設定程度）
・AdobeのDTP系製品（CS2）（雑誌編集経験有、ただし学生レベル）
・Oracle（10g）（Bronzeレベルの知識とちょっと触ったことがある程度の経験）
・postgreSQL（ちょっと触ったことがある程度）
・会計関連の知識（日商簿記2級）（大学で管理会計をかじった）
・数学系の知識（論理とか集合やらの基礎。大学で計算機科学をかじった）
・印刷物/WEBサイトのデザイン（独学だけどそれなりに。一般人よりはそれっぽいデザインが作れるかと）
人との関わりを避け、ネットの文章を漫然と眺めるだけの日々。
気がついたら、もともと不得意だった日常会話が更にできなくなっていた。
パソコン以外で文章を読むのは久しぶり。
前頭葉機能とか、ワーキングメモリとか。そんなものが低下しているらしい。
ひとり用神経衰弱(http://homepage3.nifty.com/puzzlehouse/kg30/kg30.html Javaプラグイン必要)をプレイしてみた。
デフォルトの14枚だと全くうまくいかない。8枚くらいが限界だ。
何度も何度もプレイするうちに、大体同じ回数でゲームが終了することに気づく。
そこで考えたこと。
どれだけカードの枚数が増えようと、1度でもめくったカードの数字と場所の組み合わせを決して忘れない。
そんな人が、一人神経衰弱で最悪でもこれだけのターン数あれば1回のゲームを確実に終わらせることができる、
そういうターン数を「最悪ターン数」と呼ぶことにしよう。これを割り出したい。
簡単のため、互いに相異なるn種類の数字が書かれたカード2枚ずつ、
このときの最悪ターン数をF(n)とする(ただしn≧2)。
n≦2kとなる最小のkについて、
kターン目まで一度たりともカードを取り除くことに成功できなかった場合について考える。
このとき、(k+1)ターン目以降では取り除くことに失敗することはありえない。
kターン目までに引かなかったカードを1枚引けば、
このカードと同じ数が書かれたカードをkターン目までに1回引いており、
その位置と場所をプレイヤーは記憶しているのだから、間違えずにそれを引けばよい。
よって連続で外れ続けるターン数は最も不運な場合でもk(=int((n+1)/2))ターンであり、
その後はnターンでゲームを終了させることが出来る。
このときの合計ターン数はint((n+1)/2)+nだ。
F(n)はint((n+1)/2)+nに一致する。
そのことを数学的帰納法により示す。
F(2)=3であり、これはint((2+1)/2)+2に一致する。
F(n-1)=int(n/2)+(n-1)となる任意の3以上のnについてF(n)=int((n+1)/2)+nになることを示す。
そのためには以下の二通りの場合について考えれば必要十分だ。
1≦i≦int((n+1)/2)なるiが存在してiターン目に同じ種類の2枚のカードを引く場合、
この条件下での最悪ターン数はF(n-1)+1に一致する。
iターン目に引いたカードを除いた2(n-1)枚のカードについて
最悪ターン数となるようなカードの引き方を考え、
そのどこかにまぐれ当たりのiターン目を挿入したものが
(a)のときの最悪ターン数となるようなカードの引き方に一致するからだ。
int((n+1)/2)回までに一回も成功しない場合、
この条件下での最悪ターン数は先に述べた通りint((n+1)/2)+nに一致する。
F(n)はF(n-1)+1(=int(n/2)+n)とint((n+1)/2)+nのうち小さくない方、つまりint((n+1)/2)+nに一致する。
F(n)=int((n+1)/2)+nが任意の2以上の自然数nについて成立する。
間違いもあるかもしれないし、詳細はググっていただくとして。
まずはFXの作りの話になるんだけど、あれのUIとかはXULって言う、javascriptやCSS, XMLなんかをベースにした言語で書かれている。
で、拡張機能はこのXULで作る。つまり、元々のUIとかを形作っているXUL群に追加でインストールするXULが拡張機能。
対してプラグインはnetscapeの時代から続く、DLLを使う方式。
拡張機能はスクリプト言語ベースで、しかもwebで使ってるものの流用だから、入りやすく作りやすい。メモ帳あれば作れる的。
プラグインはコンパイラとか必要だし、色々敷居が高いが、その分速度面も出来ることも上。