Vimのフォントを Ricty から Source Code Pro にしてみた。

Posted on

Adobeからソースを表示するためのフォントが出たというのでvimで利用してみました。

環境

  • OS: Ubuntu 12.04 64bit
  • vim: 7.3.429
  • font:
    • SourceCodePro: 1.009
    • Ricty: 3.2.0

SourceCodePro のインストール

Adobe Font Development Kit for OpenType (AFDKO)というのを利用してビルドするみたいですが、linuxには無いっぽい？見つからないので SourceForge からダウンロードします。

Terminal
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
$ wget http://sourceforge.net/projects/sourcecodepro.adobe/files/latest/download --trust-server-names
$ unzip SourceCodePro_FontsOnly-1.009.zip
  Archive:  SourceCodePro_FontsOnly-1.009.zip
  creating: SourceCodePro_FontsOnly-1.009/
  inflating: SourceCodePro_FontsOnly-1.009/LICENSE.txt
  inflating: SourceCodePro_FontsOnly-1.009/ReadMe.html
  inflating: SourceCodePro_FontsOnly-1.009/SourceCodePro-Black.otf
  inflating: SourceCodePro_FontsOnly-1.009/SourceCodePro-Black.ttf
  inflating: SourceCodePro_FontsOnly-1.009/SourceCodePro-Bold.otf
  inflating: SourceCodePro_FontsOnly-1.009/SourceCodePro-Bold.ttf
  inflating: SourceCodePro_FontsOnly-1.009/SourceCodePro-ExtraLight.otf
  inflating: SourceCodePro_FontsOnly-1.009/SourceCodePro-ExtraLight.ttf
  inflating: SourceCodePro_FontsOnly-1.009/SourceCodePro-Light.otf
  inflating: SourceCodePro_FontsOnly-1.009/SourceCodePro-Light.ttf
  inflating: SourceCodePro_FontsOnly-1.009/SourceCodePro-Regular.otf
  inflating: SourceCodePro_FontsOnly-1.009/SourceCodePro-Regular.ttf
  inflating: SourceCodePro_FontsOnly-1.009/SourceCodePro-Semibold.otf
  inflating: SourceCodePro_FontsOnly-1.009/SourceCodePro-Semibold.ttf
  inflating: SourceCodePro_FontsOnly-1.009/SourceCodeProReadMe.html
$ cp SourceCodePro_FontsOnly-1.009/SourceCodePro*.ttf ~/.fonts/

vim に設定する

~/.vimrc に利用フォントを記述します。

~/.vimrc
1
set gfn=SourceCodePro\ 10

Ricty Regular 10 に設定した場合。

SourceCodePro Regular 10 に設定した場合。

結構似た感じですが、Rictyと比べるとSourceCodeProのほうが大きく、文字の間隔が広いようです。

個人的にはRictyのほうが見やすいので戻します。

以上です。

参考

タイポグラフィの基本ルール ―プロに学ぶ、一生枯れない永久不滅テクニック―［デザインラボ］[Kindle版]
posted with ヨメレバ
大崎 善治 SBクリエイティブ 2016-10-27
Kindle
Amazon[書籍版]

top から htop へ移行メモ

Posted on

プロセス情報を見る htop というが見やすく便利ということなので top から移行してみました。

環境

● Ubuntu

  • OS: Ubuntu 12.04 64bit
  • htop: 1.0.1-1

● Mac

  • OS: Mac OSX 10.8.1
  • Homebrew: .9.3
  • htop: 0.8.2.1

htop のインストール

● Ubuntu の場合

apt を利用してインストールします。

Terminal
1
$ sudo aptitude install htop

● Mac の場合

brew を利用してインストールします。

Terminal
1
$ brew install htop

htop を利用してみる

htop を起動します

Terminal
1
$ htop

だいぶ見やすいです。

top で htop が起動するようにする

.zshrc へ下記を追記

.zshrc
1
alias top="htop"

これで top で htop が起動します。

以上です。

参考URL

新しいLinuxの教科書[Kindle版]
posted with ヨメレバ
三宅 英明,大角 祐介 SBクリエイティブ 2017-06-08
Kindle
Amazon[書籍版]

Sinatra + Haml + Scss で Hello, World を表示したりするメモ

Posted on

html5 のテスト基盤になる環境を Sinatra で作ってみるメモ。

環境

  • OS: Ubuntu 12.04 64bit
  • rvm: rvm 1.14.3 (stable)
  • Ruby: ruby 1.9.3p194 (2012-04-20 revision 35410) [x86_64-linux]
  • Sinatra: 1.3.3

環境作成

rvmを利用して環境を作る

.rvmrc
1
2
rvm use 1.9.3
rvm 1.9.3@sinatra

bundler のセットアップ

Terminal
1
2
$ bundle init
iting new Gemfile to /home/hoge/sinatra/Gemfile

Gemfile を編集

Gemfile
1
2
3
4
# A sample Gemfile
source "https://rubygems.org"

gem "sinatra"

Sinatra をインストール

Terminal
1
2
3
4
5
6
7
8
$ bundle install
Fetching gem metadata from https://rubygems.org/.....
Installing rack (1.4.1)
Installing rack-protection (1.2.0)
Installing tilt (1.3.3)
Installing sinatra (1.3.3)
Using bundler (1.1.4)
Your bundle is complete! Use `bundle show [gemname]` to see where a bundled gem is installed.

ひとまず “Hello, World” をやってみる

app.rb を作成。

app.rb
1
2
3
4
5
6
7
8
9
10
#!/usr/bin/env ruby
# -*- encoding: utf-8 -*-
# -*- coding: utf-8 -*-

require 'rubygems' unless defined? ::Gem
require 'sinatra'

get '/' do
  'Hello, World'
end

Rackの設定をする config.ru を作成。

config.ru
1
2
3
4
require 'rubygems' unless defined? ::Gem
require File.dirname( __FILE__ ) + '/app'

run Sinatra::Application

サーバ起動。

Terminal
1
$ bundle exec rackup config.ru

http://localhost:9292/ へブラウザからアクセスで表示確認。

haml と SCSS と HTML5 を利用してみる

最終的なディレクトリ構造。

tree
1
2
3
4
5
6
7
8
9
sinatra/
├── Gemfile
├── Gemfile.lock
├── app.rb
├── config.ru
└── views
    ├── index.haml
    ├── layout.haml
    └── style.scss

Gemfile に追記。

追記後 bundle install を実行して haml をインストールする。

Gemfile
1
gem "haml"

app.rb を修正。

app.rb
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
#!/usr/bin/env ruby
# -*- encoding: utf-8 -*-
# -*- coding: utf-8 -*-

require 'rubygems' unless defined? ::Gem
require 'sinatra'

# HTML5を利用
set :haml, :format => :html5

# root_path
get '/' do
  @items = {"h1" => "見出し1", "h2" => "見出し2", "h3" => "見出し3"}
  haml :index
end

# スタイルシート
get '/style.css' do
  scss :style
end

レイアウトを作成。

views/layout.haml
1
2
3
4
5
6
7
!!!
%html
  %head
    %link{"rel" => "stylesheet", "href" => "style.css", "type" => "text/css"}
    %title Hello, World
  %body
    != yield

view を作成。

views/index.haml
1
2
3
4
5
6
- @items.each do |key, val|
  %section
    -# 見出し毎に出力
    <#{key}>#{val}</#{key}>
    %p{:class => key}
      = val

スタイルシートを作成。

views/stylesheet.scss
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
body {
  background-color: black;
}

section {
  h1 {
    color: red;
  }

  h2 {
    color: blue;
  }

  h3 {
    color: yellow;
  }

  p.h1 {
    color: #F0E68C;
  }

  .h2 {
    margin: 0 0 0 10px;
    color: #FA8072;
  }

  p.h3 {
    margin: 0 0 0 50px;
    color: #BC8F8F;
  }
}

サーバ起動。

Terminal
1
$ bundle exec rackup config.ru

http://localhost:9292/ へブラウザからアクセスで表示確認。

以上です。

参考

Sinatra: Up and Running: Ruby for the Web, Simply[Kindle版]
posted with ヨメレバ
Alan Harris,Konstantin Haase O'Reilly Media 2011-11-21
Kindle
Amazon[書籍版]
© 2024 磁力式駆動 All Rights Reserved.
Theme by hiero