  |
はてなキーワード: リリースしましたとは
はてなNG - Chrome ウェブストア
https://chrome.google.com/webstore/detail/%E3%81%AF%E3%81%A6%E3%81%AAng/mbgdnfmdelffjdhkdggilmphfdihnmcj
はてなブックマーク内ページ（http://b.hatena.ne.jp/）
はてなの閲覧がめちゃくちゃ快適になりました！
目障りなサイトやアカウントは見なくて済むし、ブコメページのノイジーなコメントも連打スターもなくなってスッキリ！
更にワンクリックで気楽にNGフィルターオンとオフの切り替えが出来るようにした事で、NGありなしの状態が一目瞭然で比較できて、はてなのエントリーの傾向、ブックマーカーの傾向もよく分かるという新しい発見も！追)そして自分がどんなに偏ってるかの発見も！
ホットエントリーに上がってくる、まとめ系、はてな村系、虚構系なんかは個人的にどうにも苦手で、それについて以前増田で書いたら多くのご批判、ご意見を頂きました。
人気コメントが「無いなら自分で作れば」って感じで、成る程、ほんじゃまぁやってみるかと。一度Chromeの拡張機能を作ってもみたかったので。
で、NGリストを登録してはてなの公式ページをフィルタリングする方向で作ろうと決めました。あと、どうにも気になっていたのがkiya氏系のスター連打。この対策も機能に盛り込もうと。構想が固まって、勉強がてらある程度の試作を作ってみました。したらなかなか良い出来なんじゃないかと、手前味噌だけど自分だけで使ってるのは勿体無い、面白いから皆さん使ってみて下さいよーって事で、この連休でChromeウェブストア公開用に一気に作り込みました。
ざっくりと。
Chrome拡張機能はHTMLとJavaScriptで制作できます。
それらをマニフェストファイル（manifest.json）というJSON形式の設定ファイルで、タイトル、説明、権限やアイコンなどと共に紐付けして設定します。
これらが入ったフォルダをChromeの拡張機能ページから読み込ませれば動作します。
Googleに$5払ってデベロッパー登録し、バナー等必要データを用意すればChromeウェブストアで一般公開もできます。
拡張機能のスクリプトが動作する環境は大きく分けて4つで、マニフェストファイルで設定できます。
このマニフェストにはバージョンがあって、現在使用できるのは2.0のみになっています。Chrome拡張機能の製作方法はググれば先人達の情報が沢山出てきますが、このバージョンが古い情報もありますので注意しないとハマってしまいます。
参考にしたサイトは様々ですが、検索で出てきた日本語サイトでざっくりと把握させていただき最終的には公式サイトが一番確実でした。
http://dev.screw-axis.com/doc/chrome_extensions/（マニフェストのバージョンは1.0が対象のようです）
http://qiita.com/sqrtxx/items/19fd2114430e9e1fb57f
http://blog.fenrir-inc.com/jp/2012/09/jquery-chrome-extension.html
https://developer.chrome.com/extensions
https://developer.chrome.com/extensions/api_index
Chrome拡張機能開発は思ったよりは簡単でした。JavaScriptが出来る人は一度試してみると楽しいかもしれません。と、同時にインストールする拡張機能によってブラウザが重たくなる理由もわかりました。ブラクラになる程重い処理を裏でぶん回す事も簡単に出来てしまうので、なるほどなーと。
そんな感じで開発したのですが、機能ははてな様の現在のページデザインに依存しております。ですので、はてなのサイトデザインが改変した際には動作しなくなったりレイアウト崩れしてしまう場合があります。ご了承くださいませ。その他バグなどご報告下さいましたら出来るだけ対応いたしますのでご感想など聞かせていただければ嬉しいです。
ブックマーク数5の記事に新たに+100ブックマークされる場合と、ブックマーク数500の記事に新たに+100ブックマークされる場合とでは、同じ100増えたブックマークでも印象が違います。
同じ100ブックマーク増えただけに違いないのに、なぜでしょうか。
沢山ブックマークが付くとランキング等で後押しされ更にブックマークされやすくなります。
まっさらな+100ブックマークと、後押しされた比較して付きやすい+100ブックマークだから印象が違うのです。
そこで”印象”の部分に着目してて、ブックマーク数が多ければ多いほどブックマーク数の数の力を弱める、といった指標を作ります。
次の式を使います。対数、logです。
f(n) = round( log(n) / log(√(2)) ) n はブックマーク数、 例外として、f(1) = 1 round() は整数に四捨五入のこと
f(2) = 2
になるように対数の底を√(2)にしています（”log(√(2))”で割る）。これは自分勝手な都合です。色々変えてもよいかもしれません。
数字の増減がわかりやすいようにブックマーク数が1~20までの結果を羅列します。
| n ブックマーク数 | f(n) | 補足 |
|---|---|---|
| 1 | 1 | 例外です |
| 2 | 2 | |
| 3 | 3 | |
| 4 | 4 | |
| 5 | 5 | |
| 6 | 5 | ここから変わってくる |
| 7 | 6 | |
| 8 | 6 | |
| 9 | 6 | |
| 10 | 7 | |
| 11 | 7 | |
| 12 | 7 | |
| 13 | 7 | |
| 14 | 8 | |
| 15 | 8 | |
| 16 | 8 | |
| 17 | 8 | |
| 18 | 8 | |
| 19 | 8 | |
| 20 | 9 |
f(n)が増えるところだけ見ます。
| n ブックマーク数 | f(n) | 補足 |
|---|---|---|
| 1 | 1 | 例外です |
| 2 | 2 | |
| 3 | 3 | |
| 4 | 4 | |
| 5 | 5 | |
| 7 | 6 | |
| 10 | 7 | |
| 14 | 8 | |
| 20 | 9 | |
| 27 | 10 | |
| 39 | 11 | |
| 54 | 12 | |
| 77 | 13 | |
| 108 | 14 | |
| 153 | 15 | |
| 216 | 16 | |
| 305 | 17 | |
| 431 | 18 | |
| 609 | 19 | |
| 862 | 20 | |
| 1217 | 21 | |
| 1723 | 22 | |
| 2436 | 23 | |
| 3445 | 24 | |
| 4871 | 25 | |
| 6889 | 26 | |
| 9742 | 27 | |
| 13778 | 28 | |
| 19484 | 29 | |
| 27555 | 30 |
桁が増えるくらいで f(n) が 7 増えます。
ブックマーク数が多ければ多いほど f(n) が増えにくくなっています。安易に対数を使うとこんな感じになります。
実例で見てみます。
2014年07月21日～07月27日の週間ランキング - はてなブックマーク
(表組み内で「|」文字を使う方法がわからないので、タイトルからはその文字だけ削除しています。)
| n ブックマーク数 | f(n) | タイトル |
|---|---|---|
| 2283 | 22 | これは使える!覚えておきたいEXCELのちょっとした技20選 - NAVER まとめ |
| 1903 | 22 | 「1枚」で、パワーポイントの品質と生産性を向上させるデザイン・テンプレート｜PowerPoint Design |
| 1459 | 21 | 見ないと絶対損する！プレゼン資料の印象がグッと上がる良質記事10選 SIROKグロースハックブログ |
| 1396 | 21 | たった１分で驚きの効果！SEの夫を眼精疲労から救ったスゴ技10選 シンプルライフ |
| 1154 | 20 | リア充から教わった人気者になれる会話聞き上手術 |
| 1312 | 21 | 驚くほど効率UP！エクセル(Excel)マクロ講座｜All About（オールアバウト） |
| 1038 | 20 | JavaScript初級者から中級者になろう — uhyohyo.net |
| 873 | 20 | 15分間の罵倒: いろいろにっき。 |
| 853 | 19 | 何かのときにすっと出したい、プログラミングに関する法則・原則一覧 - Qiita |
| 843 | 19 | 自分の好きな焦点距離を見つけよう！焦点距離毎の「すごい」作例まとめ！ |
| 815 | 19 | これからAWSを始める人は一読すべき「AWS運用チェックリスト」を読んでみた ｜ Developers.IO |
| 719 | 19 | リクルート創業者江副浩正の遺した「マネージャーに贈る言葉20章」が現代のビジネスパーソンの間で話題に - NAVER まとめ |
| 710 | 19 | ヤフージャパン、総務省にパブコメを出すも激しく全否定されネットでも十字砲火を浴び炎上(山本 一郎) - 個人 - Yahoo!ニュース |
| 706 | 19 | IT系企業の平均給与を業種別にみてみた 2014年版 ～ ネットベンチャー、ソーシャル、ゲーム編 － Publickey |
| 802 | 19 | 幸せな人はやっていない、今すぐやめた方がいい12のこと ｜ ライフハッカー［日本版］ |
| 701 | 19 | ASCII.jp：データ消失！あのとき、ファーストサーバになにが起こったか？ (1/2)｜データ消失事故から2年！ファーストサーバ、再生への第一歩 |
| 681 | 19 | 京都市内に住んでいる人しか理解できない京都人の感覚 : 市況かぶ全力２階建 |
| 675 | 19 | 「もはや計画は不要になった」 MITメディアラボ・伊藤穰一氏が語る、"インターネット後の世界"と"新しい原理" ログミー[o_O] |
| 665 | 19 | 学生時代、英語が嫌いだった僕が英語を話せるようになるまで - (define -ayalog '()) |
| 651 | 19 | こんなところが日本に？パスポートいらずで海外の気分を味わえる国内スポット5選 RETRIP |
| 634 | 19 | ボールジャグリングの基礎 |
| 630 | 19 | 800枚以上の無料写真をカテゴリー別にダウンロードできるサイトPexels - Photoshop VIP |
| 627 | 19 | 無料で読めるlinuxのテキスト ~ PCまわりクイックメモ |
| 605 | 18 | Matz氏語る「今ソフトウェアはソフトじゃない」 - Engine Yard Blog |
| 598 | 18 | LINEスタンプ用 Illustrator テンプレートと書き出しスクリプト - はてゆき |
| 578 | 18 | 商用無料の写真素材のブックマークに加えておきたい、高解像度でセンスのいい写真画像がダウンロードできるサイト -raumrot コリス |
| 576 | 18 | 覚えておいて損ナシ！心理学を駆使した今日から使える交渉術8個 COROBUZZ |
| 572 | 18 | 「今、アメリカ経済は好調です。車が飛ぶように売れていきます。理由は低所得者向けの低金利ローンです。」について - Not-So-News |
| 566 | 18 | 軽くて使いやすい仮想化技術 「Docker」の仕組みと エンタープライズ開発における4つの活用事例 （1/6）：CodeZine |
| 560 | 18 | 「ブックマークコメントページ」をベータリリースしました - はてなブックマーク開発ブログ |
ブックマーク数2283も1903も大体同じという印象にそって、同じ数値22を得ました。期待通りですが、ふうんて感じです。
100前後のブックマーク数サンプルがないので別のページを参照して同じことをやってみます。
2014年07月21日～07月27日の週間ランキング - おもしろ - はてなブックマーク
| n ブックマーク数 | f(n) | タイトル |
|---|---|---|
| 651 | 19 | こんなところが日本に？パスポートいらずで海外の気分を味わえる国内スポット5選 RETRIP |
| 634 | 19 | ボールジャグリングの基礎 |
| 399 | 17 | このくるくる回る白いドット、実は真っ直ぐ往復してるだけなんだぜ : ギズモード・ジャパン |
| 315 | 17 | 【2ch】ニュー速クオリティ:【画像】雨に濡れたJK達えろすぎｗｗｗｗｗ |
| 233 | 16 | んにゃあああ！ 家猫のあり余るエネルギーをハムスターみたいに発散させる回転ぐるまが登場 - ねとらぼ |
| 195 | 15 | ９０年代後半の日本の雰囲気ｗｗｗｗｗｗｗｗｗ:哲学ニュースnwk |
| 189 | 15 | おすすめのYouTube動画をおしえろん BIPブログ |
| 176 | 15 | まんだらけ渋谷店女子部、中古売却された芸能18禁同人誌を写メ付で無断宣伝→「削除の予定は無い」 - NAVER まとめ |
| 174 | 15 | 豆乳を投入 |
| 212 | 15 | VIPPERな俺 : 腹出てる奴に朗報 胸筋下部という筋肉を鍛えなさい |
| 173 | 15 | 【画像】堂々と腋マ●コ見せる女ｗｗｗｗｗｗｗｗｗｗｗｗｗｗ：キニ速 |
| 156 | 15 | バンダイ、甲羅から亀が勢いよく飛び出すカプセルトイ「あいつ、亀やめるってよ」発売 - ITmedia ニュース |
| 139 | 14 | 【社畜】ベッドのない会社で寝るための5つの方法：キニ速 |
| 142 | 14 | 【画像あり】39年前のソニーのラジオかっこいい！：キニ速 |
| 130 | 14 | 女なのですが可愛い女の子とエロいことがしたいです |
| 143 | 14 | なんで去勢志願者っていないんだろう？ |
| 121 | 14 | もっふり可愛い猫画像スレ:哲学ニュースnwk |
| 116 | 14 | 自分の脳が右脳派なのか左脳派なのかが分かる一枚の画像が凄いと話題に:哲学ニュースnwk |
| 102 | 13 | 村長VS青二才勃発～村の陰湿ないじめに負けるな、青二才さん - 豆府ﾒﾝ樽 |
| 115 | 14 | デートをドタキャンされたからぼっちで「アートアクアリウム展」行ってきた。 - 自省log |
| 83 | 13 | Amazonでついついクリックしてしまった可愛い女の子のサムネ集 7選 - 自省log |
| 85 | 13 | 【画像】最近のボケてレベル高杉ワロタ : 暇人＼(^o^)／速報 - ライブドアブログ |
| 106 | 13 | 第21回 ジブリタイトルを組み合わせて一番面白い奴が優勝 : あじゃじゃしたー |
| 77 | 13 | 【TPO行方不明】町で聞いたバカップルの会話18選 CuRAZY |
| 76 | 12 | 片栗粉でクッキー作った結果ｗｗｗｗｗｗｗｗｗｗｗ：キニ速 |
| 74 | 12 | トランクス女子を流行らせよう(提案) |
| 75 | 12 | 可愛すぎて胸がときめく！被り物をかぶった猫ちゃん写真集 COROBUZZ |
| 68 | 12 | 美人ドコモ店員キレる |
| 64 | 12 | 変態子ども時代 |
| 90 | 13 | 痛いニュース(ﾉ∀`) : 【画像】 カモメがウサギを丸飲み - ライブドアブログ |
| 62 | 12 | 【画像あり】女子大生が男子中学生に性教育 羨ましすぎワロタｗｗｗｗｗｗ：キニ速 |
| 86 | 13 | 一人旅おすすめの温泉地：【2ch】バイク速報 |
| 50 | 11 | 江頭2:50 vs 加藤鷹 “クリ”ック対決 ゴッドフィンガーはどっちだ？ （動画） - ViRATES [バイレーツ] |
| 51 | 11 | 古美門「何ィ！？ 女児誘拐事件の犯人を弁護しろ！？」【予告編】 - ゴールデンタイムズ |
| 49 | 11 | 【絵本】元図書館司書が厳選! 日本の「怖すぎる絵本」8冊（1/3） - ウレぴあ総研 |
| 43 | 11 | この完璧すぎるgifで笑わずにいられる奴いるのｗｗｗｗｗｗｗｗｗ : あじゃじゃしたー |
| 46 | 11 | 【放送事故】番組内の通販で、正直な女優が「その商品意味あるの？」と激怒！司会者が「まぁまぁ」といさめるハプニングｗｗｗｗｗｗ 9ポスト |
| 45 | 11 | 童貞諸君、安心したまえ。男は誰も満足できていない。 |
| （略） | ||
| 39 | 11 | 夏まで生きていようと思った。 - スチーム速報 ＶＩＰ |
終始ふーんという印象が拭えませんでしたが、ブックマーク数を伏せた上でこの数値を被験者に利用してもらい、比較して対象の行動にどう変化が出るのか、というところまでやるのがよいようです。
このf(n)の各数値を別の言い方、ちょい、ちょいちょい、すごい、ちょいすご、かなりすごい、またはいくつかの星、勲章、色、濃度などを充てていくと、親しみやすいものになっていくと思います。少ないブックマーク数は無理せず、そのまま表示がわかりやすいかもしれません。
直接的な数字からの脱却というか、いっそはてな自体が被ブックマーク数を見えなくして、印象だけで見せるって風になったらどんな見られ方をしてどんな未来が待っているのかなあなんて思いました。しかしこれはある人にとってはちょっとしたディストピアでしょう。
はてブ一覧ページの改定があったが、これについてユーザーから、はてな（株）への文句がいっぱい来る。ああ、腹が立つ。勝手なことばかりほざいて、はてなという会社にケチを付けるとは何事だ。だいたい、タダでサービスを使わせてもらっているくせに、文句を付けるなんて、威張り過ぎなんだよ。
そこで俺が解説しておこう。ただし俺は、はてなの社員じゃないからな。いいな。俺は、はてなの社員じゃないぞ。「たぶん＊＊＊部門の＊＊＊だろう」なんて見当を付けるなよ。そんなことをされたら迷惑なんだよ。いいな。俺は、はてなの社員じゃない。間違えるなよ。
まず、今回の変更の目的は、ユーザーの利便性の向上じゃない。そこを勘違いしているユーザーが多すぎる。自分勝手もいいところだよな。
だいたい、ユーザーの利便性が増したと言って、はてなにとって何の利益がある？ そんなことはやるだけ無駄だろう。いいか。はてなの社員の課題は、会社の収益を上げることだ。ユーザーの利便性を増すことじゃない。はてなというのは、慈善団体じゃなくて、営利企業なんだからな。そこのところを根本的に勘違いするなよ。
ここまで理解すれば、今回の変更の目的もわかるだろう。はてなの収益性のアップだよ。別ページのリンクに飛ばして、その別ページに広告を掲載して、広告のクリック率を高めて、収益性を増すことだ。これが本当の目的だ。
このことは、２ちゃんねるのリンクを見てもわかるだろう？ ２ちゃんねるのリンクをクリックすると、どうなる？ リンク先に飛ぶか？ いや、別ページに移る。そこには、広告が掲載されている。そうだ。あのエロ広告だよ。こうやって広告を掲載することで、２ちゃんねるの収益性アップに貢献する。
はてなも同じだよ。リンク先に直接飛んだら、はてなの収益は上がらないだろ？ そこで、リンク先に直接飛ぶかわりに、広告ページを表示するんだ。こうやって、ユーザーには多大な迷惑をもたらす一方で、はてなの収益はアップする。これが本当の目的なんだよ。それがわからないのか？
はてなの目的はあくまで金儲けだ。あちこちから金を稼いで、社員で沖縄などのリゾートを楽しむことだ。社員がそうやって楽して遊ぶために、ユーザーは奉仕する。その逆ではない。つまり、はてながユーザーに奉仕するのではない。ここのところを根本的に勘違いするなよ。一円も払っていない無料ユーザーが多いくせに。まったく乞食根性の奴らが多すぎる。乞食ほど威張るというのは本当だな。
とにかく、これが真実だ。はてブ一覧ページは、ユーザーのためにあるわけじゃない。仮に、ユーザーのためにあるのなら、とっくに不評の新ページを中止して、元の旧ページに戻している。そんなことは一瞬で済む。簡単だ。しかし、それはやらない。なぜなら、真の目的は、ユーザーの利便性の向上ではなくて、はてなの収益性のアップだからだ。
ここのところを根本的に勘違いしているユーザーが多すぎる。頭が悪すぎるんだよ。そんな頭の悪い奴らが威張り散らしているんだから、まったく、腹が立つ。馬鹿は黙っていろよ。
最後に言っておくが、俺ははてなの社員じゃないからな。絶対に、はてなの社員じゃないぞ。こっそり身元を探したりするなよ。そんなことをした奴がいたら、はてなの ID を削除してやるから、覚悟しろよ。
参考： 2014-07-24
http://bookmark.hatenastaff.com/entry/2014/07/24/205429
告知されていたブックマークへの返信機能（コメント一覧ページで検討中の新規機能について、ご意見を募集します - はてなブックマーク開発ブログ）が実装されたが、いくつか気付いた点を書いてみる。
引用スターがしづらい、コメント内URLが一旦ブックマークコメントページに切り替えないと踏めない、という２つの欠陥がある。これはコメント文章をリンクにすることをやめて、従来の状態に戻せば解決できる。元に戻しても新設されたTwitterアイコン、Facebookアイコンの隣にあるリンクアイコンからブックマーク コメントページに飛べるので問題ない。
raimon49 はてなスターで引用箇所を選択しづらいのでコメント本文全体がクリッカブルな仕様はダメ。
（追記）
seiyuDB url貼っても１クリックで飛べなくなった。改悪でしかない。無条件で鳩とかfとか出して鬱陶しいったらありゃしない。聞く耳持たないご意見募集とか。
従来はメタブタワーが一系統だったが、これからは各ブコメにブックマークできるので、一つのブックマークページから何系統ものタワーが伸びることになる。これを見やすくするには、ブコメの横に赤いブックマークアイコンが付けば多少見やすくなる。
kha パーマリンク(鎖マーク)の隣に[XXusers]とメタブ数が表示されれば、手斧を投げ合う様子が視覚化されて良いと思います。
一つのブクマページから何系統ものタワーが伸びると、それを追うのも大変。
似たような構造としては、スラッシュドットのようなネストできる掲示板がある。スラドのようにボタン一つでメタブを開けるようにすれば非常に見やすい。
ボタンはOff,5users,3users,1userとなっていて、1userにすると全メタブが開く。
メタブというのはブックマークページをブックマークすることだが、 ブックマーク コメントページをブックマークすること何と呼べばいいのか。誰か早めに決めたほうがいい。例えばブックマコメントで、マコメというのはどうだろうか。
取り急ぎ、改善できそうな点を書いてみた。
初音ミクのオンラインかるたゲーム「ミクミクかるた」をリリースしました。
http://mikumikuplay.com/karuta/
個人で開発して、開発期間は3週間くらいです。
http://www.nicovideo.jp/watch/sm22964822
リリースしたものの過疎ってるので、増田で宣伝をさせてくださいなと！
「ミクミクかるた」はブラウザで簡単に遊べるオンラインかるたゲームです。ゲームのルールは簡単で、ボカロ曲が流れたら、歌詞の先頭文字の札をクリックするだけです。「みっくみ～くにし～てあげる♪」と流れたら「み」の札を取ります。かるたの札の読み上げの代わりにボカロ曲が流れるというシステムです。オンライン対戦することも出来ます。ボカロ好きな人たちが集まって遊べる場になればと思っています！
ゲームで使わせて頂いた曲はpiapro(ピアプロ)でお借りしました。改めて素晴らしい曲がたくさんあることを知り感動しました。このゲームによって素晴らしい曲が、より多くの人に聴かれることを願っています。
実はこのゲームの開発者である私もボカロPをちょびっとやっています。私の場合、曲を作ってニコニコ動画にアップしても2日も経てば再生数の伸びが止まってしまいます。毎日すごい数の曲がアップされている為、すぐに埋もれてしまうのでしょう。私の曲は大したことがないのでいいのですが、中にはすごく良い曲でも再生数が少ないものが多々見られます。このゲームによって埋もれている隠れた名曲に、光を当てられたらと思っています！
以前、「ミクミクすごろく」というオンラインすごろくゲーム(http://mikumikuplay.com/sugoroku/)を作り、ユーザーがイラストと文章を作ることによってゲームコンテンツを拡張していくことが出来るCGG(Consumer Generated Game)の仕組みを作りました。CGGはブログなどでおなじみのCGM(Consumer Generated Media)のゲーム版に当たります。
今回開発した「ミクミクかるた」では、開発作業をニコニコ生放送で配信していました。すると視聴者の方がゲームの機能やデザインについてのアイデアをコメントしてくれました。コメントしてくれたアイデアのほとんどを採用しています。言わば、生放送駆動開発(Live Driven Development)と言えるのではないでしょうか？まぁ、これは悪乗りですが・・・。
最近流行している開発手法としてテスト駆動開発(Test Driven Developement→略してTDD)というものがあります。TDDをするとテストしやすいインターフェースやモジュール設計が出来るようになりますが、この生放送駆動開発すると、ユーザーが望んでいる設計が出来るのではないかと思います。新たな開発手法を発見することが出来ました。
■特徴一覧
・ニコニコ動画等で埋もれてしまっている隠れた名曲に光を当てるシステム
・HTML5、Node.jsによりWebブラウザゲームにおけるリアルタイム処理を実現
先日、HTMLを学び始めてから約1か月でWebサービスをリリースしました。
(HTMLとCSSを学び始めたのが5月11日、リリースが6月15日でした)。
週3くらいでアルバイトをするフリーターのような生活をしております。
【つくったサービス】
つくったWebさーびすは｢せつな｣という"過去を水に流す"ことができるWebサービスです。
(http://setsuna.lolipop.jp/liverty/)
時間がたてばあなたの投稿は川に流されるようにして消えてしまいます。
普段Facebookには書けないようなことも自由に思い綴ってみてください。
それが前に進むきっかけとなるかもしれません。
Twitter・2ch・はてな匿名ダイアリーをあわせたような感じでしょうか。
いろいろあって、
｢好きなことをして暮らしていきたい｣という浅い考えを達成しないと死んでしまうと思った僕は、
とりあえずの目標として｢起業して稼ぐ｣ことを目指し、なんだかんだやっていました。
しかし、目に見えるような結果はなかなか出ず、どうすればいいのか行き詰ってしまっていました。
そんなとき、たまたまWebの知識を持っている友人に｢やってみたら?｣と言われ、
HTMLってなに??レベルからとりあえずHTML・CSSフロントコーディングの勉強を始めてみたのがきっかけです。
始めてみると、面白すぎて衝撃をうけました。
シンプルな表記でほぼ無限に物創りができ、用意されている道具を組み合わせて行くだけにもかかわらず、決して解明されることのない奥深さ。
このパズルでただ遊んでさえいれば、でかいサービスをつくることだってできるし、
エンジニアになれば遊んでいるだけでお金をもらえるかもしれない、と妄想をしたりもしました。
これが僕のプラグラミングの第一歩です。
｢好きなこと｣が広がることは、｢好きなことをして暮らす｣ことに近づくと思い、とにかくやってみようと思いました。
この時点では、1か月後にサービスをつくろうとかは全く考えていませんでした。
【やったこと】
わからないところはググり、それでもわからなかったら聞くというスタンスです。
与えられた課題は以下です。
② このサイト(http://liverty.jp/)のヘッダーをつくる
③ このサイト(http://bokutsuka.me/)のフッターをつくる
④ sercusをつくる(http://sercus.jp/)
⑤ nanapiをつくる(http://nanapi.jp/)
⑥ skillshareをつくる(http://www.skillshare.com/)
⑦ 要素を検証せずにページをつくる
これを2週間くらいで終わらせました。
最初は辛かったですが、慣れて行くにつれてスピードは速くなり、
最終的に半日あれば一つのページを完成させるくらいには上達したと思います。
HTMLの基本がおわったくらいから、同時進行でPHPを学び始めました。
これはほぼ独力でやったので、HTMLよりも神経を使いました。
参考にしたのは、
『いきなりはじめるPHP』
『PHPレッスンブック』
http://www.amazon.co.jp/%E6%9C%AC/dp/4883377849
です。
どの本もとても参考になりましたが、初心者なら、『いきなりはじめるPHP』を絶対お勧めします。
文字化けなどの対策が1からわかりやすく書いてあり、つまづきが激減するでしょう。
馬鹿なので1冊の本だと情報を拾い読むことができず、各本に書いてある分かりやすい部分をググりつつ、噛み砕きつつ、なんとか勉強を進めました。
MySQLについては、ほぼPHPとセットのようなもので、PHPの本をみると基礎的なことはざっと勉強することができます。
ローカルサーバーは、Windowなので、Xamppを使いました。
最初の設定にかなり手間取り、知り合いのプログラマーに助けてもらわなかったらPHPを書くことすらなく終わっていたと思います
(結局ローカルホストにアクセスできていなかったという初歩的なミスでした)。
PHPは、本に書いてあった実践で使えそうな課題をこなしながら、構文を覚えていきました。
最終的にサービスのもととなった課題は、｢PHPでつくるお問い合わせフォーム｣と、｢簡単掲示板｣です。
記事投稿の仕方や、簡単なデータベースとの連携、繰り返しの構文など、
掲示板がPHPの基本を覚えるのに最も適した課題だといわれている理由がわかったような気がしました。
【３：サーバー】
特に何も考えずに選んだのですが、どうやら使い方がわかりやすいのはここのようで、ロリポFTPにはいつも助けられています。
もともと作りたいサービスが他にあったのですが、
その前に、いま持っている技術でサービスをつくろうと友人のプラグラマと話していて、6月中に何かを作ろうとは思っていました。
｢多くの機能はつけられないけど、逆に、投稿を100件だけにすれば自分でもそれっぽいサービスつくれるんじゃね??｣
と、今あるスキルだけで出来る、機能を絞ったサービスを思い付き、｢せつな(http://setsuna.lolipop.jp/liverty/)｣をつくろうと決めました。
1か月でつくったといっても、たいした技術は使っておらず、できることを組み合わせて面白いことをやろうとした結果こうなったという感じです。
【つくった感想】
１：プログラミングが難しそうに見えるのは、最初の｢とっかかり｣、つまり、設定や文字化け対策などに異様にてこずるからだと思います。
そこを何とか突破さえしてしまえば、あとは、成長が自分でも目に見えてくるので、楽しくなってくると思います。最初が1番難しいです。
２：リリースをして、拡散されていくときの承認欲求が満たされる感じは半端ないと感じました。
また、バグがいくつか見つかるなど、大きなサービスをつくるとなると本当に大変なのだろうな、と思いました。
３：次に同じものをつくる時は、おそらく1日で出来ると思うので、次はまた別のスキルを使って別のものをつくろうと考えています。
”発信できるパズル”をすることができるのは超わくわくします。
【今後について】
人気アダルトサイトの更新情報を簡単に見れる「画像アンテナ」をリリースしました。
エッチなサイトをそのままブックマークするのは ちょっと恥ずかしかったので
アダルトサイトの更新情報を一覧でまとめて見れるアンテナサイトを作ってみました。サイトは以下より
→ 画像アンテナ
作ったと言ってもwordpressを用いて 登録サイトの更新情報をフィードから取得し
表示すると言うシンプルな物でござる。
・あたり前田のクラッカーですがスマホ、モバイルに対応
・サイト別の記事を最大70件表示可能（特定のお気に入りサイトの更新情報をまとめて読めます）
・巡回してるサイトは日本国内の大手サイトで2次元・3次元 両ジャンル閲覧できます。
当サイトをwordpressで作るにあたって 「便利だなぁ～」「これいいね！」と思ったプラグインを紹介しておきます。（ブクマ推奨）
・WordPress › WP File Cache « WordPress Plugins
WordPressが早くなるプラグインです WordPress › MO Cache « WordPress Pluginsと便用する事で効果を発揮します。
・WordPressを高速化するプラグイン｢WP Hyper Response｣ | [M] mbdbこちらもWordPressが早くなるプラグインです。導入後すぐに効果が実感できました。
管理画面も軽くなる模様
・WordPress › WordPress.com Stats « WordPress Pluginsサイトへのアクセスがリアルタイムで分かる高性能アクセス解析
・Plip | WordPressプラグインのクリップサイト WordPressプラグインのクリップサイト
ますだでリリース報告すると、いいことあるかもよと聞いて、やってきました。
あまけんβ- アマゾン商品の検索をいい感じに使えるサービスを開発中。
「あまけん」はアマゾン商品の検索をいい感じにできるサービスを目標に開発しました。
「あまけん」ではアマゾン商品の検索後、レビュー数などによる並び替えや、星の数でのフィルタリング、画像や簡易表示など表示モードの切り替えが可能です。
また検索後の並び替えなどでは、非常に高速に動作するため、商品の比較などに向いていると思います。
ますだ報告デフォルト(?)の、開発の流れや開発環境を簡単に。
検索後、お好みの星の数でフィルタリングした上で、レビュー数や売上ランキング順で並び替えて商品を比較するのがお勧めです。特にレビュー数は本家サイトにない指標なので、おすすめです。
表示モードは情報量と一覧性のバランスのいい”簡易”モードがお勧めです。お好みに合わせて、情報量の多い”詳細”モードや一覧性が高い”画像モードの使い分けも可能です。
アマゾン内で検索する前や後に併用して、あまけんの高速性を活かして、商品比較用にといった活用もおすすめです。
お気に入り登録機能など、様子を見ながら機能追加や改修などのアップデートを行っていきたいと思います。
自動でマッチングしてチャット相手を見つけてくれるマッチングチャットや、すぐにチャット相手を見つけてくれるフリーチャット、コミュニティチャット、フレンドチャットなど、とにかくチャットがメインのSNSです。
■自分について
昨年の４月から、プログラムを学び始めた素人。２２歳。札幌在住。
FaceBookがウザい。というか嫌い。
これがきっかけ。
顔本が良いSNSだと話題になっていたので、実名登録してみた。大学の知り合いが見つけてくれて、友達登録などが増える。（ほとんど話したことがない人からも友達登録が来て、「おぉ！これで俺も友達が増えるんだ！」とワクワクしていた）。
が、流れてくるのは自慢ばっかり。
コミュ障で彼女はおろか、女友達もほとんどいない自分にとって顔本で「飲み会行ってきたぜウェーイw」とか、「○○ちゃんの誕生日会なう！」とか、「○○勉強会行ってきたました！ みんな熱い人ばっかりで最高！」とか書いてあるのを見て「こんなSNSは嫌だ……」と思った。
ようするに嫉妬です。
で、自分の好きなようにSNSを作ってみたいなぁ。と思いました。
自分の趣味がレトロゲーなので、自分と同じ趣味の人と話せたら素敵だな。ということでチャット式のSNSを思いつく。
が、Webサービスを独力でつくるのはこれがはじめて。というより、プログラム自体がはじめて。
案の定、前途多難だった。
そして私はアホだった。
■とにかく計画を立てる。
ざっくり、どんな機能が欲しいか考える。自分の力じゃ無理そうでもOK.とにかく妄想を爆発させる。
メッセージ機能、コミュニティ機能、あしあと機能、日記機能、コメント機能、つぶやき機能など。
コミニティ専用のチャットルーム、アカウント専用のプライベートチャットルーム（鍵をかけられる）、自動でチャットが開始されるフリーチャット、自分の指定した条件にあう人を自動で見つけてきてくれて、チャットができちゃうマッチングチャット。
などなど。
妄想するのは簡単だ。でも、全くわけがわからない。何から手をつけていいのかわからない。
「うはｗｗｗｗ これで勝つるｗｗｗ」と思ったけれど、どうやってチャット機能を追加して良いのかわからなかった。改変しようにも謎の記号がめちゃくちゃにならんでいてどうして良いかわからない。
しかも、改変したら改変したでそれを全世界に公開しなくちゃならないらしい（オープンソースというらしい）。
無理だ。
とにかくサーバーサイドの言語と、データベースについて勉強しろや！ とのことだった。
■使う言語について。
サーバーサイドを扱える言語はたくさんあって、PerlとかPHPとかPythonとかRubyとか色々あるらしいのだが、色々悩んだ結果
PHPにした。WebサービスならPHPが良いらしい。レンタルサーバーなどでも簡単に扱えるらしい。
後でPHPがクソ言語という話も聞いたが、とにかく最初に選んだのがPHPだったので。
・PHP
よくわかるPHPの教科書。http://www.amazon.co.jp/dp/4839933146/
MySQLとかについて一通り書いてあるので良かった。二週間くらいでなんとか全部こなした。xamppなども触って、ローカルサーバーで色々試した。
これが終わったら、
パーフェクトPHP http://www.amazon.co.jp/dp/4774144371/
パーフェクトって書いてあるから、パーフェクトなはずだと勝手に思い込む。
実際かなりすごい内容で、胃もたれ起こした。一ヶ月くらいで三回くらい読んで、大体のところを理解した。
フレームワークにCakePHPを使ったので、MVCについてのくわしい記述は大変参考になりました。
基礎からのMySQLで勉強。 http://www.amazon.co.jp/dp/4797344385/
最期に
ハイパフォーマンスMySQL http://www.amazon.co.jp/dp/4873114268/
とりあえず掲示板くらいはつくれるようになったので、チャットについてリサーチ。
ajaxとかよくわからん技術やnodejsを使った非同期処理などがあると知る。
nodejsはC10K問題という問題を解決するすごいものらしく、かっこいいらしいのでこれを勉強することに。
ついでにnodejsと相性の良い、mongoDBも勉強することに。
よくわかるjavascript http://www.amazon.co.jp/dp/4839941874/
終わったら、
パーフェクトjavascript http://www.amazon.co.jp//dp/477414813X/
パーフェクトjavascriptはnodejsについてものすごく詳しく書いてあったので、とても参考になった。このあたりで、LINUXというOSを扱わなくてはいけないと気付き、自宅PCをウィンドウズから、LINUX（ubuntu)に変えた。
これはとにかく触ってなんぼでした。MySQLと感覚が違い、苦労しました。
https://github.com/ichikaway/cakephp-mongodb
という素晴らしいものを利用させていただきました。
■このへんで一回限界がきた。
なんとなくnodejsを扱うこともできるようになり、それなりに楽しいと思ってはいたものの、「SNS作ったる！」と思ってから六ヶ月以上が経過していた。
さらにWebサービスを公開するにはデザインもそれなりにしなくてはいけないらしく、CSSなどについて勉強しなくてはいけないと知る。
一人でWebサービス作ってる「ゆーすけべー」さんとかすごいなと思った。
勘違いサブカル野郎だと思っていた「家入一真」とかもやっぱりすごい人なんだと思った。
自分はなんもできないなぁ。と痛感した。
で、悩んでても仕方ないので、デザインはバッサリあきらめることにした。
もうなんでもかんでもやるのは無理なので、捨てるものは捨てることにした。
基本的に Initializr http://www.initializr.com/ （テンプレートエンジン）
と
TwitterBootStrap http://twitter.github.com/bootstrap/ （Twitterっぽい今時な感じのデザインが簡単に使える）
を使うことに。
でも、これだとまさにTwitterそのまんまっぽかってので、
http://bootswatch.com/ （きれいなデザインテンプレートがあるサイト）
も使うことに。デザインについてはこれだけ。
無理はしないことに。
■大体できたら、あとはセキュリティ。
セキュリティは大事。自分のサイトでは一応、登録制なのでフリーメールアドレスなどを預かる。これは流出させたら困るし、なによりユーザー様が安心して使えないなんてだめなので。
これにはかなり注意したつもりです。
まず基本的なことは 『体系的に学ぶ 安全なウェブアプリケーションの作りかた』 http://www.amazon.co.jp/dp/4797361190/
で勉強。
本番環境に公開する前には グーグル先生が公開している skipfishというツールでチェックをしたり、
Dos攻撃対策に、
http://up-point-server.info/?p=54
などに書いてある
mod_dosdetector などを利用。
これははてなさんが公開しているものです。この場を借りて感謝します。ありがとうございます！
あとはSSHへのブルートフォースを防ぐために、DenyHostというツールを利用するなどした。
クラウドサービスを利用しているので大丈夫だとは思うのですが、一応rsyncコマンドでバックアップを定期的にとることに。
サーバー上の別の場所にGzipで保存し、それを自宅サーバーのCentOSで保存するという形式です。深夜にcronで自動的に実行しています。
参考サイトは、
http://mukaer.com/archives/2012/03/14/vpscentos/
です。
■パフォーマンス向上のために少しだけ
はじめはサーバーはapacheだけだったのですが、今は画像ファイルなどはNginｘというサーバーを使うのが良いそうなので、Nginxを使いました。
あとはPHPの中間キャッシュを利用するAPCなども利用することに。
このへんについては、
このような解説記事がたくさんあったので、参考にさせていただきました。
■ようやく完成。
で、なんとか完成しました。
使ってみた感想や、ダメ出しなど頂ければ狂喜乱舞します。よろしくお願い致します。
■モチベーションを維持するためにやったこと。
あっさりと書きましたが、実際は失敗の連続でやる気が萎えてばっかりでした。
疲れて帰ってきて、なにもやる気の起きない時もありました。
そういう時は、とにかくサポートページのQ&Aの1文でも良いから書いてみるとか、とにかくパソコンとエディターだけ立ちあげてみるとか、していました。
ものすごーく覇気のない目でキーボード打ち続けていましたが、それでもなんとか完成することができました。惰性だろうとなんだろうと、少しずつは進むのだとわかりました。
やはり１から完全自作をするのは無謀だった。でも、プログラムをやったことのない素人でも約一年頑張ればそれなりのSNSもどきを作ることができた。
これも先人たちの作ってくれたフレームワークや様々なツール、そして参考書などのおかげ。
私のようなアホでも頭の良い人の力を借りればなんとかなりました。ありがとうございます！
そしてプログラムは一人でも出来るので、私のように非コミュでも楽しめる素晴らしい趣味である。
■現在。
今はRubyに夢中です。くり返し処理がすごくきれいにかけるので素敵な言語だと思っています。あと、javascriptも面白いので毎日いじくって遊んでいます。PHPももちろん触っています。
非コミュはあいかわらずですが、プログラムが楽しいので前より幸せです。
使用言語 PHP,Javascript
Twitterを使う奴らは４種類の使い方をしているように思える．
『～をリリースしました．』
『～には～という問題があると発見．』
http://twitter.com/d_v_osorezan/status/10696506755522560
いわゆるRT厨，一定数必要だけど多い，多すぎる．
ウェブページへのリンクをはるのは自分の運営するページだったらコミッター，
公式RTを使うやつは目立ちたがり屋．
共感したと思うんだったらそっとFavするなりReplyするなり汁．
っつーわけで俺は旧RT派，少なくとも自分の脳みそ通してRT汁．
というかそんなオープンな場でローカルネタ展開するのってどうよ？
とはいっても俺も独り言は言うし公式RTもするけどね（目立ちたがりやだもん）．
たぶん『コミッター』になれるとレビュワーがたくさん食いついてくるので面白いと思う．
ただ『レビューのレビューのレビュー・・・』と連鎖していくと情報の価値の指標にはなるけど『もうそんなこと知ってるよ，いちいち騒ぎ立てんな』ってなる．
なんか例のツイート，いまさらながら『ボケ』って表現的に悪い気がしたので『芸術的作品』『お笑いネタ』に変更，本当にすごいと思う．
せっかくなので、ここ2年ほどのさくらインターネットiDC移転を中心に、わかる範囲ではてなサーバ変遷の歴史をまとめてみようと思う。
> 59.106.108.68: mobile.hatena.ne.jp.
> 59.106.108.69: f.hatena.ne.jp.
> 59.106.108.70: rimo.tv.
< 125.206.202.66: mgw.hatena.ne.jp. < 61.196.246.69: b.hatena.ne.jp. < 61.196.246.70: b.hatena.ne.jp.
> 59.106.108.71: mgw.hatena.ne.jp. > 59.106.108.72: b.hatena.ne.jp.
< 221.186.129.148: g.hatena.ne.jp.
> 59.106.108.73: g.hatena.ne.jp.
< 125.206.202.82: search.hatena.ne.jp. < 221.186.129.147: ring.hatena.ne.jp. < 221.186.146.28: a.hatena.ne.jp. < 61.196.246.68: r.hatena.ne.jp.
> 221.186.129.147: search.hatena.ne.jp. > 59.106.108.74: a.hatena.ne.jp. > 59.106.108.75: r.hatena.ne.jp. > 59.106.108.76: ring.hatena.ne.jp.
< 125.206.202.83: d.hatena.ne.jp. < 221.186.129.146: d.hatena.ne.jp. < 221.186.146.29: d.hatena.ne.jp. < 61.196.246.67: d.hatena.ne.jp.
> 59.106.108.77: d.hatena.ne.jp.
> 59.106.108.97: d.hatena.com. > 59.106.108.97: hatena.com. > 59.106.108.97: m.hatena.com. > 59.106.108.97: m.hatena.ne.jp. > 59.106.108.97: s.hatena.com. > 59.106.108.97: s.hatena.ne.jp.
> 59.106.108.80: d2.hatena.ne.jp.
d2.hatena.ne.jpで新しいコメント構造の実験を開始しました - はてなダイアリー日記
< 221.186.129.147: counter.hatena.ne.jp. < 221.186.129.147: search.hatena.ne.jp.
> 59.106.108.81: counter.hatena.ne.jp. > 59.106.108.82: search.hatena.ne.jp.
> 59.106.108.78: w.hatena.ne.jp. > 59.106.108.84: h.hatena.ne.jp. > 59.106.108.84: h.hatena.com. > 59.106.108.98: w.hatena.com.
< 221.186.146.27: www.hatena.ne.jp. < 61.196.246.68: screenshot.hatena.ne.jp. < 125.206.202.66: map.hatena.ne.jp. < 125.206.202.66: i.hatena.ne.jp. < 125.206.202.66: graph.hatena.ne.jp. < 125.206.202.66: q.hatena.ne.jp.
> 59.106.108.86: www.hatena.ne.jp. > 59.106.108.87: screenshot.hatena.ne.jp. > 59.106.108.88: map.hatena.ne.jp. > 59.106.108.89: i.hatena.ne.jp. > 59.106.108.92: graph.hatena.ne.jp. > 59.106.108.99: q.hatena.ne.jp.
< ???.???.???.???: auth.hatena.ne.jp.
> 59.106.108.90: auth.hatena.ne.jp.
長いので省略
> 59.106.108.93: rokuro.hatelabo.jp.
> 59.106.108.102: k.hatena.ne.jp.
> 59.106.108.103: favicon.hatena.ne.jp. > 59.106.108.105: img.b.hatena.ne.jp. > 59.106.108.106: bbeta.hatena.ne.jp.
> 59.106.108.93: bottle.hatelabo.jp. > 59.106.108.93: counting.hatelabo.jp. > 59.106.108.93: news.hatelabo.jp.
