機械音痴な情報系

今年2月から学び始めたPython、Django、機械学習について勉強したことのメモを書いていきます

【固定記事】まとめのまとめ

本気ではじめるiPhoneアプリ作り〜黒帯エンジニアがしっかり伝える基本テクニック〜

本気ではじめるiPhoneアプリ作り〜黒帯エンジニアがしっかり伝える基本テクニック〜


Pythonによるクローラースクレイピング入門 設計・開発から収集データの解析まで

Pythonによるクローラー&スクレイピング入門

【djangoのエラー】'ModelBase' object does not support indexing

久しぶりにdjangoでmodelを書いていたら大して嵌ってないけど見たこと無いエラーを見たのでメモ。

エラー1

エラー文

anime = models.ManyToManyField('アニメ', Anime, blank=True)
'ModelBase' object does not support indexing

解決方法

anime = models.ManyToManyField(Anime, blank=True, related_name='animes')

エラー2

エラー文

name = models.CharField('名前', max_length=255, unique=True)

ManyToManyでなければ文字列を書くとadminサイトにその文字で反映される。

anime = models.ManyToManyField('アニメ', Anime, related_name='animes',blank=True)

しかしこうすると、、、

 __init__() got multiple values for argument 'related_name'

こんなエラーが出る。

解決方法

anime = models.ManyToManyField(Anime, related_name='animes',blank=True, verbose_name='アニメ')

verbose_nameに値を渡して解決。
日本語名がadminサイトで見れるようになった。
f:id:saneeeatsu:20180519114328p:plain

【django】runserver時にWinError 10013

家で作ってgithubに上げておいたプログラムをrunserverしようとしたらエラーが出たのでメモ。

実行環境

OS Win10
django 2.0.5

問題となるエラー

$ python .\manage.py runserver
Performing system checks...

System check identified no issues (0 silenced).
May 16, 2018 - 11:02:58
Django version 2.0.5, using settings 'portfolio.settings'
Starting development server at http://127.0.0.1:8000/
Quit the server with CTRL-BREAK.
Error: [WinError 10013] アクセス許可で禁じられた方法でソケットにアクセスしようとしました。

因みにこのエラー、英語だと
「An attempt was made to access a socket in a way forbidden by its access permissions 」となる。

解決策

結論から言うと解決策はポートを変更すること。

$ python manage.py runserver 8080

原因

デフォルトのポートが別で使用されている。

React Nativeでアプリを作る - 0

今回はプロジェクトを作成し、開発ツールを導入するというコードを書いていく手前までやっていく。


Expoで作ったアプリのファイル構成

プロジェクトを作成

$ exp init project-name
$ npm install

Expoで作ったものは通常React Nativeで作るものとは若干異なる。主なものは以下。

App.js このアプリのルートになるファイル。最終的にReact Nativeでビルドされる。
app.json Expoのファイル。アプリの名前やアイコンの場所を指定している。
package.json React Nativeのプロジェクトの依存関係を指定。実際の依存関係はnode_modulesフォルダ内に入っている。
node_module npm installやpackage.jsonを修正してnpm installするとnode_moduleフォルダに自動的にファイルがダウンロードされる。

ディレクトリの構成の変更

プロジェクト直下にsrcというフォルダ、更にその下に、components、elements、screensというフォルダを作成。
大きさは小さい順に以下のようになる。

elements 画面を構成する最小単位
components elementsの集合体
screens 1つの画面のcomponents

開発用ツールの導入

eslint
babel-eslint
eslint-config-airbnb
eslint-plugin-impot
eslint-plugin-jsx-a11y
eslint-plugin-react

Terminalからコマンドを実行し、package.jsonに入れていく。
package.jsonはパッケージとそのバージョンの指定をしているだけで、実態はnode_moduleフォルダにある。

npm install --save-dev eslint babel-eslint eslint-config-airbnb eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react
    • save-dev:開発環境にダウンロード


また、eslintを使うためにはフォルダ直下に「.eslintrc.json」を作成し、今回の場合は以下のような内容にする。
「rules」には出されたエラーの中で無視したいものを入れていく(0にする)。

{
  "extends": "airbnb",
  "plugins": [
    "react",
    "jsx-a11y",
    "import"
  ],
  "rules": {
    "no-use-before-define": 0,
    "react/prefer-stateless-function": 0,
    "react/jsx-filename-extension": 0
  },
  "parser": "babel-eslint"
}

高速に開発するために

--offlineオプションを付ける

$ exp start --offline
$ exp ios --offline
$ exp android --offline

上記3つのコマンドは通常「--offline」というオプションをつけずに使用出来るが、
これをつけるとネットワーク経由でJavascriptが経由されるので速い。
シミュレーターでエラーが出たらこっちの記事を参照。
React Nativeの実行環境を整える - 機械音痴な情報系


Hot Reloadを使用する

アプリを立ち上げている状態から、⌘+Dを押すとアプリの設定画面に戻れる。
Live Reloadではなく、Hot Reloadを使えるようにする。

Live Reload コードを変更すると自動でリビルドする。
Hot Reload 変更した差分のみを転送するため反映されるのが速い。

f:id:saneeeatsu:20180504183853p:plain






これで開発のスタートラインに立った!!

React Nativeの実行環境を整える

インストールするものざっくり一覧

・Node.js
・React Native
Xcode(for iOS)
・Genymotion(for Android)
・Expo


React Nativeをインストール

公式サイト:Getting Started · React Native

$ npm install -g create-react-native-app
$ create-react-native-app AwesomeProject
$ cd AwesomeProject

-gオプションをつけると、グローバルにインストールされる。つまりこのコマンドがどこからでも使えるようになる。
公式ページにはこの後「npm start」と書いてあるが、実行する環境がないので、まず実行環境を整える。
やろうと思えばExpoのアプリをiPhoneAndroidにダウンロードすることも出来るが、実行結果をブラウザで確認出来たりもしてこっちのほうがデバッグは楽。


Xcodeをダウンロード

iOSシュミレータ起動のため。
普通にAppStoreでダウンロードすれば良い。あとは他のWebサイトを参考されたし。


Genymotionをダウンロード

Androidエミュレータ起動のため。

アカウントを作りMac/WindowsのGenymotionをダウンロード
https://www.genymotion.com/download/:title:w500


Applicationフォルダに入れ「Genymotion」をクリック(Genymotion Shellではない丸いアイコンの方)。
実行しようとするとこんなエラーが。Virtual Boxは既に入っているんだけどなぁ…。
f:id:saneeeatsu:20180503200627p:plain:w400
f:id:saneeeatsu:20180503200652p:plain:w400


VirtualBoxを以下から再インストール。
Oracle VM VirtualBox - Downloads | Oracle Technology Network | Oracle

一応Genymotionも1度消して再インストールしてみると無事インストールが出来た!


プラスマークの「Add」ボタンを押してNexus5の最新OSのものをインストール。
Virtual Device NameはデフォルトのままでFinish。
f:id:saneeeatsu:20180503204032p:plain:w700
f:id:saneeeatsu:20180503203549p:plain:w700
選択して「Start」ボタンを押して起動を確認。
f:id:saneeeatsu:20180503204521p:plain:w400


Expoのインストール

公式サイト:https://docs.expo.io/versions/latest/introduction/installation:title:w400

最新のExpoをダウンロード。
Releases · expo/xde · GitHub


コマンドラインにしかないコマンドもあるのでダウンロード。

$ npm install exp --global
$ exp --version
45.0.2


プロジェクを作る方法は以下の3つがある。全てReact Nativeのアプリケーションが作成される。
ただし、1.のプロジェクトはそのままExpoで使うことは出来ない。

1. 「create-react-native-app myproject」コマンドを使用
2. 「exp init myproject」コマンドを使用
3. Expoアプリケーションを起動し、GUIで作成

「Create new project...」を押し、デフォルトの「Bank」を選択したままプロジェクトを作成。
画面Shareボタンを押しQRコードを読み込むと、スマホにExpoのアプリから作成したアプリケーションを操作出来るようになる。

f:id:saneeeatsu:20180503210608p:plain:w700


iOSシミュレーターを起動

右の「Device」アイコンを押すか、⌘+iを押してiOSシミュレーターを起動させる。
するとこんなエラーが出て起動出来ない。



f:id:saneeeatsu:20180503232225p:plain:w700

9:10:22 PM
Error running `xcrun simctl openurl booted exp://localhost:19002`: An error was encountered processing the command (domain=NSPOSIXErrorDomain, code=60):
The operation couldn’t be completed. Operation timed out
Operation timed out
9:10:22 PM
Error installing or running app. Error: Process exited with non-zero code: 60

解決方法としては、iOSシミュレーターの中のExpoアプリを削除して一旦シミュレーターを終了。再度立ち上げると、、、

f:id:saneeeatsu:20180503233127p:plain:w700
一度削除すると自動的にExpoアプリを再ダウンロードするので、今までに無かった「Downloading latest version of Expo」というメッセージが流れている。


f:id:saneeeatsu:20180503232708p:plain:w400
正しく立ち上げることが出来たので、Expoアプリが自動的に立ち上がっていることが確認出来る。

f:id:saneeeatsu:20180503233253p:plain:w400

ひゃっほーーーーー!!!
エラー文でぐぐってなんか色々入れちゃったけどこんな単純な方法でなおるんかい!!!!


Androidシミュレーターを起動

f:id:saneeeatsu:20180504172115p:plain:w700

Couldn't start project on Android: Error running adb: No Android device found. Please connect a device and follow the instructions here to enable USB debugging:
https://developer.android.com/studio/run/device.html#developer-device-options. If you are using Genymotion go to Settings -> ADB, select "Use custom Android SDK tools", and point it at your Android SDK directory.

Genymotionを起動しないまましないままでは上のようなエラーが出てしまう。
先程と同じく、Genymotionを立ち上げてデバイスを選択し、「Start」ボタンを押してNexus5Xが立ち上がってから
Expoアプリの右側の「Device」から「Opne on Android」をクリック。


f:id:saneeeatsu:20180504172547p:plain:w700

Couldn't start project on Android: could not install *smartsocket* listener: Address already in use
ADB server didn't ACK
* failed to start daemon *
error: cannot connect to daemon

はい、エラー\(^o^)/


どうやらandroid-sdkのインストールは不要で以下のように、GenymotionのtoolsがPATHに含まれる必要があるのだそう。
参考:Genymotion - Expo Documentation

$ export PATH=/Applications/Genymotion.app/Contents/MacOS/tools:$PATH >> ~/.bash_profile
$ source ~/.bash_profile
$ which adb
/Applications/Genymotion.app/Contents/MacOS/tools/adb

GenymotionのSettingsのAccountタブで一度Sign outしてから再度Log inする。
ExpoをRestartしてもう一度エミュレータを立ち上げる。


Expoを使う上での注意点

Expoは便利だが、使用する上でいくつか注意したい点がある。

・バックグラウンドで位置情報を取得したり、音を鳴らすといったことは出来ない。
Bluetoothを使うことも出来ない(APIについては今後増えていく予定)。
・Expoがプッシュ通知を提供しているが、それ以外を使う場合デタッチをしなくてはいけない。
・同じアプリで開発用、本番用を分けることも出来なくはないが、向いてはいない。

参考:Why not Expo? - Expo Documentation

mkdirとその後のcdを同時に

とあるサイトを見ているときにmkdirとcdを同時に行っていたのでメモ。

方法1

$ mkdir mydir && cd $_

$_bashの特殊変数。ひとつ前に実行したコマンドラインの最後の引数を参照する。


方法2

~/ $ mkdir hoge
~/ $ cd !!$
cd hoge
~/ hoge $ 

!!:直前に実行したコマンドラインを再実行する。
そして、$をつけて最後の引数(hoge)のみを取り出している。


調べてみたら最後は「!$」でも良いらしい。

!!$のかわりに!$でも可能です。
本来 ! と $ のあいだには何か文字(イベント指示子)が必要になるのですが、
「$(ワード指示子)の前にイベント指示子が省略された場合は、直前に実行されたコマンドラインを参照する」
という暗黙の動作があるからです。

引用元:[小ネタ] mkdir したディレクトリに cd する方法 9 選 +1 (BASH) ※追記あり | Developers.IO

MacにOpenCVをインストール

なんでOpenCVをインストールするか

作りたいアプリで画像認識を使わなくてはいけないので、OpenCV + Pythonで実装しようと思う。
簡単に言うとチラシに書いてある商品と、その値段を認識させたい。
金額はテンプレートマッチングでも精度は出せそうだけど、商品もいけるのかな?

OpenCVのダウンロード(Mac)

以下のサイトを参考にしながらインストールしていく。
MacユーザーのためのPythonでOpenCVを使うための開発環境 - IMACEL Academy -人工知能・画像解析の技術応用に向けて-|LPixel(エルピクセル)

$ brew update
$ brew install pyenv
$ pyenv versions  # pyenvが入っていることを確認
$ echo 'export PYENV_ROOT="$HOME/.pyenv"' >> ~/.bash_profile
$ echo 'export PATH="$PYENV_ROOT/bin:$PATH"' >> ~/.bash_profile
$ echo 'eval "$(pyenv init -)"' >> ~/.bash_profile
$ conda list # Anacondaが既にインストールされていたことを確認
$  python
Python 3.6.4 |Anaconda, Inc.| (default, Jan 16 2018, 12:04:33) 
[GCC 4.2.1 Compatible Clang 4.0.1 (tags/RELEASE_401/final)] on darwin
Type "help", "copyright", "credits" or "license" for more information.
>>>
$ conda install -c menpo opencv3 
Solving environment: failed

UnsatisfiableError: The following specifications were found to be in conflict:
  - opencv3
  - xlwings
Use "conda info <package>" to see the dependencies for each package.


\(^o^)/


ぐぐってみると他の人はPythonの3.6系が非対応とかで、2017/8/11段階では以下のようなエラー文が出ているけどそういうわけではない。2018/5/1現在は対応されたのかな?

  - opencv -> python 2.7*
  - python 3.6*

てことで解決策は以下を参考にした。
https://github.com/conda/conda/issues/2448

$ conda install -c conda-forge opencv
$ python
Python 3.6.4 |Anaconda, Inc.| (default, Jan 16 2018, 12:04:33) 
[GCC 4.2.1 Compatible Clang 4.0.1 (tags/RELEASE_401/final)] on darwin
Type "help", "copyright", "credits" or "license" for more information.
>>> import cv2
Traceback (most recent call last):
  File "<stdin>", line 1, in <module>
ImportError: dlopen(/Users/sane/anaconda3/lib/python3.6/site-packages/cv2.cpython-36m-darwin.so, 2): Library not loaded: @rpath/libfreetype.6.dylib
  Referenced from: /Users/sane/anaconda3/lib/libopencv_freetype.3.4.dylib
  Reason: Incompatible library version: libopencv_freetype.3.4.dylib requires version 22.0.0 or later, but libfreetype.6.dylib provides version 21.0.0
>>> 

んあああ\(^o^)/\(^o^)/


以下を参考にして解決!谢谢!
记录一次使用conda 安装opencv3 - 简书

$ conda uninstall freetype
$ conda install -y -c conda-forge opencv
$ python
Python 3.6.4 |Anaconda, Inc.| (default, Jan 16 2018, 12:04:33) 
[GCC 4.2.1 Compatible Clang 4.0.1 (tags/RELEASE_401/final)] on darwin
Type "help", "copyright", "credits" or "license" for more information.
>>> import cv2
>>> 

contribパッケージもインストール

OpenCV(Python)で物体認識、特徴抽出(SIFT、SURF、A-KAZEの使い方)
文字の大きさが変わるし、値段の数字が隣の数字と被ってしまうことを考えたらテンプレートマッチングは適切ではないかと思ったので特徴点抽出を調べたら、そのためのライブラリはライセンスフリーではないものを使うらしい。
が、個人利用の場合はお金はとられないので安心。

opencv-pythonは非公式だから、公式の入れ方をしたのに、contribはopencv-contrib-pythonばっか出てくる。。


macのhomebrewでOpenCV 3のopencv_contribをインストールする。 - そこそこ日記

Expoで初めてシュミレータを立ち上げる際に既にWarningが出ている→npm startで大量ERR

ゴールデンウィーク
キャンプの予定が消え、
ディズニーに行く予定も消え、
暇になってしまった。

ReactNativeやんぞ!
ってことで2400円で買ったった。
www.udemy.com


セクション7の25で詰まった\(^o^)/
iOSアプリの画面が真っ赤っ赤。


結論から言うと、watchmanとflowをHomebrewでインストールしてプロジェクトを再作成すれば解決した(一番下にコマンド有ります。)。

Warningを解決する

よく見たらExpoをインストールしてiOSシュミレーターを立ち上げようと思ったら左下にオレンジ色でissueも出てる。

Warning: You are using npm version 5.6.0. There may be bugs in this version, use it at your own risk. We recommend version latest.

forums.expo.io

他の人もこの問題ではまってるっぽい。
解決策の一つとしてとして、expをダウングレードする方法があるっぽい。

npm install exp@45.0.2 -g

うまくいかない…。


npm startのエラーを解決する

npm startしてねと言われるのでしてみる(Udemyのチュートリアルではしてなかった)。

$ npm start
npm ERR! path /Users/sane/Code/ReactNative/package.json
npm ERR! code ENOENT
npm ERR! errno -2
npm ERR! syscall open
npm ERR! enoent ENOENT: no such file or directory, open '/Users/sane/Code/ReactNative/package.json'
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent 

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/sane/.npm/_logs/2018-04-28T14_13_35_297Z-debug.log

取り敢えずぐぐる
stackoverflow.com

$ npm install -d
$ npm start
npm ERR! missing script: start

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/sane/.npm/_logs/2018-04-28T14_18_44_105Z-debug.log

お、jsonは作られたっぽいけど、、、
$ create-react-native-app my-app
のあとcdでmy-appに入ってないわ。。。
はいはい、cdして解決〜と思ったら全然解決してなかった。
そもそもサーバ動いてないってどういうこっちゃ。

$ npm start

> Udemy@0.1.0 start /Users/sane/Code/ReactNative/Udemy
> react-native-scripts start

23:24:45: Unable to start server
See https://git.io/v5vcn for more information, either install watchman or run the following snippet:
  sudo sysctl -w kern.maxfiles=5242880
  sudo sysctl -w kern.maxfilesperproc=524288
        
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! Udemy@0.1.0 start: `react-native-scripts start`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the Udemy@0.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/sane/.npm/_logs/2018-04-28T14_24_46_033Z-debug.log

はぁ…。
取り敢えず言われたとおり以下のサイトに行ってみる。
https://git.io/v5vcn
よくわからん。

結論:watchmanとflowをインストールしろ

github.com

watchmanが必要っぽい。
以下のQiitaを参考にする。そもそもインストールが推奨されているらしい。
qiita.com

$ brew install watchman
$ brew install flow
$ create-react-native-app my-react-native-app
$ npm start

今までのアプリだとエラーが出るでプロジェクトを再作成する。
無事iOSアプリの方でも立ち上がった。


UdemyではExpoでプロジェクトを作成してたけど、コマンドで作成する方で行こう。