atom-markdown用CSS

h1 {
  position: relative;
  font-size: 200%;
  font-size: bold;
  padding: 10px 20px;
  padding: 0 .4em .1em;
  font-weight: bold;
  background: linear-gradient(transparent 30%, #d7d7d7 80%);
}

h1::after {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
  content: '';
  width: 100%;
  height: 10px;
  background-color: #b6f0fc;
}

h2 {
  font-size: 150%;
  padding: 0.3em 0.3em;
  color: #494949;
  background: #f4f4f4;
  border-left: solid 4px #808080;
  border-bottom: solid 2px #d7d7d7;
  font-weight: bold;
}

h3 {
  font-size: 125%;
  padding: 0.3em 0.3em;
  color: #494949;
  background: #f4f4f4;
  border-left: solid 4px #d7d7d7;
  font-weight: bold;
  margin-left: 5px;
}

h4{
    font-size: 125%;
  font-weight: bold;
  color: #505050;
padding: 0.3em 0.8em 0.3em 0.3em;
display: inline-block;
line-height: 1.3;
background: #f4f4f4;
vertical-align: middle;
border-radius: 25px 0px 0px 25px;
}

h4:before {
content: '●';
color: #505050;
margin-right: 8px;
}

h5{
position: relative;
display: inline-block;
padding: 0 8px;
}

h5:before, h5:after{
content: '';
position: absolute;
top: 50%;
display: inline-block;
width: 7px;
height: 1px;
background-color: #505050;
}

h5:before {left:0;}
h5:after {right: 0;}

h6 {
  font-size: 125%;
  font-weight: bold;
  text-decoration: underline;
}


ul{
  margin-left: inherit;
}

p code {
position: relative;
color: crimson;
background: white;
border: solid 1px #d7d7d7;
border-left: solid 4em #d7d7d7;
padding: 1em;
padding-left: 2em;
padding-right: 4em;
}
p code:before {
content: "NOTE";
position: absolute;
padding: 0em;
color: crimson;
font-weight: bold;
left: -3em;
top: 50%;
-moz-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}

pre code {
  position: relative;
  padding: 5px;
  font-size: 1em;
}

pre code::after {
  content: "code";
  position: absolute;
  top: -8px;
  left: 10px;
  background: #fff;
  font-size: 0.8em;
  color: #32508C;
  padding: 0 10px;
}

RaspberryPiにsambaをインストールしてWindowsからアクセスする。

sambaをインストールします。

//インストールして、
sudo apt-get update
sudo apt-get upgrade
sudo apt-get install samba

//確認!
smbd -V
Version 4.1.17-Debian

設定を追記します。

sudo vim /etc/samba/smb.conf
//末尾に追記
[pi]
comment = Raspberry Pi
path = /home/pi
guest ok = yes
read only = no
public = yes
browsable = yes
force user = pi

sambaを再起動します。

$ sudo service smbd restart
$ sudo service nmbd restart

Windowsからアクセスします。

エクスプローラのアドレスバーに ラズパイのIPを入力すると見えます。

//こんな感じ
\\xxx.xxx.xxx.xxx

以上おわり。

atomでplantUMLを使ってみる

シーケンス図やフローチャートは、ビジュアル的に言いたい事を表現できるので便利ですよね。 普段はvisioを使っていますが、きれいな図を描こうと思ったら体裁を整えるのにある程度時間をとられます。 これが退屈。なのにツッコミが入りやすいのが見栄え。 なので、ツール様にやってもらおうという作戦です。

材料

  • atom
    • plantuml-viewer
  • Graphviz
  • JavaJREのほうでいい。portableでパスを通すのでもいけそう)
  • 先達の知恵

plantuml-viewerの導入

だいたい分かるな? SettingsのCharsetは"utf-8"

Graphviz(の中のdot.exe)

  1. Graphviz Download

windows | Graphviz - Graph Visualization Software

  1. 環境に合ったzipを落としてきて解凍する これを書いたときは graphviz-2.38
    .../graphviz-2.38\release\bin\dot.exe

  2. plantuml-viewerの GraphvizDot Executableに上記パスを入力する。

以上で準備完了

動作確認

ここが役に立ちそう PlantUML Cheat Sheet - Qiita

plantuml-viewer ショートカット:Ctrl+Alt+p

atomは一度落とさないとだめかも


なんとなく動作確認的なことをしてみたものの、、、微妙

digraph G {
size ="4,4";
subgraph cluster0{
  start [shape=box]; /* this is a comment */
  start -> step1;
  edge [color=red]; // so is this


  node [shape=box,style=filled,color=".7 .3 1.0"];
  step1 -> step2;
}

  node [shape=default,style=outline,color=black];
  step2 -> step3 [style=bold,label="comment"];

subgraph cluster1{
  step3 [shape=diamond];
  step3 -> step4 [style=dotted];
  step4 [shape=ellipse];
  step4 -> end [style=dotted];
  end -> end[label="hoge"];
}

step1 -> make_string;
make_string [label="branch"];

}

python3.6.2のインストール

python3.6.2のインストール

どうやら最初に書いた方法では、pipが使えなくなるようだ。


おソースを取ってきてmakeしてインストールする。 'python'のシンボリックリンクを更新して完了。

# インストール
sudo wget  https://www.python.org/ftp/python/3.6.2/Python-3.6.2.tar.xz
xz -dc Python-3.6.2.tar.xz | tar xfv -
cd Python-3.6.2
./configure # defaultでは/usr/local/binに入る
make
sudo make install

# 後日pipが入っていなくて困った。
# 同じディレクトリで下のようにやる。
sudo apt-get install libssl-dev
sudo make install

※エラー 404 Not Foundで うまくいかなかったら
sudo apt-get updateしてね

# おまけ
python3 -m pip -V # pipが入っているか確認
python3 -m pip freeze # 入っているパッケージの確認

pythonで便利なもの書くときに役立ちそうな記事

Shebang

  • シバンは環境にあわせて
  • マジックコメントは、文字エンコードを指定する。あとあと困りたくないならutf-8にしておく。
#!/usr/bin/python
# -*- coding: utf-8 -*-

print("Hello World!")

ファイル関連

# 存在確認
os.path.isfile(path)

# ファイル名を取得
os.path.basename(path)

# ファイルコピー
shutil.copyfile(src, dst, *, follow_symlinks=True)

# ファイル削除
os.remove(path)

# write file
f = open(filename, 'w') # 追記は'a'
f.write(text)
f.close()

# read file
f = open(filename, 'r')
text = f.read()
f.close()
print(text)

ディレクトリ関連

# ディレクトリ作成
os.mkdir(path)

# 存在確認
os.path.isdir(path)

# パス名を取得
os.path.dirname(path)

# ディレクトリコピー(上書きはエラー)
shutil.copytree(src, dst)

# ディレクトリコピー
from distutils.dir_util import copy_tree
copy_tree(src, dst)

# ディレクトリ削除(ファイルがあるとエラー)
os.rmdir(path)

# ディレクトリ削除(ファイルがあってもOK)
shutil.rmtree(path)

# カレントディレクトリを取得
os.getcwd()

リンク関連

# シンボリックリンク作成
os.symlink(src, dst)

# 存在確認
os.path.islink(path)

その他

# パスの存在確認
os.path.exists(path)
.tree-view {
  font-family: "Migu 1C", sans-serif;
}

// Markdown Preview
.markdown-preview {
  font-family: "Migu 1C", sans-serif;
  h1, h2, h3, h4, h5, h6 {
      font-family: "Migu 1C", sans-serif;
  }
  code, blockquote, atom-text-editor {
      font-family: "Migu 1M", "Meiryo", monospace;
  }

  @c_border: #666; // border-color

  max-width: 900px;
  margin: 0 auto;
  padding: 25px;
  color: black;
  hr {
    margin: 50px 0;
    background-color: transparent;
    &:after{
      content: "";
      display: block;
      border-top-style: ridge;
    }
    &.pb {
      // <hr class="pb">を入れる事で、
      // プリント時の改ページを指定することができる。
      page-break-after: always;
      &:after {
        display: none;
      }
    }
  }
  h1, h2, h3, h4, h5 {
    font-weight: normal;
    border-color: @c_border;
  }
  h1 {
    font-size: 24px;
    border: none;
    margin: 30px auto;
    text-align: center;
    letter-spacing: 5px
  }
  h2 {
    font-size: 16px;
    font-weight: bold;
    margin: 50px auto 25px
  }
  h3 {
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 10px
  }
  h4 {
    font-size: 11px;
    font-weight: bold;
    margin-bottom: 10px
  }
  // 僕の用途ではh4以降は基本的に必要ないので、
  // 設定していません。

  // 見出し以外のタグを字下げする
  // // ぱっと思いつく、よく使うタグを指定
  p, table, ul, ol, dl, pre, blockquote {
    margin-left: 25px;
    ul, ol, dl {
      margin-left: 0px;
    }
  }
  table {
    border-collapse: collapse;
    border-spacing: 0;
    max-width: 800px;
    th {
      text-align: center;
      background-color: #eee;
      border-color: @c_border;
    }
    tr {
      border-top: #666;
    }
    td {
      border-color: @c_border;
    }
  }
  .margin-clear {
    margin-left: 0;
  }
  // // テキストの中央揃え
  .center {
    text-align: center;
    &:extend(.margin-clear);
  }
  // テキストの右寄せ
  .right {
    text-align: right;
    &:extend(.margin-clear);
  }
}

.markdown-preview:not([data-use-github-style]) atom-text-editor{
    color:black;
}

bashrcに加えた変更をまとめる記事

またイチから作り直し。。。という状況になっても困らないために。 随時追加する。

プロンプトの変更

export PS1="\[\e[1;32m\] [\u@\h: \w]$ \[\e[00m\]"

.bashrcの最後に加える。本当は別ファイルを用意してsourceしたかったのですが、コマンドを打つと行頭から入力されてプロンプトを上書きするようになってしまうようなのでそのようにする。

alias

alias ll='ls -ltr'

‘='の前後にスペースがあるとエラーとなる。PEP8とは違う。

ラズパイにインストールしたツールをまとめる記事

導入したツールの一覧記事を作っておきます。随時更新します。


  • 導入前の儀式
sudo apt-get update
  • terminator
sudo apt-get install terminator

Xmingを通したssh接続でterminalを複数使いたいため入れた。

  • fcitx-mozc
sudo apt-get install fcitx-mozc -y
im-config -n fcitx
reboot

日本語環境です。

sudo apt-get install firefox-esr