slideshareAPI
使い方
http://asklife.info/archives/2119
○必須項目 api_key :登録するとメールで届くapi_key ts :unix時間(phpならtime()関数) hash :メールで届いたsecretにtsの時間をくっつけたものをhash()関数でsha1アルゴリズムを利用してハッシュ化した値
1.javascriptで作りたい
[SHA-1アルゴリズム]※js版
[xmlhttprequestでエラー]
「XMLHttpRequest cannot load xxxxx Origin xxxxxx is not allowed by Access-Control-Allow-Origin」が出たので
対応したい。
[対処策]
http://www.muratayusuke.com/2011/05/28/access-control-allow-origin/
http://tomio2480.hatenablog.com/entry/20120922/1348262110
同一生成元ポリシーが、解消できないので
動作遅くなりますが、一度サーバを経由させて取得させることにしました。
[処理の流れ]
1.Javascript(GET送信)
2.PHP(サーバ) APIでデータ取得しJSON生成
3.Javascript(JSON取得)
4.HMLへ展開
Javascript コンストラクタ・プロトタイプ
前に買った、オブジェクト指向Javascriptという本を使って
勉強中。
- 作者: Stoyan Stefanov,水野貴明,渋川よしき
- 出版社/メーカー: アスキー・メディアワークス
- 発売日: 2012/04/13
- メディア: 大型本
- 購入: 1人 クリック: 124回
- この商品を含むブログ (1件) を見る
node.jsやりたいんだけどまずJavascriptの基礎を固めておかないと
ついていけねえ。。。と思ったので。
勉強の為に書いたコードを自分のメモ代わりに載せておく。
あとで見返せるように。。。
//5.1 コンストラクタ 特殊なプロパティ //[持っている内容] //--------------------- //arguments: //引数 //caller: //どの関数から呼ばれたか //length: //要素数 //name: //関数名 function test(a,b,c){ return a * b; } console.log("テスト関数 length:" + test.length ); console.log("コンストラクタ:" + test.constructor ); //5.1 プロトタイプ function Gadget(name, color){ this.name = name; this.color = color; this.whatAreYou = function(){ return 'I am a ' + this.color + ' ' + this.name; } } //関数に、プロパティを追加できる。 Gadget.prototype.price = 100; //プロパティ追加 Gadget.prototype.rating = 3; Gadget.prototype.getInfo = function(){ return 'Rating: ' + this.rating + ', price:' + this.price; }; //メソッドを追加 var g = new Gadget( 'aren', 'red' ); console.log( "プロトタイプ price:" + g.price ); console.log( "プロトタイプ raitng:" + g.rating ); console.log( "プロトタイプ name:" + g.name ); console.log( "プロトタイプ getInfo:" + g.getInfo() ); Gadget.prototype.get = function(what){ return this[what]; }; console.log( "プロトタイプ get:" + g.get('price') ); //関数内のプロパティを探してなければprototypeのプロパティを検索する //優先順位は、関数内のプロパティ > prototypeのプロパティ
Javascript googleスプレッドシートを全取得
googleスプレッドシートの、存在するシート全て取得する
プログラムを書いてみたが、$.ajaxで複数ファイル取得した後の
処理にどう引き継げばいいのか分からない。
タイマー仕掛けて$.ajaxの複数ファイルコールバック処理の
完了を待った後、次の処理をスタートするという形になるんだろうか。
。。うーむ。
↓参考にさせていただいたサイト
[CSV解析]
http://liosk.blog103.fc2.com/blog-entry-75.html
カラム内の改行にも対応したCSV解析
[ユニーク配列取得]
http://javascripter.hatenablog.com/entry/20080730/1217413682
※今回のソースには、入ってないけど勉強させてもらいました。
//CSV解析 function parseCSV(text, delim) { if (!delim) delim = ','; var tokenizer = new RegExp(delim + '|\r?\n|[^' + delim + '"\r\n][^' + delim + '\r\n]*|"(?:[^"]|"")*"', 'g'); var record = 0, field = 0, data = '', qq = /""/g; text.replace(/\r?\n$/, '').replace(tokenizer, function(token) { switch (token) { case delim: data[record][++field] = ''; break; case '\n': case '\r\n': data[++record] = ['']; field = 0; break; default: data[record][field] = (token.charAt(0) != '"') ? token : token.slice(1, -1).replace(qq, '"'); } }); return data; } templatelist = { template:[], //スプレッドシートの取得 getspreadsheet:function(gid){ var gspreadsheetUrl = "https://docs.google.com/spreadsheet/pub?key=キー&single=true&output=csv&gid="; $.ajax({ url: gspreadsheetUrl + gid, type: 'GET', dataType: 'text', cache: false }) .done(function( data ) { var csv = parseCSV(data); console.log(csv); //次のシートを読み込む gid++; templatelist.getspreadsheet(gid); }) .fail(function( data ) { console.log("失敗:"); //処理がここから続く }); } }; //googleスプレッドシート取得 templatelist.getspreadsheet(0);
Javascript徹底攻略 第3章[写経]
Javascript徹底攻略の、第3章 MVC入門編のソースを写経。
JavaScript徹底攻略 (WEB+DB PRESS plus)
- 作者: 沖林正紀,吾郷協,高橋征義,名村卓,桜井雅史,縣俊貴,太田昌吾,天野祐介,飯塚直,佐藤鉄平,冨田慎一,WEB+DB PRESS編集部
- 出版社/メーカー: 技術評論社
- 発売日: 2013/01/26
- メディア: 大型本
- 購入: 7人 クリック: 69回
- この商品を含むブログ (6件) を見る
[URL]
http://bzz0217.sakura.ne.jp/sample.html
[メモ]
jQuery.grep 指定された関数で配列をフィルタリング http://stacktrace.jp/jquery/api/utilities/jquery.grep.html
list.shift(); 配列の先頭のインデックスの削除 http://www.scollabo.com/banban/jsindex/sample/sample_263.html
jQuery.each 汎用的な繰り返し処理 http://semooh.jp/jquery/api/utilities/jQuery.each/object%2C+callback/
これからやりたい勉強/勉強進捗
とりあえずやりたい事適当に書き殴ってるので、
順序は前後するかも。。。
Javascript
1.node.jsでチャットシステムを作りたい
■2013/11/05 さくらvpsにインストール
のつもりが、まずteratermでログイン出来ねえ。。
使うの久しぶりで、開始で萎える。。
初心者には、ここが分かりやすい。
http://www.xn--vps-073b3a72a.com/
何故かteratermから繋がらないので
OS再インストールorz
ぎゃああ、そういえばTCPポート変えてたの忘れてた。。
そりゃ繋がらんはずだわorz
OS再インストールしても、teraterm繋がらない、なんでだと
思ってたら、さくらのヴァーチャルコンソールでCentOSのバージョンを
指定した後でないと駄目のよう。ここで嵌った。
とりあえず、今日は上記サイトの8.webページの設定まで。
■2013/11/06 やっとさくらvpsにnode.jsインストール
昨日の続きを朝からスタート。
PHP/MySQLをインストールする。
その後、下記サイトを参考に、node.jsを入れる。
http://www.mztm.jp/2013/05/27/sakuranodejs/
http://netdiever.com/archives/12224
foreverまで入れたので、次はやっと本題のチャットシステムを
作る。
■2013/11/07 node.jsを使う
node.jsをインストールしたはいいものの、
何故か動かない。
http://netdiever.com/archives/12224
上記サイトを参考に設定してみると
動いた。
とりあえず、「Hello Node」を表示させることは成功
でも、このままだとコンソールから抜けると
動かなくなってしまうようなので、デーモン化
foreverを使う。
で、念願のチャットシステムを動かしたいということで
サンプルがあったので、動かしてみる。
http://wise9.jp/archives/4218
だが、エラーになってしまい動かない。何故だ。。。
node.jsの仕組みがぜんぜん分かってないので
どうすればいいのか見当もつかない為、基礎学習は行っておかないと
マズイなと思った。
なので、いきなりチャットシステムの構築はせずに
まずは一歩初心の道を進んで生きたい。
2.開発環境を整える
■テストで便利
QUnit/Jasmine/Sinon.js/PhantomJS/js-test-driver
3.MongoDBを使ってみる
4.Javascript徹底攻略本
1.まず写経
●第2章 MVC入門編 アイスクリームショップ
http://dash.hatenadiary.com/entry/2013/11/08/021103
2.内容を理解
3.実践
PHP
1.WordPressを使って自分好みのブログを作ってみる
■2013/11/07 wordpressをさくらvpsにインストールしてみる
簡単だった
wp-config.phpのDB名やユーザ名の修正は必要ですが。。。
http://goo.gl/3yEXlb
作ったwordpressサイト↓
http://133.242.184.146/wordpress/
2.セキュリティを学ぶ
3.自分好みのアンテナサイトを作る
4.vim使いになる!
5.PHPエンジニア養成読本を読んでまとめる
CSS 勉強
前置き
CSS苦手。
あまり触ってこなかったのもあって
スタイル指定しても反映されなかったり
変な余白が出来たり、四苦八苦している。
なので、基礎についてしっかり 把握しておこうと思う。
基礎 セレクタ
読んだ。
いろいろ使えそう。
idセレクタ、classセレクタとは?:CSS入門
命名について
・英数字や、「-(ハイフン)」で作成しましょう。
・特殊文字や、機種依存文字は、使わないようにしましょう。
「_(アンダーバー)」も古いブラウザでは、使えない場合があります。
・漢字も、もちろん使えません。
・先頭の文字は、英字ではじめましょう。
・長過ぎると鬱陶しいので、端的な長さにしましょう。
・用途や位置が推測できる名前にしましょう。(header、navi、wrap、menu、main、entry、footerなど)
・小文字を推奨します。
優先順の指定は間違えやすいところ。 初心者が陥りそうなCSSの7の間違い
ブラウザ初期設定CSS
chromeの開発者ツールの「Element → Styles」で 「useragent stylesheet」が設定してもないのに、はじめから ついてるのが気になった。
ブラウザには、デフォルトスタイルシートというのがあり、
ブラウザによってあらかじめスタイルシートが定義されています。これによって、文章をHTMLで適切にマークアップをすれば、
適度な間隔を保つようになっています。
なるほど。
ブラウザごとにデフォルトスタイルシートがある
↓
ブラウザごとの誤差はこのせい
↓
デフォルトスタイルシート リセット要
CSS指定の優先順位について、まとめ
・CSSは後に書かれた指定ほど優先順位が上
外部ファイルCSSを読み込んだ場合も、後指定されたものが優先
・条件付きセレクタ・!important付き指定が例外となる
(1)詳細さにより優先度が決定
#outline #side #sidesubspace li a{略} こちらが優先
↓
#sidesubspace li a{略}
(2)「!important」を付けると優先度は増す。
・HTML上のCSSと、ユーザのCSS設定、ブラウザの初期設定との優先順位
「HTML内のCSS」>「ユーザ設定」>「ブラウザの初期設定」
※!importantをつけたユーザ指定
「!important付きユーザ指定」>「!important付きHTML内のCSS指定」>「HTML内のCSS指定」