「ページャー」を含む日記

■最新の記事一覧の一番下にある「もっと見る」をクリックすると

また同じ一覧が出てきて最後に「もっと見る」の代わりにページャーが出現するようになってるタイプのサイトの作成者さんへ

やめてね

Permalink | 記事への反応(1) | 02:27

ツイートシェア

■[今日知った言葉]ファントム・バイブレーション・シンドローム

幻想振動症候群。

深刻なスマホ依存症、ネット依存症になっていて、着信していないスマホから着信バイブを感じるようになる症状。

1996年に漫画ディルバートの作中でファントム・ページャー・シンドローム(幻想ポケベル症候群)についての言及がある。

2000年代後半から学術的にも研究がされるようになり、2010年代に入ってからも時々メディアに取り上げられてきた。

追記

別名考えてくれネタの増田が存在した。 anond:20190826201652

Permalink | 記事への反応(0) | 16:59

ツイートシェア

■はてなNGの代替品 for Firefox も作った

anond:20180609124213

はてなフィルタ - Firefox 向けアドオン

https://addons.mozilla.org/ja/firefox/addon/%E3%81%AF%E3%81%A6%E3%81%AA%E3%83%95%E3%82%A3%E3%83%AB%E3%82%BF/

機能

• Chrome版1.0.2相当(というか全く同じ)
  • "URL(ドメイン)"または"タイトル"指定でフィルタをかけ、エントリを非表示にする
  • 指定に関係なく一部サイトを非表示にする
  • "ユーザーID"指定でフィルタをかけ、コメントとスターを非表示にする
  • "コメント"指定でフィルタをかけ、コメントを非表示にする
  • サムネイルを非表示にする

[対象サイト]

つれづれ

Firefoxアドオンについて調べてみたところ、いつの間にかWebExtensionに対応していて、ほぼそのまま移植できそうだったので対応してみました。

ソースもmanifest.jsonもほぼそのまま使えてとても楽ちんでした。いじったのはchrome.storageをbrowser.storageに変更したのと、それにともなうAddON-IDの追加くらいです。いい時代になりましたね。

公式(AMO)に登録するのに$5払う必要もしないないし。

なお、表示はFirefox57以上となっていますがVer55でも動いてます。明確に動かないのは52より前です(browser.storage.local.getに不具合があるため)

Firefoxはシェアが10%を割ったということでどれくらい需要があるかはわかりませんが、Youtubeフィルタ(ユーザー数1)は超えてほしいものです。7月1日時点でChrome版が102人、6月9日時点ではてなNGが990人だったので、10～20人くらいは…

アップデート予定

アップデートというか別アドオンになるようですが、FirefoxはAndroid版でもアドオン使えるのでそちらの対応もできたらやりたいなという気持ちはあります。

スマホ用サイトは表示が違うのでその対応ですね。うまくゆくといいのですが。

Permalink | 記事への反応(3) | 13:05

ツイートシェア

■はてなNGの代替品作った

anond:20180323232608

はてなフィルタ - Chrome ウェブストア

https://chrome.google.com/webstore/detail/%E3%81%AF%E3%81%A6%E3%81%AA%E3%83%95%E3%82%A3%E3%83%AB%E3%82%BF/nogcpadcgpkonifnaagfghkaiiojdcap

はてなNGの代替品1.0.1を公開した

はてなNGの代替品1.0.2を公開した

はてなNGの代替品 for Firefox も作った

はてなNGの代替品 for Firefox の Android 対応

はてなNGの代替品 Chrome1.0.3/Firefox1.0.1 を公開した

はてなNGの代替品 Chrome1.0.4/Firefox1.0.2 を公開した

機能

• サムネイルを除去します(ON/OFFあり)。
• 「非表示ドメイン」をhrefに含むエントリをブロックします。
• 「非表示タイトル」をタイトルに含むエントリをブロックします。
• 一部サイトを強制的に非表示にします(解除不可)。

[対象サイト]

はてなNGにあるけどフィルタにはない機能

• NGアカウントのコメント、はてなスター、ブログをブロックします。
• 同一アカウントの連打による複数のスターをひとつのスターにして表示します。

結果

疲れた。

動機

連休なので、はてなNGフィルターを作ったらクソ快適になった話

連休(GW)が明けてもアップデートされなかったので。

6月までずれ込んだのは単にやる気が出なかったからです。

公式でフィルタ機能くらい用意してほしいものです。

技術

はてなNGのソース眺めながら作ったので特にないです。

HaxeやBootstrapは使わず、JavaScript(+jQuery)とポップアップ用htmlを手書きしてます。

アイコンは適当に拾ってきたフリーのやつです。

$5は払いました。

一部サイトの強制非表示をどうしても解除したければソースを直接修正して開発用パッケージとして読み込めば行けますよ。

難読化はしてないので5分とかからず外せるでしょう。アップデートは適用されなくなりますが。

アップデート予定

• 「非表示タイトル」の正規表現対応
  • 特定の人物名を非表示にしたい場合に、スペースの数等細かい違いでたくさん登録する必要があるのは不便でしょう。
  • 正規表現でサクっとまとめてしまいたい。
• URL(ドメイン)ごとに非表示タイトルを設定できるようにする
  • 強制フィルタのために内部的には実装されていて、インターフェースがないだけなので実現度は高めです。
  • 用途は…「anond.hatelabo.jp + うんこ」で定番の漏らしたネタを非表示にしたりとか。
  • 記事の質に偏りのあるニュースサイトで特定のジャンルを弾いたりとか。
  • 要らないですかね？
• ポップアップクローズ時に変更内容を反映する
  • 現状はフィルタを追加/削除してもリロードしないと反映されません。
  • ただそれで問題ないような気もするのであんまりやる気はないです。

Permalink | 記事への反応(18) | 12:42

ツイートシェア

■エロサイトのアンテナサイト作ってみた

こんにちは。

こちらに投稿するのは3回目ですかね。

過去に書いた記事

■二次元系のエロサイトを作ったからいろいろ書いてみる 編集

https://anond.hatelabo.jp/20160225062051

■自動更新のエロサイトを作ったから自慢させて 編集

https://anond.hatelabo.jp/20150519124614

エロサイトばかり作ってます。

懲りずにエロサイトのアンテナサイト（システム含む）を作ったので投稿してみました。

作ったサイト

エロ萌え☆アンテナ

https://eromoe-antenna.link/

こりずにエロサイトです。

しかも今回はアンテナサイトという・・・

サイトを作ったきっかけとか

アンテナサイトは以前から作ってみたいとは思っていたのですが、何しろ情報が少ない。

既存の無料システムなどは使い勝手が悪かったり、そもそも(私が思う)アンテナサイトの体をなしていなかったりと、不満がありました。

なら「私が思う」アンテナサイトを作ってみようと思った次第です。

また、1度作ればシステムを流用でき、昔はやった2chアンテナサイトなども簡単に作れるという打算もありました。

（今は下火ですがそれでも収益を上げることはできるので）

※このシステムは実は数年前に完成させたのですがバグだらけで一度頓挫したのを、1から作り直したものなのです。

使った技術

PHP

CSS

JavaScript

MySQL

これだけです。

かれた技術だけで作りました。

仕様など

正直「アンテナサイトの仕様」という情報はあまりネット上にも書籍などにも落ちていません。

なので私が思う仕様を実装しました。

（有名サイトをみて「こうかな？」というのを整理しました。

• IN/OUTをカウントする
  • 同一IPからは一日1回のみカウントする
• IN率が高いサイトを優先的に表示する
  • まだ数字が集まってないので今はそれっぽく表示しています
• お気に入り機能
• 検索
• 人気記事ランキング
• 人気ブログランキング
• カテゴリ、タグ、月別アーカイブなどの絞込み
• ブログ別のアーカイブ
• 逆アクセスランキング
• 登録申請の自動化
  • 登録申請⇒確認メール記載のURLにアクセス⇒管理者の私に通知⇒許可したら登録 という流れにしてスパムの除去、登録、不可の効率化
• IN/OUTは日別、週別、総合で保存、それぞれcronで都度リセット
• SNS自動投稿

ですかね。

あとはDBにいろいろ情報をぶち込んだので、後々の仕様変更にも柔軟に対応できるようにしました。

今回のアンテナサイトつくりで、だいぶSQL文の勉強になりました。

DBの構造とかもWPなどのCMSを参考にリレーショナル？にしたとり、いろいろカスタマイズしやすくしました。

IN/OUTの比率に応じてアクセスを返す処理についてはかなり悩み、これはみんな情報を出さないはずだなーと思いました。

秘伝のタレ的なものですよ・・・結局「こんなかんじかなー」というのを他サイトや経験を元に推測して実装しました。

都度様子を見て変更するかもです。

こだわりの点など

お気に入り機能や、検索機能については結構実は力を入れています。

検索機能は実は一番時間をかけています。世の開発者様はすごいですね。

https://eromoe-antenna.link/search.php?page=2&category=3

例えばカテゴリ3の2ページ目を表示、といった複数のパラメータを持つ検索条件をどうやったらMySQLで取得するか、といったことや、

それをページャーにどうやって落とし込んでやれば良いのか、といったことがわかりませんでした。

普段WPを使っているので意識してなかったのですが、こういうところも自作システムの悩みどころですね。

あとはIN/OUTでの処理をするにあたり、一通りの情報をDBに保存することで、後々いろいろ応用を利かせられるように設計しました。

その他には管理画面を設けることで、サイトの更新やお知らせの投稿などを、WP並にとはいいませんが簡単に行えるようにしました。

デザインについて

完全自作です。

もともとPhotoshopで作っていたものがあったのですが、数年前に作ったものだったのでそれを基に開発を進めながら調整していきました。

スマフォサイト対応もしています。

エロサイトっぽく？ピンクを使ってますが、正直もう少しやりようはあったかなーって思っています。

システムさえできてしまえばデザインは後から変更し放題なので後々の課題ですね。

その他

作るのに1年以上かかってしまいましたが、何とか1システム完成させることができました。

おかげでだいぶ力がついたのではないかと思っています。

今まではWPでサイトを作ることが多かったので、1からシステムを作り上げて完成させるといった経験は実は皆無だったので、楽しかったです。

今は沢山のOSSや無料ツールがあるので、自作する必要性も減ってきているかもしれませんが、実は自分がほしい機能ってピンポイントで無かったりすることも多いのではないでしょうか？

そういったときには是非皆さんも自作ツールを作ってみてはいかがでしょうか

以上、宣伝がてら、普段お世話になっている匿名ダイアリーにいろいろ書いてみました。

ご意見、ご感想などあればコメントとかくれるとうれしいです。

※サイト登録申請もお待ちしています！

https://eromoe-antenna.link/register/

Permalink | 記事への反応(0) | 15:39

ツイートシェア

■http://anond.hatelabo.jp/20161209101721

表示されたものをフィルタリングするだけだから前増田の言うとおり「削除したぶんの補充」が出来ない。

なのでオートページャーを組み合わせるか、GoogleのAPIを使って別にサービスを作るしかない。

ドメインNGは -site:xxx.com で出来るから、それを検索ボックスに自動入力するとかはできるかもしれない。

でもどちらにしろ続々と登場するクズサイトを手動でブラックリストに登録していくイタチごっこなので効果は薄い。

Permalink | 記事への反応(1) | 10:21

ツイートシェア

■はてなブログで増田分かった事湖タッカ和田酢魔でグロ鮒手は（回文）

ちょっとお勉強してたの。

1. 一日に投稿できる数は100。
2. インポートした記事は、記事編集画面で一度更新しないとスマホで表示されない。
3. 投稿時間がまったく同じ記事だと、記事ページ内に記事一覧やページャーが出てこない。
4. エクスポートした記事データは順番が違っても、投稿日時で記事管理画面ではソートされる。

いろいろ勉強になるわ！

でも一番思ったのは、

はてなブログをもってしても

一日に投稿できる数は100でマックス決まってるのね！

ライドンタイム！

ライドン！ライドンタイム！

マックス姉さんに知らせなくっちゃ。

あと面白かったのは、

エクスポートしたデータは取り消せるってこと。

そして一番困ったのは

記事ページ内に「新しい記事」「古い記事」って出てこない理由が分からなくって

テンプレートが問題かと思ったら、

調べたらそう言うことだったわ！

いろいろ勉強になったわ。

あと欲しいのは書いた増田のエクスポート機能ね！

うふふ。

今日はいつになく真面目な話ね。

ブログもマネー・タ・イズムよ！

今朝の朝ご飯はリッチサンドウィッチよ。

厚切りハムサンドに

彩り野菜サンド、

三度拝んで召し上がれ！

デトックスウォーターは

昨日は寒かったから

朝の麦茶ウォーラーはちょっと寒いわね。

カーデガンをプロデューサー巻きで持って行きましょう。

オフィスの寒さ対策よ！

すいすいすいようび！

今日も頑張りましょう！

Permalink | 記事への反応(0) | 09:41

ツイートシェア

■http://anond.hatelabo.jp/20160419210029

届くかどうかわからないけど

最近このサイトで通勤時に英語練習してて、楽しんでます

http://wordchunk.azurewebsites.net

自分の使い方はちょっと意図とは違っていて、

英単語に対して英語でどう説明するか、を練習するのにいいなと思ってます

単語はレベルわけされているので、aからすべての説明を読んで、自分ならこう説明する、みたいな感じで進めています

なので実は絵は見てなかったりします

ところで、最近のアップデートで困ったことがあります

自分が見たい単語がタップできなくなったように思います

（PCでもスマホでも）

文字もレイアウトが崩れていて、端の単語は見えません...

ページャーも自分では送れないです...

単語を順に再生するボタンも追加されたようですが、これはどうやって止めたらいいでしょうか...

最低限期待することは、

• 単語を自分で選択できること（選択したらその単語に対応した説明がでること）
• 選択できる単語がテーブルに収まっており、視認できること
• ページ送りが可能なこと

です

機能や見やすいUI/UXが追加されることは喜ばしいのですが、上記が使えなくなるとちょっとツライです...

おかげさまで英語の勉強を楽しくできておりますので、どうぞお願いします

Permalink | 記事への反応(1) | 12:51

ツイートシェア

■Vimのキーバインドを忍ばせる人々

(Qiitaのほうに2019年版があるので今はそちらを…。こちらは2015年版な感じです。)

Vim(あるいはvi)のキーバインドを提供する人がいる。

Vimの外でもVim風の操作ができたりするのは彼らのおかげだ。

デフォルト、オプション、プラグイン、アドオン、様々な手段で提供されている。

Vimを使っている人でも使うかどうかは人それぞれだし、

どの程度Vimを再現できているのかも実装によってまちまちなのだが、

なんだかんだで有名どころのテキストエディタや統合開発環境では何らかの形で提供されることが多くなったように思う。

以下は提供しているソフトウェアの一覧。

(一覧に無いものは私が知らないか忘れているだけなので、実際にはまだあると思う)

他にもブラウザ向けのアドオンとか。

いくつかのコマンドでも。

hjklでスクロールできるWebサービスとか。

ゲームも。

追記

＞ viのhjklは先行する何かの影響で実装された記憶があるので、操作が共通だからというだけで「viを忍ばせる」というのは言い過ぎではないかという気がする

＞ まして「vimを忍ばせる」というのは、ちょっとその、まあなんというか…

確かにVimではなくviの模倣だったりして無理があった…。hjklの大元を辿るとどこに辿り着くんだろう(ビル・ジョイの使っていたキーボードとは別？)

Permalink | 記事への反応(1) | 16:54

ツイートシェア

■突貫ではてな匿名ダイアリーのChrome拡張作った

https://chrome.google.com/webstore/detail/masudalert/clkiaalhgfhgcllngddndbghoaahhnfa

当方デザインできないので見づらいのはご愛嬌。

とりあえず自分が投稿した日記にトラバやブクマがついたらわかるようになってます。

現時点で申請後にいくつか修正したので、バージョン1.1を申請してます。

できればバージョンを見て1.1であることを確認してからいれてください。

仕様は下記のような感じ

• はてなIDを登録
• 5分おきに自分の投稿ページをスクレイピングして各記事のトラックバック数とブクマ数取得（Chromeで増田にログインしている前提）
• 収集したトラバ数/ブクマ数はそれぞれ保存しておく
• トラバ・ブクマが0以上かつ以前保存されている数より大きい場合はバッジカウント追加
• ページャーも処理する
• 記事が1ヵ月以上前の場合は無視
• ポップアップ表示したらバッジはクリア
• ポップアップには新規トラバ/ブクマがあった記事へのリンク

なんかフィードバックもらえると嬉しいです。

http://anond.hatelabo.jp/20150201190857

--

（追記）：いろいろトラバやブクマありがとうございます。

火狐版は簡単そうならやろうかと調べてみました。どうやらFxはバッジないんですね・・・。

メールみたいに常にページを開いておいてもらって、タブで通知するとかはアリかもしれませんが、自分があまりFx使わないので正解がわかりません。

Github にソースもあげたので誰かがやってくれるのを期待します。

https://github.com/katsuren/masudalert

--

（追記2）

バッジがあがってきても、どの記事なのか、トラバなのかブクマなのかわかりづらかったので、

リンクに見出しとトラバ/ブクマ数を表示するようにしておきました。

version 1.3 にアップデートお願いします。

エンジョイ増田ライフ！

--

（追記3）

ついでに各記事に返信リンクを追加する機能つけました。

トラバつけるときにコピペするの面倒だったので。

こんな感じでよければ iOS とか Android とか作ります。多分。

Permalink | 記事への反応(8) | 04:26

ツイートシェア

■【急募】WEBディレクター兼エンジニア【60万円】

仕事内容

Pinterestもどきの画像ソーシャルサイトgazou.comのディレクション＆開発。

(ベーシック認証がかかっています。）

現在の完成度70％くらい。年内のリリースが目標です。

サイトは以前制作した↓のサイトがベースになってます。

WEBサイトを発注してみた。

http://anond.hatelabo.jp/20120318122617

応募要件

WEBサイトのディレクションの経験のある方（改善の指摘､提案)

WEBサイトをリリースまで面倒を見てくれる方

発注者の要望をエスパーできる方優遇！

開発環境:cakePHP

募集期間

一週間くらい

参考にしたサイト

Pinterest

tumbler

はてブ

はてなフォトライフ

ついっぷるフォト

報酬

600,000円(税込)

(内訳はディレクション20万、開発30万、リリース後1週間のサポート10万で見積もっています)

どんなサーバー構成にしたら良いか分からないのでサーバー構築を10万くらいで

外注しようと思っていますのでサーバーの構築も可能でしたらプラス10万になります。

サーバー代は月5万円を想定。現在はさくらの安いVPSを使ってます。

ここがスゴイ

なんとドメインが激レアgazou.comです！

海外のドメインオークションで運良く15万で落札しました。(他に入札者がいなかった)

ドメイン名負けしないサイトを作りたいと思いますので宜しくお願いします。

資料

初期の企画書＆ワイヤフレーム

http://oi.jpn.org/files/gazou2.xls

TOPページ

http://oi.jpn.org/files/top-page.jpg

今までの仕様まとめ

https://docs.google.com/spreadsheets/d/1Rg8Fosxw_qYO5MW6QTNMvuBzsZ2qkTRyGvI2Mux01Og/edit?usp=sharing

連絡先

twitter @hhungry

obinat2@gmail.com

普通のサラリーマンで深夜帰宅が多いためレスポンスが悪いです･･･

とりあえずサイトを見てみたい方はお気軽にご連絡ください。

1年近く前からWEBサイトを制作してるのですが、自分のディレクション能力が低く

なかなか完成の目処が立ちません。修正したい部分を外注のエンジニアやデザイナーに

どう伝えたらよいのか、自分でもどう修正したら良いのか分からないことが多く難航しています。

基本的な機能(タグや画像投稿)はベースサイトに実装してあったので2,3ヶ月で制作できると

考えていたのですが甘かったです･･･

100％の完成度をを目指してるわけではありませんが、リリース後に大きなシステム変更は

できないので破綻しないよう基本機能を実装してからリリースしたいです。

なんで増田で募集？

ランサーズでデザインの発注をしたのですがWEBサービスにあまり詳しくない方だったので

WEBサービスに詳しい人が多そうなはてなで募集してみることにしました。

例えば一般的な通知ボックスの実装で

1.ボックスがボタンの下に隠れるので最前面にする。

2.プルダウンが左端だとメッセージが見切れるので右端にする。

3.ボタンクリックでトグルにする。

と仕様の説明が必要でした。

↓１月にランサーズにデザインを発注したときの案件です。

新規ウェブサービスのデザイン UI設計

http://www.lancers.jp/work/detail/255520

実装済みの機能

ソーシャルログイン、画像アップロード、Taberarelooからの画像投稿、

ブックマークレットからの画像投稿。

修正したいところ

・画像ページにコメント欄の追加。(ベースサイトのコメント欄機能を転用)

・ユーザーページがなんか変。

・サイト下部のページャーが変。

・荒らし対策、

・アダルト画像対策

(特定のアダルトタグが付くと「R-18」タグが付いて、画像を表示･非表示する設定はできています)

・タグの登録・削除がスマートじゃないので修正。(Gmailのラベルみたいな感じがいい)

・URLがスマートじゃない★重要★

e.g. ttp://gazou.com/members/uploadlist/4309

・サイトの細部修正

金額内に収まらない修正は妥協可能です。

サイトリリースまでの道筋を作ってください！

Permalink | 記事への反応(0) | 21:52

ツイートシェア

■夏休みの宿題的にサラリーマンがアンテナサイト作ってみた （技術的

とある日記の続き。というよりもより裏側。

サーバ構成詳細

nginx+php-fpm+Mysqlで作成。

それぞれ、もっとも遅いとおもわれる構成になっています。

nginxはキャッシュつかってませんし、php-fpmはインストール後のデフォルト状態、

Mysqlはインデックス適当でQueryCacheもOFFの状態…

それでもシンプル構成であればそこそこ性能でますし、

前半で書いたとおり、サイトのスピードは現状adsenseの表示スピードに

引っ張られているので、このまま。

サイト遅くなったら鯖引越しするくらいの勢いじゃないと、

夏休み中に作成が終わりそうにありませんでした。

サイト構成

トップページ

　->aboutとかその辺

　->各ゲームカテゴリページ

　　->サイト一覧ページ

いろんなソシャゲのページを作りたかったので、

総合ページを作成して、そこから飛べるようにしてみました。

ただ、デザインの問題点に挙げられるんですが、

正直どうやって各ゲームのカテゴリページへ行くのか、

また総合ページに戻るのかがわかりにくくなっちゃいました。

反省点というか、改善しないといけない点。

ページ構成

WPやMTを見て、

１．ヘッダー

２．サイドバー

３．メインコンテンツ

３,５．ページャー

４．フッター

の４つのコンポーネントとして考えました。

またそれぞれ、総合ページからしか見られないコンポーネントと、

各ゲームカテゴリからしか見られないコンポーネントがあり、

それぞれのコンポーネントをユーザ関数ではなく、ファイルをincludeする形で

作成したことが反省点。

最終的なinclude用のファイルが18個…

正直ファイル分けすぎたorz

このあたりphpのプロの方はどうやって対処してるんでしょう…

ファイル+functionで分けてるんでしょうか…

また、総合ページとゲームカテゴリページのトップページのSQLの内容がぜんぜん違うため、

abbench（前半参照には情報だしてます）では秒間の処理可能数が倍（総合ページ100req/sec ゲームカテゴリ250req/sec）となっています。

細かく見ると、総合ページではカテゴリー一覧をselectした後に、記事リストをカテゴリーリスト別にselectしてますが、

各ゲームカテゴリページでは１回のselectで終わっています。

現在はゲームカテゴリは３つしか作っていませんが、将来的にはもちろん増やす予定ですので、

今後どんどん重たくなっていく見込み・・・

RSSフィードを取得するCronにあわせて総合ページのメインコンテンツ部分を静的HTMLにしていくのもありかなと。

そうすると負荷がかかるのは作成時の１回のみになるとおもいますので、ユーザさんから見たら早いページ表示になるかと。

ただし、総合ページってどれくらいの人がみられるんですかね…

機能について

巷のアンテナサイトさんは、ハテブのブックマーク数やtweet数などのSNSの評価数や、あとで読む機能、

特定のサイトを非表示にする機能など、結構いろいろな機能が付いてます。

今回は夏休み終了に間に合わせるために、というのもあって、ばっさり機能を落としましたが、

こういう機能って必要なんですかね・・・？　個人的に使ったことがないもので・・・

そういうニーズがあればつけてもいいとおもっているのですが、現状遅いサイトをさらに遅くはしたくないので、

adsenseを１個にして機能をつけるくらいなんでしょうかねー。

adsenseまったくなしだと、鯖代の維持がもったいなくてサイト閉めちゃう方向に動きたくなっちゃいますし。

今後のサイト変更に関して

プログラムのリファクタリングとデザインの変更は必須だなとおもっています。

とくにデザインは早いうちにどうにかしないといけないんですが、

これだけは自分のスキルにないので、そのうちLancersのお仕事一覧にのっちゃうかも…

そのときは見られた方よろしくお願いします。

プログラムのリファクタリングに関しては、

もちょっといろいろなサイトを見て回って、構想を深めたいのですが、

個人レベルでの大規模サイトって、なかなかノウハウないんですよねー。

ある程度たまったら、こうしてみたらいいじゃない？ってのをまたここに書ければいいなぁとおもっています。

ブログを作るのは苦手だからね。放置しちゃうだろうし。

最後に

以上、長々とサラリーマンの日記を見てくださってありがとうございました。

（なんか規約違反で通報されたので、サイトURLと前半の日記へのリンクはなしでお願いします。

　というより、ここまで書いててなんだけど、増田って書くの初めてだから正直どういうルールかわかんね

　サイトちゃんと完成したぜひゃっはー！！！な状態だし。これで艦これ、何も気にせず遊べるし。）

Permalink | 記事への反応(0) | 22:47

ツイートシェア

■元ゴミ回収ドライバーが作るエロWebサービス

まったくの素人がNginx＋Bootstrap＋WordPressでWebサービスを作成しました。

影響を受けたサイト

オシャレエロサイト「h300」をリリースして、10万PV/日を捌くためにやったこと

http://d.hatena.ne.jp/inouetakuya/20120410/1334058296

週6フリーターもWEBサービス作ってみました。

http://anond.hatelabo.jp/20120914214121

はてブをもっと快適に！「みんなのはてブ」を公開しました。

http://anond.hatelabo.jp/20120930171125

--------------------------------------------------------------------------------------------------------

35歳　今は事務系の仕事をしてます。たまに運転。限りなくパートに近い労働条件ですが、

仕事がないよりはマシですので、続けているわけです。

前（5年ぐらい前）からWebサービスみたいなものを自分自身で作ることができたら楽しいだろうなぁと。

TwitterとかFacebookとか数回利用したことはあるけど、詳しいことはさっぱり。

朝6：00から夜18:00まで車を走らせてゴミ回収をしていた者です。

パッカー車って知ってますか。街でよく見かけるゴミ収集車のことです。

産業廃棄物というのでしょうか。スーパーとか

ドラッグストアとか回るんですよ。休憩時間は15分ぐらいなんですよ。一日。馬車馬のように働いていました。

そのパッカー車で物損事故を起こしてしまい、会社に居続けることはできなくなり仕事をやめました。

エロはもともと好きだったのですが、車を運転する以外の技術は持っていません。

何か手に技術を身につけたいと考えるようになりました。ただ３０歳も過ぎたおっさんにあまり時間はないので、

資源の集中を意識し時代の流れはパソコンだということで、始めたわけです。

はじめはHTML,CSSの本で基本的なホームページ制作を学ぶ。

HTMLが骨組みで、CSSが装飾みたいなイメージを持つ。

作成したエロサイト

エロックス

http://panpanwatch.net/

サイト構成

-----------------------------------------------------------

• データベース

MySQL

• Webサーバ

Nginx+PHP-FPM proxy_cache

• デザイン

Bootstrap

• テンプレート

Smarty

• CMS

WordPress

• スクレイピング

PHP　SimpleHTMLDOMParser

• DMM　APIから新着情報

FeedWordPressを使ったエロブログ更新情報

-----------------------------------------------------------

Webサービスを作るにはプログラミングが必要なことは知っていたけど、初めてみて暗号のように思える。

プログラミングの中でもPHPは簡単なのでしょうか？最近の流れからすると、Rubyなのでしょうけど、

習得しやすいと,聞いていたPHPを始めることに。

PHPは自分の実現したいサービスが組み立てやすい気がします。

参考にした本

西沢直木のPHP Webアプリケーション　スーパーサンプル

http://www.amazon.co.jp/gp/product/toc/479733245X/

手を動かしてプログラミングを入力することは重要だと知る。

PHPだけでは動かなくてMYSQLとかデータベースを勉強。

PHPとMYSQLの知識で就職できるのでしょうか？

小さいプログラムからテスト、テストを繰り返すことで、

foreachやif,forなどの基本的な使い方を身につける。

プログラムは結局小さいプログラムの集まりだとどこかに書いてあった。ことを思い出す。

PHPはベタのプログラムだどセキュリティ的に弱いということでPEARを使うように。

データベース接続はMDB2

ページャーはPager

PHPのテンプレートエンジンSmarty

ほかのプログラミング言語は知りませんが、PHPerというらしい。

プログラムに慣れてくるとPEARライブラリなどのクラスに抵抗がなくなってきた。

それでも、オブジェクト指向という考え方を体で理解するまで時間がかかる。

PHPについて参考にしたサイト

----------------------------------------------------------

• ＰＨＰ入門サイト

http://php.xenophy.com/index.html

• 組長的PHP入門

http://kumicyou.sakura.ne.jp/php/index.html

オブジェクト指向PHP入門講座

http://www.objective-php.net/

• PHPによるWebアプリケーションスーパーサンプル 第2版

http://www.amazon.co.jp/gp/product/toc/479733245X/

• PHPによるWebアプリケーションスーパーサンプル活用編

http://www.amazon.co.jp/gp/product/toc/4797367571/

----------------------------------------------------------

PHP以外にも参考になったサイト

ドットインストール

http://dotinstall.com/

----------------------------------------------------------

Simple HTML DOMParser メモリーオーバー？が発生するので頻繁には使えない。

正規表現って便利ですよね。（preg_match("/ab/", $string);など）

Webサイトのどんな情報でも切り取ったり、貼りつけることができるので。

Web上で特定の情報を好きなように集めてきて、加工することができるスクレイピングを発見。

PHPでスクレイピングするにはどうしたらいいか考えるようになり、かなり時間を使いました。

スクレイピングするために考えた流れ

該当URLのサイトマップからリンクページ（aタグ）をすべて取得する。

リンクページの中でエロ動画が含まれているページだけ抽出。

ページの中にあるエロ動画URLやサムネイル画像などをファイルへ出力。

ファイルへの書き込みは以下のようにしました。

$fp = fopen("/var/www/html/sample.txt", "a");
fwrite($fp, $title."\n");
fclose($fp);
}

出力したファイルの中で重複データなどないように一つにまとめて使えるように加工する。

あらかじめCronで時間を指定してファイルの情報をデータベースへ投入。

これから欲しい情報は、著作権に気をつけながらスクレイピングして集めてくると楽しいなぁと思ってます。

自分でホームページを公開するためにはサーバーが必要なことは以前から知っていたのですが、具体的には手探り状態からで

サーバーについて参考にしたサイト

CentOSで自宅サーバー構築

http://centossrv.com/

サーバはレンタルサーバとか専用サーバなどいろいろあるのですね。

全部自分で管理しないといけないため、めんどくさい気がした。結局VPSサーバに。

エロサイトとは言え、web表示スピードにこだわりはじめる。

スピードアップのためにやったこと。データベースとアプリケーションサーバを分ける。

データベース最適化、query_cache_sizeを設定したりなど。

参考にしたURL

自分でWEBサービスを作りたいと思っている人へ

http://anond.hatelabo.jp/20101203150748

ウェブ開発者のための、1時間でできるLAMP環境構築術（CentOS編）

http://tanaka.sakura.ad.jp/2011/05/centos-linux-apache-php-perl-mysql-lamp.html

定番のPHP MYSQL Apacheから調べていくとNginxというWebサーバが高速だという

記事が多いので、使ってみることに。

Nginx　エンジンエックスというらしい。

NginxだけではPHPは動かない。php-fpmをインストール。

しかし、proxyサーバ設定がよくわからず。

Nginxについて参考にした記事

------------------------------------------------------------------------------------

• CentOS-6へ最新版のnginxを3分でインストールする方法

http://d.hatena.ne.jp/yoshi-ken/20120205

• WordPressを100倍速くする！ MySQLの調整やnginx proxy cache

http://kray.jp/blog/wordpress-tuning/

• apache のかわりにnginxを使ってみる(2) php-fpmをインストールする

http://server-setting.info/centos/apache-nginx-2-php-fpm-install.html

• さくらVPSのWordPressをチューニングして30倍高速化した方法

http://hara19.jp/archives/5817

• ブログ(WordPress)の高速化 apache + php53 -> nginx(proxy cache) + php-fpm + apc

http://tech.aainc.co.jp/archives/3022

------------------------------------------------------------------------------------

以上の記事でNginxのproxyを設定することができ、とても参考になりました。

PHPで作られたCMSを知る。WordPress

どうにか既存のサイトをWordPressで作れないかと考えていたら、

WordPressは固定ページとブログ用のページを分けるテンプレート構造だと知る。

WordPressはindex.phpファイル一枚あれば動くらしく、ページを表示する優先順位があるらしい。

　　　　　　　　優先順位　高い　　　　　　　　　　優先順位　低い

メインページ front-page.php →　home.php 　→　　index.php

そのため、fromt-page.phpに自分で作ったSmartyをそのままコピペして,なんとか既存のサイトとWordPressをミックスさせることに。

詳しくは以下の本が参考になりました。

• 本格ビジネスサイトを作りながら学ぶ WordPressの教科書

http://www.amazon.co.jp/gp/product/toc/479736758X/

WordPressのプラグイン

FeedWordPress 登録したサイトの更新情報表示

WordPress奥が深いです。

Twitter Bootstrapを知る。

スタイルシートなどを含めたデザインセンスがまったくなく、

途方にくれていたところ、CSSフレームワークのTwitter Bootstrapを知る。

HTMLに少し手を加えるだけで今っぽいデザインにできる。その分、余った時間をweb構築に集中することができる。

エロサイト各ページについて

• 動画ページ

http://panpanwatch.net/douga.php

データベースに登録してある動画すべて。

• DMM新着情報

http://panpanwatch.net/newdmm.php

DMM動画の当日配信が開始されたコンテンツをDMMのapiから収集。

• アダルト更新ニュース

http://panpanwatch.net/?page_id=5382

ネット上のエロ更新情報を収集して表示。メインはWordPressで構築。

--------------------------------------------------------------------

常日頃からネットのエロにはお世話になっていたので、なんか恩返しではないですけど、

形にすることができて、自分自身では満足してます。

Webサービス作るまで、ずっとパソコンの前ばかりにいたので、

少しパソコンから離れたい気持ちです。

01/22　追記。

こんにちは。みなさまからのブクマとコメントを多数いただき、ありがとうございます。

いろいろご意見あると思いますが、大げさな嘘などは書いていないです。

PHPを理解するのも、こちらの本を一冊やれば、それなりに理解できるようになりました。

• 西沢直木のPHP Webアプリケーション　スーパーサンプル

http://www.amazon.co.jp/gp/product/toc/479733245X/

次のサービスを作成するときは本格的なアプリケーションやソーシャルゲームなどやりたいなぁと

野望だけは持っています。ですけど、ずっとこのサイトだけに集中してきたので、今はパソコンから少しだけ距離を置くつもりです。

恐らくですけど、本物のプロの方から見れば、このサイトは大したことないでしょう。

素人の趣味でやっているんだと温かく見守ってください。

Permalink | 記事への反応(9) | 19:05

ツイートシェア

■http://anond.hatelabo.jp/20111003133059

それははてなが最近実装したオートページャーが原因じゃないかな。

Permalink | 記事への反応(0) | 15:26

ツイートシェア

■

はてブのお気に入りに公式オートページャー付いてたんだね。「次の20件」のとなりの四角いボタンがスイッチだよ。

Permalink | 記事への反応(0) | 00:57

ツイートシェア

■ウェブサイトでよく使われるデザインや機能の呼称のまとめ

「あちこちでよく見かける『あの機能』を実装するためにCSSのテクニックとかJSのライブラリとか探したいんだけど、どういうキーワードで探したらいいのかわからない…」という人向け。

注意

※この呼称が正しいとは限りません

※この呼称に統一されているわけではありません

ブロック要素等の角を丸める

→ 角丸

複数の画像を一枚にまとめてCSSのbackground-positionで制御する（メニューのマウスオーバーなどでよく使われる）

→ CSSスプライト

フォームにうっすらと説明文が表示される ＆ フォームにフォーカスすると消える

→ プレースホルダー

フォームに入力された文字にあわせて入力候補を表示する

→サジェスト

ページ内リンク等をクリックした際に滑らかにスクロールさせる

→ スムーズスクロール

他のメニューを押しのけるようなアニメとともにサブメニューが表示される ＆ 開いているメニューは常にひとつだけ

→ アコーディオンメニュー

メニューの横にある＋マークなどをクリックするとその下にサブメニューが表示される ＆ 複数のメニューを開くことができる

→ ツリーメニュー

水平メニューから垂れ下がるようにサブメニューが表示される

→ プルダウンメニュー

横一列に並んだアイテムをスクロールバーでスライド表示 ＆ アイテムが床面に反射したようなエフェクト

→ カバーフロー

水滴のように光沢のあるデザインのボタン

→ アクアボタン

画像のサムネイルをクリックするとオリジナルサイズの画像が画面中央に表示される

→ ライトボックス

警告ウィンドウ等が画面中央に表示される ＆ その他の操作を受け付けない（※指摘を受けて追記しました）

→ モーダルボックス

説明文等が書かれた小さな吹き出しをマウスカーソルの隣に表示させる

→ ツールチップ

タグをアルファベット順に並べる ＆ その使用頻度等に応じてフォントサイズや色を変えて表示する

→ タグクラウド

ひとつの記事を分割してページ番号を振る

→ ページャー、ページネーション

フッター部分が常に最下部に固定されている

→ フッタースティック

Permalink | 記事への反応(2) | 12:14

ツイートシェア