2012年7月30日月曜日

[Rails][Ruby]初心者のためのRuby on Railsまとめ

このエントリーをはてなブックマークに追加 Clip to Evernote
Ruby超初心者がRailsを入れて勉強ー。
随時更新予定。

参考図書


■インストール編
[Rails][Linux]Railsをインストールする
【Windows編】Railsをインストール ※準備中
【Mac編】Railsをインストール ※準備中

■いろいろ準備編
[Linux]Railsアプリケーションを作成する
[Mac]アプリケーションを作成する

■入門編
[Linux]ちょっぱやでブログサイトを作る


■サーバ編
[Rails][Linux]Apache+Passengerを入れる

[Xcode]Xcodeをインストールしてみる。

このエントリーをはてなブックマークに追加 Clip to Evernote
RubyのアプデにXcodeが必要だというので、必要に迫られダウンロード。。
そのうちアプリも作りだそう。

※インストールは2012/09/12時点の情報です。

参考サイト
絶対に挫折しないiPhoneアプリ開発入門Part.1 ~Xcode4.2でひよしまるを作ろう~ http://d.hatena.ne.jp/kazukingband/20111123

まずはここからダウンロード
https://developer.apple.com/xcode/
App Storeからのダウンロードを選択したので、この画面が表示。
※App Storeのアップデートがあると、ダウンロードボタンを押してもエラーになるので、ソフトウェア・アップデートをかける必要がある

ダウンロードにはものすごーく時間がかかるので、根気よく待ちましょう。

で、ようやくダウンロードが終わってインストール
利用規約を読んで(英語だけどw)、agreeをポチ

ついでにインストールするものが表示されているっぽいので、おとなしくinstallボタンをポチ

正常終了画面が出たら完了。
Start1Using Xcodeボタンを押すと、こんな画面が表示される。

おおお。
これで完了!!
お疲れ様でした。

2012年7月15日日曜日

【Blogger】Gistにコードを上げてシンタックス表示させてみた

このエントリーをはてなブックマークに追加 Clip to Evernote

シンタックスがうまく効かないよー
と嘆いていたら、知り合いのSEの方に、『gistにコード貼って、ブログに貼り付けるといいかも』って教えていただいたので、早速やってみた。
流行りには載ってみようww

元コードはこちら

やり方

1. Gist にアクセスする。すると、こんなページが表示される。



2. Gist description に、適当な説明を入れる。
name this file には、ファイル名を。(多分、ダウンロードするときのファイル名とかになると思われる)
Languageは、表示させるコードを選択。今回はHTMLにしてみました。
で、コードをベタッと貼り付けてpublic で保存するとこんな感じに。

3.最後に『show embed』というリンクを押して、読み込み用のscriptタグをコピーしたらブログに貼り付け。こんな感じ↓



案外簡単だった!!
これならわざわざタグ変換しなくても済むから、今度からこっちにしよう

【本】「ノマドワーカーという生き方」を読んでみた

このエントリーをはてなブックマークに追加 Clip to Evernote
立花岳志(@ttachi) さんの『ノマドワーカーという生き方』が書店でもバカ売れしてるので、
どんなもんだろうと思って手にとったのが始まりです。
書評ってほどでもありませんが、読んでいての思ったことや気付きを書いていこうかと思います。


【気付き・思ったこと】

・アジャイルでチームを組んでいるような仕事の仕方を1人でやってる
立花さん自身はIT業界出身というわけではないみたいですが、フリーになって、自分で調べたり取り組んでみたりした結果、以下のようなカタチになったようです。


5年計画→年次計画→クォーター計画→月次計画→週次計画→日次計画


日次で『今日やること』をタスクリストから引っ張ってきて、仕事終わりに今日の進捗はどうだったか。
週次で、振り返りをして、月次計画に対する進捗はどうだったか。
振り返りの結果、計画に修正が必要があれば、見直していく。。。

という感じですね。


このやり方って、一人でもチームでも変わらないなぁ、とういかやりやすいんでしょうね。
アジャイルの考え方って、ITだろうとそうでなかろうと、誰でも出来るんだなと実感しました。


・ライフログを取る意味
最近、FacebookでもG+でも自分の写真を上げる人が多いなぁと感じてたわけですが、
自分のライフログとして上げてる人もいるんですねぇ。
個人情報垂れ流し状態だけど、大丈夫???って思ってたんですけど、本を読んで理解した時は衝撃でした(笑)
確かに、記憶は忘れてしまうから、残して見直してその時を振り返りたい!っていうことなんですね。
自分にはない感覚だったので新鮮でした。



・ブログを書くということ
私がブログを始めた理由は、自分の情報の集約場所が欲しかったからです。
G+で+1したり、Facebookでいいね押したり、twitterでつぶやいたり、いろいろSNSはやってるんですが、過去にやったことを探しても流れてなかなか出て来なかったり、結局どこいったんだっけ?的なことが多かったので、一箇所にまとめようと思ったのが始まりです。
ようは、まとめベタだったんですなw
まずは、ブログのミッションを決めて、優先度を決めましょう。
しょーもないことでも、書くことを習慣付けることが大事 っていうことが心に響きました。


【その他】
さすがに、毎日文章を書いている方だけあって、本は読みやすかったです。
個人的には、前半より、後半の戦略の部分に触発された部分が多かったのですが、
iPhoneユーザはより役立つツールがたくさん載っていて、いいなぁ~と思いました(笑)
※残念ながら私はAndroidユーザなので、Androidにあるアプリしか使えませんがw
クラウドと自分の仕事、生活をうまく結びつけて、活用している感じがしました。
本当にたくさんのアプリを使いこなしているので、私には出来るのか?って疑問ですがw

タイトルには『ノマドワーカー』という言葉が入ってますけど、
一般の会社員(広義ではノマドに入る人もいますが)でも、重なる部分だと思いますので、
ぜひ一読してはいかがでしょうか






【Blogger】ソーシャルボタンを配置してみた

このエントリーをはてなブックマークに追加 Clip to Evernote
Bloggerのデフォルトで表示されるSNSのボタンがイケてないなぁと感じていたので、
なんとかならんかなぁと調べて変えてみた。

参考サイト

Blogger にソーシャルボタンを設置する際に参考になったページとノウハウ
Blogger に Twitter & Hatena & Google+1 & Facebook のボタンを設置する
Bloggerへ各種ソーシャルボタンを各記事ごとに設置する方法

ホントはタイトルの下に配置したかったんだけど、
どこに配置すればよいのかわからなかったので、
とりあえず、コメント投稿のところに配置してみた。


<!-- Twitter & Hatena & Google+1 & Facebook -->
<div style='margin: 4px 0px 0px 0px;'>
<table><tr>
<td style='vertical-align:top;'>
<a class='twitter-share-button' data-lang='ja' data-via='自分のアカウント' href='https://twitter.com/share'>ツイート</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=&quot;//platform.twitter.com/widgets.js&quot;;fjs.parentNode.insertBefore(js,fjs);}}(document,&quot;script&quot;,&quot;twitter-wjs&quot;);</script>
</td>
<td style='vertical-align:top;'>
<a class='hatena-bookmark-button' data-hatena-bookmark-layout='standard' expr:data-hatena-bookmark-title='data:post.title + &quot; : &quot; + data:title' expr:href='&quot;http://b.hatena.ne.jp/entry/&quot; + data:post.url' title='このエントリーをはてなブックマークに追加'><img alt='このエントリーをはてなブックマークに追加' height='20' src='http://b.st-hatena.com/images/entry-button/button-only.gif' style='border: none;'/></a>
<b:if cond='data:post.isFirstPost'>
<script async='async' charset='utf-8' src='http://b.st-hatena.com/js/bookmark_button.js' type='text/javascript'/>
</b:if>
</td>
<td style='vertical-align:top;'>
<script src='http://static.evernote.com/noteit.js' type='text/javascript'/><a expr:onclick='&quot;Evernote.doClip({providerName:\&quot;&quot; + data:title + &quot;\&quot;, title:\&quot;&quot; + data:post.title + &quot;\&quot;, url:\&quot;&quot; + data:post.url + &quot;\&quot;}); return false;&quot;' href='#'><img alt='Clip to Evernote' src='http://static.evernote.com/article-clipper.png'/></a>
</td>
<td style='vertical-align:top;'>
<g:plusone expr:href='data:post.url' size='medium'/>
</td>
</tr>
</table>
</div>

案外簡単でしたー。

【Blogger】beautyOfCodeを導入してみた

このエントリーをはてなブックマークに追加 Clip to Evernote
やっぱりシンタックスハイライトは入れときたいよなーということで、
前回に引き続き Blogger カスタマイズ Tipsまとめ を参考にさせていただきました。

1.beautyOfCode.jsを読み込むようにテンプレートにコードを挿入
headタグの中にコードを入れましょう。
私の場合はheadタグの一番最後に記述しました。
jqueryを読み込むのを忘れずに(ちょっとハマったww)


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript">
<!-- jQuery / beautyOfCode-->
<script src='http://android-beryl.googlecode.com/hg/api/resources/jquery.beautyOfCode.js?r=b338c627a7179b4d9cb0258f7a719cc3917bf5a4'/>
<script type='text/javascript'>
//<![CDATA[
  <!--
  $.beautyOfCode.init({
  brushes: ['Xml', 'JScript', 'CSharp', 'Plain', 'Php', 'Ruby', 'Java'],
  theme: 'Eclipse',
  ready: function() {
  $.beautyOfCode.beautifyAll();
  $("#someCode").beautifyCode('javascript', {gutter:false});
  }
  });
  //-->
//]]>
</script>


2.ブログで使う場合

こんな感じで使うらしい。
codeタグの中に、XML/HTMLタグを書く場合は、変換ツールを使って記述しないといけないことに注意!
HTMLタグ変換ツール

<pre class="code">
  <code class="JScript">
   // ここにコードを書く
  </code>
</pre>

これで完了。


が、私のブログだとシンタックスが効かないのはどうしてだろう。。
原因は別にありそうなので、もうちょっと調べることにしよう。。。

【Blogger】テンプレートHTMLを編集してみた

このエントリーをはてなブックマークに追加 Clip to Evernote
いろいろBloggerのテンプレートを編集したいのだが、
どこをどー触っていいのか、よくわからなかったので、
基本的なところからまずやってみよー


ということで
ichi tasoさんの Blogger カスタマイズ Tipsまとめ 参考にさせていただきました。
(というか、ほぼそのままやってみたw)


このブログでやってみたのは、


Blogger テンプレート HTMLを編集
  1. テンプレートに使用言語を指定する
  2. ブログタイトルをクリックでトップページへLinkさせる
  3. Titleタグのブログ名と記事名の記述を変更する
  4. 記事内のタイトルにパーマリンク(Permalink)を付ける
  5. BloggerのNavバー(ナビゲーションバー)を非表示にする
  6. ガジェットのタイトルを「h2」から「p」タグへ変更する
の6つ(Blogger カスタマイズ Tipsまとめ とは番号が違いますのであしからず。。)

ざっとHTMLで触ってみた所感としては、
mobile版も一緒に書いてあるので、よくわからん感じになってたのかーということがわかった。

ただ、HTMLタグがどう記述しているか、なんとなくわかったので、
次はSNSボタンの配置をしてみようと思う。



2012年7月4日水曜日

Jadのありか

このエントリーをはてなブックマークに追加 Clip to Evernote
本家のサイトが死んでるみたいなので、
Mirrorサイトから引っ張ってきた。URLのメモ。


http://www.varaneckas.com/jad/

っていうか、本家どうなってるんだろう。。。