DjangoでWebアプリを開発(1)

お久しぶりです。
約2ヶ月ぶりの投稿です。
今回は、Pythonで最も使われているフレームワークであるDjangoを使って、Webアプリを開発しようと思います。
今回作ろうと考えているのは、自分が大好きなマインスイーパーを作ろうかなと考えています。
マインスイーパーを作るのに、Djangoは向かないだろっ!っていうツッコミはご遠慮ください笑)

それでは、始めたいと思います。
まず、仮想環境の構築を始めます。

なぜ仮想環境を構築するのか

自分も最初、仮想環境を構築する必要があると言われた時になぜなのか疑問に思いました。
調べてみると以下の理由があるようです。

  1. Pythonのバージョンを固定させる
  2. パッケージのバージョンを固定させる

なるほど。
Pythonを使っていると、上記の理由で悩まされることがあるので
仮想化の必要性を理解できますね!

準備

以下のコマンドを入力して、インストールしていきます。

# pip install virtualenv virtualenvwrapper

virtualenvが仮想環境を構築するパッケージで
virtualenvwrapperは仮想環境の管理を容易にするパッケージです!

次に、環境変数を設定するファイルであるファイルを設定します。

ファイル内に以下を追加します。

export WORKON_HOME=$HOME/.virtualenvs
source /usr/local/bin/virtualenvwrapper.sh

そして、編集したファイルを反映させます。

source ~/.bash_profile

仮想環境の構築

それでは、実際に仮想環境を構築します。

# mkvirtualenv --no-site-package virtualenv
仮想環境の起動
# workon virtualenv

他にも以下のような方法があります。

# cd virtualenv
# source bin/activate

workonコマンドだと、どこのディレクトリにいても起動できるので
こっちの方が便利です。

仮想環境の無効化
# deactivate

Djangoのインストール

仮想環境の構築が済んだので、Djangoをインストールしたいと思います。

# pip install django

本日は、仮想環境の構築とDjangoのインストールを終わらせました。
次回から、実際にDjangoをさわってみたいと思います。

【MySQL】コマンドでDBをインポートする

おひさしぶりです.
だいぶ,久しぶりのブログです.

みなさん,phpMyAdminでDBをインポートしようとするとき,

「インポートするデータを受信できませんでした。ファイル名が送信されていないか、ファイルサイズが PHP の設定で許可された最大値を超えています。FAQ 1.16 をご覧ください。」

って表示されません?
これが,表示されてPHPの設定ファイルを変更するのは面倒ですよねー

なので,今回はphpMyAdminからDBをインポートするのではなく,
コマンドからDBをインポートしたいと思います.

mysql -u root -p < xxxxx.sql 

ハイ,たったこれだけ!


参考:MySQLのバックアップ/復元(ダンプ/インポート/dump/import) 基本コマンド メモ - Qiita

簡単にサーバにファイル転送

こんにちは。
普段よくサーバやRaspberry Piをいじってて、
リモートマシンにファイルを転送したいということが多々あります。
今までは、Filezillaなどのファイル転送ソフトを使わずに
sftpコマンドを使ってリモートマシンにファイルを転送してました。


しかし、いちいち「lcd」や「cd」で移動するの面倒くさいんですよね!
なおかつ、Tabキーで入力補完されないし…

ってことで、簡単にリモートマシンにファイルをコピーすることができる【scp】というコマンドが
あるそうなので、使い方をメモしたいと思います。

ローカルからリモートにファイルをコピー

# scp ローカルのファイルパス ユーザ名@リモートのホスト名:転送先パス

(例)

# scp test.txt root@xxx.xxx.xxx.xxx:/var/www/html

リモートからローカルにファイルをコピー

# scp ユーザ名@リモートのホスト名:リモートのファイルパス ローカルの転送先

(例)

# scp root@xxx.xxx.xxx.xxx:/var/www/html/test.txt .

オプション

管理者必見! ネットワーク・コマンド集 - scpコマンド:ITpro


Tabキーで入力補完をされることはありませんが、
これでsftpコマンドより何倍も簡単にファイルを転送することができます!

エイリアスを使って、面倒なコマンドを短縮化

どうも。
だいたい1週間ぶりのブログです。

みなさん
コマンドラインで作業してると、
Tabキーで入力補完がされるといえでも、
無駄に冗長なコマンドを打つのは面倒くさくないですか?

なので、エイリアスを使って面倒なコマンドを短縮化したいと思います。
今回は、「mecab -d /usr/local/lib/mecab/dic/mecab-ipadic-neologd/」
というコマンドを「mecab-ipadic-neologd」と打つだけでできるようにしたいと思います。

エイリアスに追加

# alias mecab-ipadic-neologd='mecab -d /usr/local/lib/mecab/dic/mecab-ipadic-neologd/'

エイリアスの保存

先ほどエイリアスに追加しましたが、再起動すると消えてしまいます。
なので、bashを起動すると毎回呼び出されるbashrcに追加したいと思います。

# echo "alias mecab-ipadic-neologd='mecab -d /usr/local/lib/mecab/dic/mecab-ipadic-neologd/'" >> ~/.bashrc

これで、再起動したとしても「mecab-ipadic-neologd」と打てば
正常に動作します。

参考:エイリアスでコマンドを短縮する | WEBサービス創造記

【追記】Macエイリアスに追加

まず、以下のファイルを設定します。

# vim ~/.bash_profile

次に、そのファイルに省略したいコマンドを追加します。

alias mecab-ipadic-neologd='mecab -d /usr/local/lib/mecab/dic/mecab-ipadic-neologd/'

Linuxと違って、1つの処理で済みます!
ラクちん!

JavaScriptを使って自動スクロール

どうも。
3週間ぶりぐらいのブログです。

現在、Node.jsを使ってチャットを制作しています!
元々は、講義の課題だったんですが、色々と機能を拡張中です。
見た目は、完全にL○NEです(笑)

f:id:usmysa:20160628214931p:plain

自分は、サーバサイドを担当するのが好きで
フロント側はあまりやったことがないので、L○NEもどきのUIにするのに苦戦しました…

で、現状の仕様だと
メッセージがサーバから送られてくると、下にどんどん追加される形です。
その場合だと入力/受信したら、わざわざ一番下までスクロールする必要があります。
なので、メッセージを追加されたら、自動的に最新のメッセージまでスクロールする仕様に変更したいと思います。

仕様

まず、それぞれのメッセージに対して動的にid(msg_id)を付与させます。
そして、メッセージが追加されたら、一番新しいIDの位置にスクロールしたいと思います。

jQuery

まず、メッセージにidが付与されていることを前提に話を進めたいと思います。
無難にjQueryを使って、付与したメッセージの絶対位置を求めたいと思います。

var positionY = $("#" + msg_id).offset().top;

正しく位置情報が取得できてるっぽいので、この値の位置に移動したいと思います。

$("#___id___").scrollTop(positionY);

おぉー、これで移動ができます。
しかし、なぜか18個目以降のメッセージになるとスクロール位置がおかしくなります…!
よくよく調べてみると、絶対位置の値がおかしくなっています。
ググッてみると、jQueryのoffsetを用いると、値がバグるとか…
なので、jQueryを使わないでいこうと思います。

ネイティブJavaScript

次に、生のJavaScriptで試してみたいと思います。

 var element = document.getElementById("msg_id");
 var rect = element.getBoundingClientRect();
 var positionY = rect.top;
 element.scrollTo(0, positionY);

しかし、同様に18個目以降のメッセージで位置がおかしくなっています…
次に、getBoundingClientRectではなく、offsetTopで位置を求めてみたいと思います。

 var element = document.getElementById("msg_id");
 var positionY = element.offsetTop; // 変更点
 element.scrollTo(0, positionY);

おぉぉぉ、うまく行っています!
これで一件落着です。

最近、JavaScript/Node.jsを勉強していますが、
JavaScriptはデバックしづらいので、好きじゃないですね…

Raspberry Pi 3にNode.jsをインストール

どうも.
もうそろそろ,ラズパイになれてきたところで
Node.jsをインストールしてみたいと思います.

通常のCentOSでは,

# yum install epel-release
# yum install nodejs

でインストールすることができるのですが
なにせRaspberry Pi 3ではepelが対応していないので
このやり方をやることはできません!
なので,yumを使わずにNode.jsをインストールしてみたいと思います.

# wget https://nodejs.org/dist/v4.0.0/node-v4.0.0-linux-armv7l.tar.xz
# tar -xvf node-v4.0.0-linux-armv7l.tar.xz 
# cd node-v4.0.0-linux-armv7l
# sudo cp -R * /usr/local/

参考:Blog | Wia

これで,インストールができたと思います.
インストールされたかを確認するには,

# node -v
v4.0.0

と入力して,表示されれば大丈夫です.

npmとは

今回のやり方では,同時にnpmというコマンドもインストールされます.
まず,npmとは何かについて説明したいと思います.

Node Packaged Modules(npm)とはNode.jsのライブラリやパッケージを管理することができるツールです。
ライブラリやパッケージの管理ツールを主にパッケージマネージャと呼びます。

引用:STEP2-4.パッケージマネージャのnpmとは / チームラボ オンラインスキルアップ課題

つまり,Pythonでいうpip,Rubyでいうgemと同じってことですね.
今後は,お世話になると思います.

Node.jsのバージョンの違い

最初に説明したyumのやり方では,バージョンv0.10.xがインストールされる一方,
今回のやり方では,バージョンv4.0.0がインストールされています.
最初,見た時「これ,大丈夫なの!?」って思ったぐらいバージョンが違いますよね(笑)
よくよく調べてみると,v.4.0.0の方が性能が向上しているようなので良さ気です.
詳しくは,以下のサイトを参考にしてみてください.

html5experts.jp

Raspberry Pi 3でyumが使えなくなる問題

どうも。
Raspberry Pi 3にCentOSを入れたもののyumが使えなくなり、3回も初期化した者です。
いやぁー、ラズパイにものすごく悪戦苦闘していますが、
ネットワーク関係に関する知識が非常に身につきます。

今回発生した問題として、yumでいろいろとやっていたら、

# yum list
Loaded plugins:fastestmirror
http://mirror.centos.org/altarch/7-2.1511.el7.centos.0.4/os/armhfp/repodata/repomd.xml:
[Errno14] curl#6 - "Could not resolve host: mirrorlist.centos.org; Name or service not known"
Trying other mirror.

One of the configured repositories failed (CentOS-7-2.1511.el7.centos.0.4 - Base),
and yum doesn't have enough cached data to continue. At this point the only
safe thing yum can do is fail. There are a few ways to work "fix" this:

    1. Contact the upstream for the repository and get them to fix the problem.

    2. Reconfigure the baseurl/etc. for the repository, to point to a working
       upstream. This is most often useful if you are using a newer
       distribution release than is supported by the repository (and the
       packages for the previous distribution release still work).

    3. Disable the repository, so yum won't use it by default. Yum will then
       just ignore the repository until you permanently enable it again or use
       --enablerepo for temporary usage:

           yum-config-manager --disable <repoid>

    4. Configure the failing repository to be skipped, if it is unavailable.
       Note that yum will try to contact the repo. when it runs most commands,
       so will have to try and fail each time (and thus. yum will be be much
       slower). If it is a very temporary problem though, this is often a nice
       compromise:

           yum-config-manager --save --setopt=<repoid>.skip_if_unavailable=true

failure: repodata/repomd.xml from base: [Errno 256] No more mirrors to try.
[Errno14] curl#6 - "Could not resolve host: mirrorlist.centos.org; Name or service not known"

というエラーが出るようになってしまいました。


そこで今回、最も苦しんだyumに関することを今後も忘れない、
かつyumの仕組みを理解するために記事にしたいと思います。

環境

Raspberry Pi 3
CentOS 7.2

そもそもyumとは…

RedHatディストリビューションのパッケージ管理システムの事です。
リポジトリと呼ばれるパッケージ置き場からのパッケージをダウンロードし、インストール、アンインストール、更新をする事ができます。
その際、各パッケージの依存関係を自動的に解決し、関連するパッケージがどれなのか教えてくれたり、
必要な場合は、関連パッケージをダウンロードしてそのまま更新してくれたりしてくれます。

引用:パッケージの管理|yumとは

yumは、パッケージを管理するコマンドとなっています。
Ubuntuで言う、apt-getと同じです。
で、yumで覚えてほしいのはrpmコマンドと異なり、ネットワーク経由でパッケージをダウンロードし、インストールします。
なので、基本的にyumでパッケージをインストールし、問題が発生したらrpmでインストールするというのが一般的だと思います。

リポジトリの設定

パッケージのダウンロードに用いるリポジトリの設定ファイルは、「/etc/yum.repos.d/」にあります。
まず、リポジトリには、2種類あります。
1つ目が、CentOSのデフォルトのリポジトリです。
それに関する設定は、基本的に「CentOS-Base.repo 」に記述されています。
2つ目が、サードパーティが公開しているリポジトリです。
一般的に、remiやepelが有名だと思います。
これらを用いることで、デフォルトのリポジトリで対応していないパッケージなどをダウンロードすることができます。

設定ファイルの説明

それでは、実際にリポジトリの設定ファイルの中身を見てみましょう!

# vim CentOS-Base.repo

〜〜 省略 〜〜

[base]
name=CentOS-$releasever - Base
#mirrorlist=http://mirrorlist.centos.org/?release=$releasever&arch=$basearch&repo=os&infra=$infra
baseurl=http://mirror.centos.org/altarch/$releasever/os/$basearch/
gpgcheck=1
enabled=1
gpgkey=file:///etc/pki/rpm-gpg/RPM-GPG-KEY-CentOS-7
       file:///etc/pki/rpm-gpg/RPM-GPG-KEY-CentOS-SIG-AltArch-Arm32

#released updates 
[updates]
name=CentOS-$releasever - Updates
#mirrorlist=http://mirrorlist.centos.org/?release=$releasever&arch=$basearch&repo=updates&infra=$infra
baseurl=http://mirror.centos.org/altarch/$releasever/updates/$basearch/
gpgcheck=1
enabled=1
gpgkey=file:///etc/pki/rpm-gpg/RPM-GPG-KEY-CentOS-7
       file:///etc/pki/rpm-gpg/RPM-GPG-KEY-CentOS-SIG-AltArch-Arm32

〜〜 省略 〜〜


mirrorlistやbaseurlがリポジトリ参照先のURLとなっています。
あと、覚えとくのは、「enabled=1」だとリポジトリを有効にするって意味です。
無効にしたい場合は、「enabled=0」にすれば大丈夫です。
ちなみに、無効にしたけど、一時的にそのリポジトリを使いたい場合は以下の通りにすれば使えます。

# yum --enablerepo=remi install php

他にも、ここで重要なのが$releaseverなどのYum変数と呼ばれる変数です。
個人的に覚えた方がいいと思うのは、2つだけだと思います。

$releasever CentOSのバージョンの値
$basearch システムのベースアーキテクチャーの値(x86_64など)

問題の原因

http://mirror.centos.org/altarch/ にアクセスしてみたら分かりますが、
「7-2.1511.el7.centos.0.4」というディレクトリはありません。
同様に、Raspberry Pi 3は64bitなので、「$basearch=x86_64」だと思ってしまうんですが、異なるアーキテクチャの値が代入されています。
そう、問題の原因はラズパイのアーキテクチャリポジトリの参照URLがうまく対応してないので、ダウンロードできないからです。

解決策

なので、問題が発生したら

# baseurl=http://mirror.centos.org/altarch/$releasever/updates/$basearch/
                    ↓
                    ↓
                    ↓
# baseurl=http://mirror.centos.org/altarch/$releasever/updates/x86_64/

にすれば大丈夫だと思います。

あと、他にも
サードパーティリポジトリは、ラズパイに対応していません!
サードパーティリポジトリの設定ファイルで「enabled=1」となっていることが原因で
Not Foundなどのエラーが発生することがあります。