OmniAICreator/Qiita-1.07M huggingface dataset:
【Rails】RSpecのSystem Test実行前に前回テスト時のScreenshotを削除しておく

# Abstract
RSpec3.8以降のSystem Testは特に気にせずともテストNG時にscreenshotを保存してくれる。
とても便利なのだけど、ほっておくとscreenshotがいっぱいになり、いざ今回のテストで失敗した箇所を探そうとしても埋もれてしまうことがある。

いちいち`rm`を打ってから`rspec`するのも面倒なので、
今回は、RailsでRSpecを実行する時に、前回までのscreenshotを自動で削除するようにするメモ。

ベースアプリは --> [Rails on Docker(alpine)でdocker-seleniumを使わないでSelenium+RSpec+Capybaraでテスト自動化してみる - Qiita](https://qiita.com/at-946/items/6def89bb94f748ad97f2)

# 注意事項
<b>１回ファイルパスを間違えて、rspec実行したら全てのファイルが消えた、という事件が起きたので注意してください...</b>gitから戻せたのでよかったですが...


# FileUtilsを使う
RubyのライブラリにFileUtilsがある。 --> [module FileUtils](https://docs.ruby-lang.org/ja/latest/class/FileUtils.html)
これはファイルを操作するためのライブラリ。その中に[`rm_rf`](https://docs.ruby-lang.org/ja/latest/method/FileUtils/m/rm_rf.html)というのがあるのでこれを使います。linux commandの`rm -rf`ですね。ファイルまたはディレクトリを再起的に削除してくれます。

これを、`rails_helper.rb`に記載してきます。

```ruby:spec/rails_helper.rb
RSpec.configure do |config|
  # テスト実行前に前回テストのscreenshotをディレクトリごと削除する
  config.before(:all) do
    FileUtils.rm_rf(Rails.root.join('tmp', 'screenshots'), secure: true)
  end
end
```

RSpecのSystem Testでは`tmp/screenshots/`以下にscreenshotが生成されていくので、そのディレクトリごと削除する設定です。ディレクトリは残したい場合は、

```ruby:spec/rails_helper.rb
RSpec.configure do |config|
  # テスト実行前に前回テストのscreenshotを削除する
  config.before(:all) do
    FileUtils.rm_rf(Dir[Rails.root.join('tmp', 'screenshots', '*')], secure: true)
  end
end
```
と指定してあげればOKです。

# Conclusion
rspec前に毎回rmする煩わしさから解放されました。

# Reference
- [module FileUtils (Ruby 2.6.0)](https://docs.ruby-lang.org/ja/latest/class/FileUtils.html)
AtomでPHP学習を始めるときとりあえず入れといたパッケージたち

# はじめに

最近何かとWordPressをいじることが多くなってきたので、真面目にPHPを勉強しようと思い立ちました。
目標はテーマを自分でカスタマイズできるようになることです。

とりあえず簡単なPHPの開発ができれば良いので、Atomで動作チェックができるような環境を作ろうと思います。


# インストールしたパッケージ

今後増えていくとは思いますが、インストールしたのは下記のパッケージです。

* php-server
Atom上からPHPサーバを呼び出して、エディタ下部にログを表示してくれるパッケージ。

* browser-refresh-on-save
いちいちブラウザをリフレッシュするのは面倒なのでサーブするごとに自動更新してくれるパッケージ



# 最後に

随時更新していきます。
毎日ブログ七日目

只今の時刻23:47

今日やったこと
①Progate
JavaScriptⅠ　1～14

=は等しいと言う意味ではなくて代入すればいいことが分かった。

これを理解していれば大丈夫そうでした。



②ドットインストール
Flexbox　終了

https://www.webcreatorbox.com/tech/css-flexbox-cheat-sheet
このサイトのPDFをコピーしながらやると、結構理解できました。

display:flex;を親要素に適応することにより、全てが始まります。
また、親要素と子要素で使うCSSは違うので、PDFを確認しながら進めて行く必要がありそうですね。

子要素flex:flex-grow,flex-shrink,flex-basis;であるので脳の片隅に置いときます。


③KROWLさんのサイトを参考に模写練習

https://magazine.krowl.jp/4026/
またこのサイトを見ながらやりました。
非常に参考になるサイトです。

コードをみないで模写できないので、できるようになりたいですね。

しかしながら、幅や高さを測ることができません。完成サイトがないので自分で作ったのを参考にすれば解決するのか。

今度書くときは自分で高さ、幅や余白を考えながら取り組みます。

.intro-section__block:nth-child(even)
にCSSを適用することにより、偶数番目の場合を指定できる。

明日はJavaScriptⅠを終わらせ、Ⅱを終わらす。
それに加えて、Krowlさんの模写に取り組みます。

明日も頑張りましょう！

0:17
borderを使用した三角形（吹き出し）の作り方

# 概要
borderによる三角形の作成方法を応用して、次のような吹き出しを作成することができる、ということが分かったので、記録します。
<img width="781" alt="スクリーンショット 2019-11-03 1.53.40.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/515100/31cf7db2-3772-2972-a556-0640f8142a44.png">

#borderで三角形を作成する方法
borderが幅をもつ要素であることを利用して、三角形を作成することができます。
全体のコードは以下の通り。
<img width="323" alt="スクリーンショット 2019-11-03 1.53.40.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/515100/4cae9edb-a458-d4de-e6e9-5dd555c545f2.png">

## 手順１：空要素を設定
幅・高さ０の空のボックス要素を設定。
この要素の周りにborderで枠線をセットしていきます。

## 手順２：borderで四角形を作ってみる
border自体に幅があるため、
次のように、borderの中の要素を高さ・幅ともに０に設定した場合、border
自体で正方形を作成することができます。

（コード）
.test{
	display: block;
	width:0px;
	height:0;
	border-top: solid 50px red;
	border-right: solid 50px blue;
　}
（作成される四角形）
<img width="92" alt="名称未設定2.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/515100/4a8478be-b2f8-b8a8-2319-ea53d92b7b62.png">
　topを赤、rightを青にしてみると、このようにborderの境界線が斜めになります。境界線がこのように斜めになることを応用し、三角形を作成していきます。

##　手順３：三角形の斜辺に当たる部分のborderの色を透明にする
手順２にborder-leftを加え長方形を作成します。
このときに、borderの幅には作成した三角形の高さを設定します。
<img width="373" alt="名称未設定.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/515100/9557f3d5-edae-36d4-dc0c-144ca6a79aa4.png">

次に、余分な部分（三角形の斜辺を作成しているborder-leftとborder-right）の色を透明にします。
<img width="473" alt="名称未設定.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/515100/d9cbf625-167b-1a40-79a0-88a5a4a3401a.png">

blueの設定にしていた部分を、transparentにすることで透明にすることができます。
このようにして、三角形を作成することができました。

#吹き出しの作成
三角形を他のボックス要素に重ねることで吹き出しのような形を作成することができます。

##手順１：適当なボックス要素を準備
吹き出しの元となるボックス要素を準備します。
<img width="1440" alt="スクリーンショット 2019-11-03 23.36.14.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/515100/35d9fa6f-2c07-2f7c-c7d1-6b9f32d13ca2.png">

##手順２：準備したボックス要素にposition:relativeを設定
手順１で作成した長方形に、三角形を重ねるため、position:relativeをセットします。

##手順３：同じ色の三角形を作成
吹き出しの元となるボックス要素と同じ色の三角形を作成します。
（先ほど記載した通り、borderを使用して作成）

<img width="947" alt="スクリーンショット 2019-11-03 23.42.33.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/515100/0d93e9b5-d3f9-64d8-7601-913781bddaa5.png">

##手順４：三角形にposition:absoluteを設定
吹き出しの大きさ、位置をposition:absoluteで調整します。

<img width="957" alt="スクリーンショット 2019-11-04 0.05.29.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/515100/6eaba95b-976d-f17f-a9c0-311c13452faa.png">

吹き出しの完成です。
Rackアプリケーションの実行方法いろいろメモ

ほとんど参考サイトの再構成によるメモ

# rackup コマンドを使う

- rackup コマンドで実行する
- コード内で `run [RackApp]` を実行する
- `config.ru` に設定やコードを書く（ただし rackup コマンド実行時に別のファイルを指定も可能）

## インスタンスメソッドを使う

```sh:実行コマンド
> bundle exec rackup -o 0.0.0.0
```

```ruby:config.ru
require './app.rb'
run SimpleApp.new
```

```ruby:app.rb
class SimpleApp
  def call(env)
    [200,{ 'Content-Type' => 'text/html' },["Hello"]]
  end
end
```

***

もちろん以下のように `config.ru` にまとめても可。

```ruby:config.ru
class SimpleApp
  def call(env)
    [200,{ 'Content-Type' => 'text/plain' },["Hello"]]
  end
end

run SimpleApp.new
```

## クラスメソッドを使う

```sh:実行コマンド
> bundle exec rackup -o 0.0.0.0
```

```ruby:config.ru
class SimpleApp
  def self.call(env)
    [200, {'Content-Type' => 'text/plain'}, ['Hello']]
  end
end

run SimpleApp
```

## Proc.new を使う

生成されるオブジェクトは `call` メソッドを持つ。

```sh:実行コマンド
> bundle exec rackup -o 0.0.0.0
```

```ruby:config.ru
run Proc.new { |env| ['200', {'Content-Type' => 'text/html'}, ['Hello']] }
```

以下でもおｋ。

```ruby:config.ru
run lambda {|env| [200, {'Content-Type' => 'text/plain'}, ['Hello']] }
```

# rackup コマンドを使わない（ハンドラから直接実行する）

```sh:実行コマンド
> bundle exec ruby my_rack_app.rb
```

```ruby:app.rb
require 'rack'

app = Proc.new do |env|
    ['200', {'Content-Type' => 'text/html'}, ['Hello']]
end

Rack::Handler::WEBrick.run app

```

# 参考サイト

Rack解説 - Rackの構造とRack DSL - Qiita https://qiita.com/higuma/items/838f4f58bc4a0645950a#rack%E3%82%A2%E3%83%97%E3%83%AA%E3%82%B1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3%E4%BB%95%E6%A7%98

Rack: a Ruby Webserver Interface http://rack.github.io/
UiPathのStudioXを使うための、インストーラダウンロード方法とインストール

# UiPathのStudioXを使うための、インストーラダウンロード方法とインストール
[UiPath Studio XとUiPath Studioをさっそく比べてみる](https://qiita.com/RPAbot/items/f7a62f74063c215c5f2c)
や
[UiPathでお手軽に自動化ができるStudioXが使えるようになったらしい](https://qiita.com/mima_ita/items/880309e7513bf5f654bb)
を見て、ちょっとやってみようと思って最新版のUiPathをダウンロードしても、StudioXが使えなかった人（私）用のメモ

# そもそも UiPath Cloud Platform のTOP画面からダウンロードできるインストーラはStableなので、StudioXは入っていない
ここの「Studioをダウンロード（communityedition）」はStableなのでXは入っていない。
![コメント 2019-11-03 234636.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/129423/88a0681a-2a62-d065-00ad-45f5f4cb745c.png)

# どこにあるか
ここの↓
![コメント 2019-11-03 234847.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/129423/f04b1fe6-0da9-9726-1a9e-9451fa2112ff.png)
ここ↓
![コメント 2019-11-03 234937.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/129423/d74989d5-6b55-9fd2-247d-173363f6cf58.png)

# インストール
インストールの途中でStudioかStudioXを選ぶ箇所が出るため、ここでStudioXを指定
![コメント 2019-11-03 235502.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/129423/49b63e32-8939-b24b-7f01-a72ebde3d709.png)

# StudioXから無印Studioに戻すには
ここからスイッチできる。
![コメント 2019-11-03 235343.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/129423/2dfdcfcc-c827-0d25-e29a-4117c79fad1e.png)
Visual Studio Codes での snippets の作り方


# Visual Studio Codes での snippets の作り方

職場では atom　を使って snippets を使っているけど、ちょっと visual studio code での snippets も欲しいと思い探し始める。


## 参考リンク

- [Visual Studio Code ソースコードはスニペットと「Ctrl + space」で書いちゃいなよ](https://mseeeen.msen.jp/vscode-snippet/){発行元: MSeeeen, 発行日時: 2018/06/13}
- [Better way to define multi-line code snippets in VS code?](https://stackoverflow.com/questions/41856706/better-way-to-define-multi-line-code-snippets-in-vs-code){Org: stack overflow, Time: 2017/01/25}
    - 引用
        - 投稿主
            - `In Sublime Text you can define multi-line code snippets with whitespaces in a snippet file as you write a regular document, but when it comes to the similar multi-line snippets in Visual Studio Code, as far as I know it has to be a JSON entry where you have to break down each line into a double-quoted string element in a list, or use explicit ASCII linebreak (\n) characters in one string.`
            - `I wonder if there are better ways for defining code snippets, especially when it's long.`
        - 回答者
            - `I cannot find a good way to create multi-line snippets either. It's probably one of the features I'd like to see improved the most. As another answer suggested, there are a couple extensions out there to help with Snippet creation (like this and this). However, they don't escape literal dollar signs and indentation isn't great.`
    - コメント
        - どうやら Visual Studio Code の Snippets 登録は優しくないらしく現状は一気にコピペで埋めれるようなものはないそうである。atom は snippets を .cson で実装しているがそれが問題か？json と cson の違いなんて分からないが。つまるところ atom でできた以下のような書き方が Visual Studio Code　では不可能であるということだ
 
        ```
            "link テンプレ": {
                "prefix": "link",
                "body": [
                    """
                    console.log('$1');,
                    aaaa
                    """
                ],
                "description": "Log output to console"
            }
        ```

## 実作業

1. snippets を開く。
    - `ファイル → 基本設定 → ユーザースニペット`
         - alt f, p, ss, で 行けた。
            - ![imgs20191103_snippets_1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/520812/45ff75ea-ac21-e228-ef17-fc3b1ad89149.png)
2. markdown.jsonを開く
    - ![imgs20191103_snippets_2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/520812/db3f534e-22c2-ff68-78f0-a3135ab45dea.png)
3. snippets を記述する。
    - Visual Studio Code ではどうやら インデントなども `""` で区切らないといけないようなである。
        - ![imgs20191103_snippets_3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/520812/d369bc43-4666-e364-9cc6-2bb5067e8332.png)
    - よってやり方は以下のようにやるのがいいだろう。
        1. body 部分を書いたり貼り付けたりする。
        2. 先頭行を ctrl + alt で複数個所同時選択。
        3. 先頭に`"` をつける
        4. alt + end で最後まで行って `",` を最後につける。
        5. 一番最後の行に `,` はいらないので抜かす


## 最後に

json と cson の違いとかで snippets の追加の仕方が難しくなっているなどがわかる方がいたら是非教えてください。

## 2019/11/04 修正

コードブロックがうまくできていなかったので修正しました。
Railsのcreateメソッドは保存に成功しても、失敗してもモデルオブジェクトを返す

Railsのcreateメソッドは、オブジェクトの作成と保存を同時に実行できます。
注意点として、createメソッドは保存に成功しても、失敗してもモデルオブジェクトを返すので、saveメソッドのようにif文で保存成功可否を判定しようとすると、どちらの場合も必ず真になります。

# 環境
```
$ rails -v
Rails 5.1.7
```

# 検証
Userモデルの保存時に、nameを必須にします。

```ruby:user.rb
class User < ApplicationRecord
    validates :name, presence: true
end
```

createメソッドは保存に成功しても、失敗してもモデルオブジェクトを返します。

```ruby
# 保存成功
User.create(name: "testuser")
=> #<User id: 1, name: "testuser", created_at: "2019-11-03 14:22:46", updated_at: "2019-11-03 14:22:46"> 

# 保存失敗 
User.create(name: nil)
=> #<User id: nil, name: nil, created_at: nil, updated_at: nil> 
```

そのため、以下のようにcreateメソッドにif文を使うと、nameがnilで保存に失敗しますが、Userオブジェクトを返すのでifの条件式は真になります。
※Rubyのif文で偽になるのは、falseとnilのみ。

```ruby:正しく動かない、保存処理
if User.create(name: nil) # 保存失敗だけど
  redirect_to successed_path # successed_pathに遷移してしまう
else
  redirect_to failed_path
end
```

正しく動くようにするには、以下のように実装してください。

```ruby:正しく動く、保存処理
user = User.new(name: nil)
if user.save # 保存失敗して
  redirect_to successed_path
else
  redirect_to failed_path # failed_pathに遷移する
end
```

# 保存メソッドの返り値
|メソッド|保存成功|保存失敗|
|:---:|:-----:|:----:|
|save| true |  false |
|create | 保存に成功したオブジェクト | 保存に失敗したオブジェクト |

# 修正希望の記事
createメソッドの返り値がtrue, falseであると、記載されている記事です。

- [Railsのcreateの使い方を現役エンジニアが解説【初心者向け】](https://techacademy.jp/magazine/22074)
- [Ruby on RailsのCRUDを学ぶ。Create編。createメソッドとsaveメソッド](https://web-nari.net/2018/07/13/ruby-on-rails-crud-2/)

# 参考
- [Active Record create の戻り値](http://libitte.hatenablog.jp/entry/20150929/1443532641)
- [Railsのモデルの作成、検索、更新、削除のよく使うメソッドのまとめ](https://ruby-rails.hatenadiary.com/entry/20140724/1406142120)
ubuntu19.04でハイバーネート(hibernate)したい

お久しぶりです!まちゃです!
最近VAIOのSX12を買ってようやく届いたので早速ubuntuをインストールしてハイバーネートしていきたいと思います!

#ハイバーネート(hibernate)とは
そもそもハイバーネートってなにって思う方のために簡単に説明します!
簡単にいうと電源を落とすやつです。
・・・。シャットダウンと何が違うのと思うはずです。
でもシャットダウンと圧倒的に違うものがあります。それは起動時間と電源を落とした状態に戻ることです。
ここから詳しい説明になるんですが、ハイバーネートは現在のRAMの情報をswapに一度保存し、起動するときにそこから情報を取り出します。なのでChomeが動いていたらそのまま起動してくれるんです!しかもRAMの状態そのままを保存するので開いていたページがそのままなんです!素晴らしい!!
は?って思う方はそんなのもあるんだー、くらいで捉えてください。
マジかよ!!ってなった方、これからやり方の一例を紹介するので良かったら見てってください!

#ハイバーネートの仕方
それでは一例を紹介していきます!
今回自分がやったのは`swapパーティション`を準備してそこに書き込ませました! `swap file`でやろうとしている方ごめんなさい今回は紹介しません。(チャレンジしてできなかったから...)

##swapパーティション
インストールする際に確保してある方はそのまま次へ進んでください!
パーティションを作ってない方は`GParted`や`fdisk`コマンドで作成し、`mkswap`を使い`swap領域`を作成してください!(自分はやってなので詳しい説明はできませんが参考にすればいけんじゃねってのがあったのでそちらを貼らせていただきます。ごめんなさい!
[GParted](https://www.milkmemo.com/entry/ubuntu_partition_resize)
[fdisk](https://www.atmarkit.co.jp/ait/articles/1803/01/news034.html)
[mkswap](https://kazmax.zpp.jp/linux_beginner/mkswap.html)
どれくらい確保するかは[こちら](https://server.etutsplus.com/allocate-swap-space/)を参考にしてみてください!

##initramfsとgrabの設定
パーティションがすごい適当になってしまいごめんなさい。
パーティション作成が終わったら次に`initramfs`と`grab`にパーティションのある場所(UUID)を指定してあげます。

###initramfs
こちらは`/etc/initramfs-tools/conf.d/resume`というファイルに場所(UUID)を指定してあげます。
UUIDの確認は`ls -l /dev/disk/by-uuid/`で確認できます。
確認したら先程のファイルに書き込んでいきます。(ファイルがない場合は作成してください)

```:resume
RESUME=UUID="パーティションのUUID"
```
"は無しで書いてください
保存が終わったら更新します。

```
$ sudo update-initramfs -u -k all
```
initramfsはこれで終了です!

###grab
次はgrabの設定です。
grabは`/etc/defaults/grab`を編集します。
GRUB_CMDLINE_LINUX_DEFAULT="quiet splash"
この行の最後にさっきと同じのを書きます。

```
GRUB_CMDLINE_LINUX_DEFAULT="quiet splash resume=UUID="パーティションのUUID"
```
書き終わったら更新して完了です。

```
$ sudo update-grab
```

##fstab
次にfstabに書き込んでいきます。
`/etc/fstab`に

```
/dev/nvme0n1p2   none    swap    defaults,pi=1  0   0
or
UUID="パーティションのUUID"   none    swap    defaults,pi=1  0   0
```
のどちらかを書いてください。上の方の指定先はパーティションの場所です。
もしfstabの中に`/swapfile`の文があればコメントアウトしておきましょう。(しなくてもいいかもです)

###その後
一通りの設定が終われば一度再起動しましょう。
起動したら一度

```
$ sudo systemctl hibernate
```
とハイバーネートしてみてください。
うまく行けば、起動してログインしたときにターミナルに先程のコマンドが残っているはずです。
うまく行かなかった方は一度

```
$ swapon -s
```
と打ってください
そのときにハイバーネート時に書き込みたい方が下にある場合はもう一度fstabを開き書き込みたいもの以外のswap領域をコメントアウトしてみてください。その後再起動や`sudo swapoff -a → sudo swapon -a`を実行してもう一度`swapon -s`で確認してひとつだけになっていたらもう一度ハイバーネートしてみてください。
それでもうまく行かなかった方はごめんなさい頑張ってググってください。
また書き込みたいのが上またはひとつだけのときもググってください。

#最後に
すごい中途半端ですが以上になります。
今回引っかかったのが最後のswapの優先順位だけでその他はなく、トラブルシューティングの参考がまったくなくて申し訳ないです。。。
今回紹介した方法でできなかった方も諦めずに頑張ってください!!
すごい適当になってしまいましたが以上で終わります!また見てね!!
jQuery勉強しようと思ったらいきなり「uncaught referenceerror $ is not defined」が出てきた

**はじめに**
2019/11/4 記事編集しました。
ご指摘をくださった　@nagtkk さん　@loki__qiita さん、ありがとうございました！！！



# "uncaught referenceerror $ is not defined" と出会ったときに試すこと

ある研修でもらったjQueryのテキストを引っ張り出してカタカタと打ってみた
動かしてみた

動かんやん
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/513179/e658c3c9-6835-a4d3-45f3-8a1ad92e224e.png)

ソースはこちら

```calc.html
<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <script src="./src/calc.js" defer></script>
        <script src="http://code.jquery.com/jquery-3.3.1.min.js" defer></script>

    </head>

    <body>
        <input type="number" id="num-1">
        +
        <input type="number" id="num-2">
        <button id="button-calc"> 計算 </button>

        <!-- 動的に計算結果を挿入する箇所 -->
        <div id="div-result"></div>
    </body>

</html>
```
```calc.js
//フォーカス移動
$('#num-1').focus()

//計算ボタン押下時のイベントを登録
$('#button-calc').on('click', () => {

    //画面要素参照
    const $num1Element = $('#num-1')
    const $num2Element = $('#num-2')

    //　入力値取得
    const value1 = $num1Element.val()
    const value2 = $num2Element.val()

    const result = Number(value1) + Number(value2)

    alert(`計算結果 = ${result}`)

})
```

ごくごく普通のThe☆入門編
でも動かない。

テキスト通りなのに動かない

#結論から言うと読み込むライブラリの順番を変えると動く

```calc.html
    <head>
        <meta charset="UTF-8">
        <script src="./src/calc.js" defer></script>
        <script src="http://code.jquery.com/jquery-3.3.1.min.js" defer></script>
    </head>
```
この順番だと、calc.jsを実行する時点では jQuery がまだ無いのでエラーとなる。
※jsは上から順に実行される。

なので↓

```calc.html
    <head>
        <meta charset="UTF-8">
        <script src="http://code.jquery.com/jquery-3.3.1.min.js" defer></script>
        <script src="./src/calc.js" defer></script>
    </head>
```

とすれば動くようになる。
laravelとVueの設定時の"Failed to mount component: template or render function not defined"エラー


laravelとVue.jsのセッティングをしていたらこのエラーが表示


![スクリーンショット 2019-11-03 23.19.03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/244070/c7bef1c7-b9a2-48f5-71bb-46b77381e598.png)

色々調べた結果、Vue.componentの最後に.defaultが必要らしい。

```javascript:/resources/js/app.js
Vue.component('example-component', require('./components/ExampleComponent.vue'));   
```

こちらに変更してみる。

```javascript:/resources/js/app.js
Vue.component('example-component', require('./components/ExampleComponent.vue').default);   
```


エラーがなくなった！
けど、なぜかよくわかっていない。。

![スクリーンショット 2019-11-03 23.24.12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/244070/2df5090f-36c0-7790-a35d-18dc53a8e9cf.png)
sshでリモートと接続

sshポートフォワーディングの自分用メモ

遠隔用サーバをAAAA, 手元PCをBBBB, 中継サーバをC(サーバ名CCCC　ユーザ名abcxyz)とする。
AAAAにあるCへの秘密鍵のファイルパス名はAtoC.pem
BBBBにあるCへの秘密鍵のファイルパス名はBtoC.pem
としておく。jupyter notebookをAAAAで立ち上げた後に，Bから下記の方法で接続するためのメモ。

###手順の概要
(1)  AAAAの8888ポートからCの54321ポートへ接続
(2)  BBBBの55555ポートからCの54321ポートへ接続
(3)  (1)と(2)の後に，BBBBのlocalの55555からAAAAの8888へブラウザでアクセスする

始める前に，中間サーバーCでのfirewall設定も確認しておく。

```shell-session
###:~$ sudo ufw status
Status: active

To                         Action      From
--                         ------      ----
80                         ALLOW       Anywhere                  
54321                      ALLOW       Anywhere                  
22                         ALLOW       Anywhere                  
80 (v6)                    ALLOW       Anywhere (v6)             
54321 (v6)                 ALLOW       Anywhere (v6)             
22 (v6)                    ALLOW       Anywhere (v6)   
```

####(1)
まず普通にAAAAに何らかの形でssh接続をした後に，
AAAAからCへ接続

```shell-session
ssh -R 54321:localhost:8888 abcxyz@CCCC -i AtoC.pem
```

####(2)
手元PC(BBBB)からCへ接続

```shell-session
ssh -L 55555:localhost:54321 abcxyz@CCCC -i BtoC.pem
```


####(3)
(1)と(2)が終了した後に，ブラウザで
https://localhost:55555/ (もしくはhttp://localhost:55555/)
へアクセスするとJupyter notebookにつながる。
ターミナルのシェル変更

iterm2を導入したらshellがbashからzshに変わってエラー
が長引いたのでその対策の備忘録を書こうと思いました。

**シェルの概要**

-そもそもシェルとは❓
　いわばPCの受付でここから、命令(コマンド)を出したりする機能
　LInuxの最も基本的な機能のこと
　※linuxはwindowsやandroidのようなOSの一種

-シェルの種類
　bash
  　zsh
  　など細他多数
　ヒストリー機能や使いやすさなど違いがある

**シェルの変更**

基本は
chsh -s /bin/bash(zshなど変更したいshell)

他にも
which tcsh
/bin/tcsh

vi /etc/passwd
kororo:x:510:510::/home/kororo:/bin/bash(zshなど変更したいshell)

などがある
babel実行時に「Support for the experimental syntax 'objectRestSpread' isn't currently enabled」と言われる場合の対応方法

# 概要
古いパッケージをアップデートしたところビルド時に`Support for the experimental syntax 'classProperties' isn't currently enabled`というエラーが出るようになったので対応方法を調べました．

```
ERROR in ./src/options/icons/clear.svg
Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: D:\hoge\src\options\icons\clear.svg: Support for the experimental syntax 'objectRestSpread' isn't currently enabled (6:3):

  4 | export default (({
  5 |   styles = {},
> 6 |   ...props
    |   ^
  7 | }) => React.createElement("svg", _extends({
  8 |   xmlns: "http://www.w3.org/2000/svg",
  9 |   viewBox: "0 0 24 24",

Add @babel/plugin-proposal-object-rest-spread (https://git.io/vb4Ss) to the 'plugins' section of your Babel config to enable transformation.
```

# 対応方法
1.　`@babel/plugin-proposal-object-rest-spread`をインストール  

```
npm install -D @babel/plugin-proposal-object-rest-spread
```
2.　`babel.config.js`に次のように記述

```babel.config.js
module.exports = {
  "plugins": ["@babel/plugin-proposal-object-rest-spread"]
}
```
**`.babelrc`に記述しても効果がないので注意．**
`.babelrc`や`webpack.config.js`でbabelの設定をしている場合でも上の内容は`babel.config.js`に記述する必要がある．

`.babelrc`・`webpack.config.js`と`babel.config.js`は併用できるが，設定が分散するのが嫌な場合は`babel.config.js`にまとめるとよい．

* **`.babelrc`から設定を移す場合**
`.babelrc`を`babel.config.js`にリネームして上の内容を追記

* **`webpack.config.js`から設定を移す場合**
`webpack.config.js`内のqueryキーで指定したbabel設定を`babel.config.js`に記述し上の内容を追記 (参考:[webpackで.babelrcっているんだっけ？ - 30歳SIerからWEBエンジニアで奮闘](http://karuta-kayituka.hatenablog.com/entry/2018/09/06/175701))

# 環境

node: v8.11.4
@babel/core: 7.6.4
@babel/plugin-proposal-object-rest-spread: 7.6.2
react-svg-loader: 3.0.3

## 参考
https://github.com/babel/babel/issues/6970
https://github.com/babel/babel/issues/7879
Arduinoでタコメーター作成～波形整形ソフトウェア編～

前回に引き続き、今回は波形整形MCUのソフトウェア編です。

今回は多様な車両にもハード変更せずソフトウェア変更で現場で対応する必要があるので
このように波形を整形するMCUと、実際に回転数を算出してcsv出力するMCUに分ける必要が
ありました。

とりあえずいきなりですが、コード（素人全開のコーディングではずかしい）公開します。

以下コードです

```
#include <Wire.h>

int signalin  = A0;      //A0pin読み取り設定
int signalout = 10;      //D10pin出力設置
int signalVal = 0;       //アナログ値格納用
float sigV    = 0;       //信号電圧
int delaytime = 3;      //検出無効時間設定ms（オシロスコープで測定したノイズの発生時間を入力
float sigline = 0.65;    //信号として扱う電圧の閾値設定用

 
void setup() {
 //Serial.begin(9600);
 pinMode(signalout,OUTPUT);
}
 
void loop() {
 signalVal = analogRead(signalin); 
 sigV = signalVal*5.0/1023;
 if(sigV > sigline){
  digitalWrite(signalout, HIGH );
  delay(delaytime);
  digitalWrite(signalout, LOW  );
 }
}

```

はい
以上をコピペしてコンパイルして転送すればもう出来上がりですが、一応それぞれの役割を記述しておきます

```
void setup() {
 //Serial.begin(9600);
 pinMode(signalout,OUTPUT);
}
```
ここではデータみたかったのでシリアル通信のコードが入っていますが無視してもらって結構です。
pimodeでD10pinを出力設定しています。

```
 signalVal = analogRead(signalin); 
 sigV = signalVal*5.0/1023;
````
ここでは点火信号電圧を読み取るためのコードです。
5vを1024分割して約4.9mVの分解能で検出できます。

```
 if(sigV > sigline){
  digitalWrite(signalout, HIGH );
  delay(delaytime);
  digitalWrite(signalout, LOW  );
```
ここではアナログの信号電圧が設定電圧以上になった場合に入るルーチンです。
ここのコードで信号波形を整形しています。

>信号電圧が一定でない→ある程度低めにトリガーする必要があるがそれだとノイズで誤作動する
ノイズが多い→低めにトリガー設定することができない

このふたつの課題があったのですが、信号発生後指定時間だけdelayすることで、信号発生後のノイズが十分減衰するまで無視することで解決しました。

では実際の信号波形を見てみましょう。
プローブは×1でMCU1のA0pinとGNDで計測したデータです。

HONDA FTR 
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/408650/1f25b90b-82c6-3c1b-d17a-7716448aa880.png)

kawasaki KSR 110
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/408650/9bb62ab3-37cd-6312-228c-bfe3bb009017.png)

kasawaki Eliminator 125
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/408650/847d82c5-91c9-5ed3-a1aa-6d8848f2b455.png)

はい。
ここまでバラバラなデータが出ます。
このように信号電圧が一定ではないので、取りこぼしを防ぐためにも最小値でトリガーする必要があります。
しかしこれだと大きい信号が出たあとのノイズで誤検知します。
そこで信号発生から次の信号までの間でノイズが十分減衰するまでdelayさせて無視しています。
なので仕組み上3msディレイで動作させると検出可能な回転数の上限は

>1000(ms)/3(ms)×60(s)=20000min-1

になります。
ディレイが長くなれば長くなるほど上限回転数は低くなります。
今回は汎用性が求められていて常用回転域での使用なので問題にはなりませんが、この方式でやるならノイズの発生をよく観察して適切にdelayさせる時間を決める必要があります。

すこし長くなりましたがとりあえず「波形整形ソフトウェア編」は終わりです！
次は「回転数算出ソフトウェア編」でお会いしましょう！
GAE/PHP72 CakePHP3のindex.php問題

GAE/PHP72にCakePHP3インストールすると、リンクとフォームのアクションURLの先頭にindex.phpが付いてしまう問題。

app.phpのApp.baseを''にする。

```php:app.php
return [
    'App' => [
        'base' => '',
```
Deep Learningの実装を始めるのに最適なCouseraのTensorFlow入門コース

今まで、CouseraのAndrew Ng先生の[Machine Leaning](https://www.coursera.org/learn/machine-learning?)を受講したり、有名な[ゼロから作るDeep Learning](https://www.oreilly.co.jp/books/9784873117584/)を読み、本にしたがってコードを書いたりしていた。

ただ自分で新たにDeep Learningのネットワークを作って実装をする際になにから始めるかが不明だった。そんなときに以下のコースを見つけ、受講してみたら予想以上に良かった。
[Introduction to TensorFlow for Artificial Intelligence, Machine Learning, and Deep Learning](https://www.coursera.org/learn/introduction-tensorflow/home/info)

# コースの特徴
- 数学的な説明はほぼない
- 機械学習について背景知識は必要
- 内容はかなり入門
- Jupyter Notebookで作業
- Googleのcolabなどへのリンクもあり、その上で作業も可能なので環境構築は不要
- 課題もCousera上のJupyter NotebookからSubmit可能

# 身についたこと
- Tensorflow/Kerasが使えるようになった
- 自分でネットワークの層を追加したり、試行錯誤できるようになった

# 内容
## Week 1. A New Programming Paradigm<br>
機械学習と通常のプログラミングの違いについて説明される。かなり基礎的な内容。
課題では回帰問題をTensorflowを使って解いた。
## Week 2. Introduction to Computer Vision<br>
Fashion MNISTのデータを使って分類問題を解く。この週にはCNNは用いず、画像データを一列のベクトルとして、DenseなNeural netで解く。この過程でKerasを使ったネットワークの構成の仕方が身についた。
また、epoch終了後にコールバックを呼び出す方法を学ぶ。これにより、accuracyが一定以上になったら学習を終了することができるようになった。
課題では通常のMNISTの分類問題を解いた。
## Week 3. Enhancing Vision with Convolutional Neural Networks
Week 2.のFashion MNISTの分類問題をCNNで解く。CNNについてのごく簡単な説明と実際にTensorflow/Kerasで実装する方法について学ぶ。Convolution結果の可視化をしたりもして、理解が深まった。また、自分でConvolution層の数を変更したり、Max Poolingを除いてみたりなど試行錯誤して、accuracyや学習および推論の速度にどのような影響があるのか経験することができた。
## Week 4. Using Real-world Images
Week 3で行ったことを実画像 (Mピクセル、カラー画像、オブジェクトが中央に写っていない)に適用する。具体的には「人」と「馬」画像の分類。以下が中間層の出力の可視化などが特に参考になった。

# まとめ
レビューなどでも書かれているように確かに内容やエクササイズは簡単。CourseraのAndrew Ng先生の[Machine Leaning](https://www.coursera.org/learn/machine-learning?)や[ゼロから作るDeep Learning](https://www.oreilly.co.jp/books/9784873117584/)で学んだ後の次の一歩としていいのではないか。
GitHub Actionsでキャッシュが使えるようになって嬉しい！

# 概要
- GitHub Actionsでキャッシュが出来るようになった
- まだβ版で正式公開ではなさそう
- CircleCIなどと似たような感じでキャッシュ周りの設定を書ける

**[actions/cache - https://github.com/actions/cache](https://github.com/actions/cache)**

# 何が嬉しいのか
`yarn install` に1分以上かかってたがそれが省略出来る。
Litner,Test...とジョブごとに分けてたら当然ジョブ毎にモジュールのインストールが必要で「ウーーン」となってたのでとても嬉しいです。

# サンプル
公式のリポジトリに様々な例がありますがここではJavaScript(yarn)の場合とElixir(mix)の場合を紹介します
やってることとしては何をキャッシュするかの記述と保存する時に使われるキーの設定です

## JavaScript
```yaml
jobs:
  # Linterに走ってもらうジョブ
  Lint:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v1
    - name: Cache node_modules
      uses: actions/cache@preview
      with:
        path: ~/.cache/yarn
        key: ${{ runner.os }}-projectname-${{ hashFiles(format('{0}{1}', github.workspace, '/yarn.lock')) }}
        restore-keys:
          ${{ runner.os }}-projectname-
    - name: Install node_modules
      if: steps.cache.outputs.cache-hit != 'true'
      run: yarn install
    - name: Lint
      run: yarn lint

```

## Elixir
```yaml
jobs:
  Test:
    runs-on: ubuntu-latest

    steps:
    - uses: actions/checkout@v1
    - uses: actions/setup-elixir@v1.0.0
      with:
        otp-version: 22.0
        elixir-version: 1.8.0
    - name: Cache deps
      uses: actions/cache@preview
      with:
        path: deps
        key: ${{ runner.os }}-projectname-${{ hashFiles(format('{0}{1}', github.workspace, '/mix.lock')) }}
        restore-keys:
          ${{ runner.os }}-projectname-
    - name: Install deps
      if: steps.cache.outputs.cache-hit != 'true'
      run: mix deps.get
    - name: Testing
      run: mix test
```

# ハマりポイント
## hashFilesに渡すディレクトリ
`package-lock.json`とそのまま渡すと失敗します
公式のサンプルは`**/package-lock.json`といった書き方が多いですが、それらよりyarnのサンプルのように`github.workspace`を使ってあげるのが良いと思っています

## containerオプションを指定してるとコケる
弊社プロジェクトでは以下のようにnode.js 10.0を用いて各ジョブを走らせるようにしていました

```yaml
container:
  image: node:10
```

しかし`actions/cache@preview`を設定してると「Stop Containers」の後に「Post Cache node modules」が走り、CIが落ちます

```
Post job cleanup.
/usr/bin/docker exec  ... sh -c "cat /etc/*release | grep ^ID"
Running JavaScript Action with default external tool: node12
Error: No such container: ...
##[error]Node run failed with exit code 1
```

まだβ版だし仕方ないのかな..？(解決策募集)

# 最後に
あとは設定ファイルを綺麗に書くための仕組みが出来上がれば最高of最高です

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">GitHubActions、yamlのanchorが使えないのが辛いのと、CircleCIでいうcommandsみたいなのが無いのが辛い</p>&mdash; nagimaru (@ngmr_mo) <a href="https://twitter.com/ngmr_mo/status/1177208938451701760?ref_src=twsrc%5Etfw">September 26, 2019</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

# 追記
Elixirのサンプルを書いたらマージして貰えた
https://github.com/actions/cache/pull/42
(Windows) RustでCargo run してHelloWoldをだす！

記念すべきQiita初投稿！
一作目はRustのインストール＆設定についてです。

インストールしてCargo runをすることができたので、その流れをここにメモっていきます。

前提として、OSはWindows10。
コマンドはcmdを使用しています。
C++ビルドツールはVisual C++のものです。


#rustupをインストールする
###rustupに始まりrustupに終わる

rustup はRust関連のなんかいろいろをまとめて管理してくれるコマンドラインツールです。
cargoもrustcもまとめて入れてくれます。
そしてアンインストールするその瞬間までお世話になります。

ただWindowsユーザーはMacユーザーと異なり、C++ビルドツールも必要になってくるので、そこだけ注意が必要です。（後に詳細を記載しています。）

###インストールの流れ

[rustup公式サイト](https://rustup.rs/)　でできます。
このサイトにある、「rustup-init.exe」というファイルをダウンロードして、実行してください。
実行すると、以下のような画面が表示されます。
![rust1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/505621/53bd7ad8-8db9-7817-e57c-e0393b8ec161.png)

※下部を切り取った画像なので、文頭はHello！～みたいな文になっていたかと。

この時点で文面が違う方は、原因の一つにC++ビルドツールが入っていないことが考えられます。
続行できた気がしなくもないですが、この記事ではひとまずビルドツールが”ある”状態で進んでいきます。
あ、ビルドツール欲しいって方は、ここを飛ばして最下部の文章を先にどうぞ。

下３行部分で、インストール時のお好み選択肢が出されています。
特にファイル場所とかにこだわりなければ、１でよろしいかと。

***

　補足として、私のはwindows-msvcですが、windows-abiというのもあるみたいです。違いとしては、

+ msvc = Visual Studioのツールチェーン
+ abi = MinGWなどのGCCツールチェーン
らしいです。細かな部分はわかりませぬ。

***

数字を入力してEnterで、インストールが始まります。
「info：」の行がぶぁーっと出てきて、最後に、
![rust2 (2).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/505621/f35f9f84-d3ec-6067-9745-9c72a9223081.png)
このような文になったら完了です。
(continueってワードがありますが、私がenterしたら閉じたっきりになったので、この続きがもしれあればわかりません。)


cmd で[rustup --version]と打ち込んで、
「rustup 1.20.2 (13879a968 2019-10-16)」という感じの返答が来れば、インストールできています。

もしもこれら手法が適していなさそうであれば、この記事の最後にあるリンクの「rustupの他のインストール方法」をご参照ください。


###Cargoを設定する

PCのファイルのどこかに、「.cargo/bin」の並びのファイルが入っているはずです。
それを見つけ出して、環境設定からPATH登録してください。

PATH登録ってなにって方は、他のQiita記事をご活用願います…。

cmdで、[cargo --version] と打ってみて、
「cargo 1.38.0 (23df9a4af 2019-08-20)」っぽい返答が出てきたら、使えるようになっています。





#プロジェクトを作る

ファイルの場所はお好みで。
場所が決まったら、そこに移動して以下のコマンドを打っていきます。

```cmd.exe
> cargo new hello-cargo --bin
> cd hello-cargo
> cargo run --release
```
この３行を順にやっていけば、HelloWorldが表示されるかと。

JavaとかではいちいちHelloWorldを書いていたのですが、もうそれすらも書かなくてよくなったのですね…。すごいなー。

これで、HelloWorldまでの流れは終了です(^-^)ノRustを楽しみましょう！



#以下 C++ビルドツール欲しい人向け

C++ビルドツール要求されてるから欲しいよ！という方に向けて、下にリンクを貼っておきます。
Visual Studio 2019 用のビルドツールです。
VS系持っていない方が、もしもダウンロードできなかったらすみません。他を探索してみてください。
もしくは、この際なのでVS系デビューしちゃいましょう+*☆。

https://visualstudio.microsoft.com/ja/downloads/?rr=https%3A%2F%2Fwww.google.com%2F



場所は、2019年現時点では、
ページ下部「すべてのダウンロード」
↓
「Visual Studio 2019 のツール」
↓
の、「Build Tools for Visual Studio 2019」をダウンロードします。

その後、ローカルで実行して、
「C++ Build Tools」というのを選んでダウンロードしてください。


これで、完了です。
rustupインストールへと進みましょう(^-^)


#参考になるサイト様
情報収集に使えそうなサイト様を並べておきます。全部英語です。

+ とある方のサイト　=　https://fungos.github.io/blog/2017/08/12/setting-up-a-rust-environment-on-windows/
+ Cargoの説明書？　=　https://doc.rust-lang.org/cargo/getting-started/installation.html
+ rustupの他のインストール方法　=　https://forge.rust-lang.org/infra/other-installation-methods.html
白背景がダークモードの時に真っ暗になってしまう問題に注意

先日[AI顔診断メーカー]()というアプリをリリースしたのですが、「黒くなってしまって経験人数が表示されません！」というユーザーからの声をたくさんいただき、最初原因がわからなくてハマっていたのですが、、、（下画像、左が正常で右がバグ）

<img width="594" alt="スクリーンショット 2019-11-03 22.03.14.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/111366/1f6699bd-dbc4-c1b4-0e67-72cb2b82d986.png">

**問題は、iOS13からのダークモードでした！**

背景をsystem background colorにしているとダークモードにした時に黒くなってしまいます。

<img width="258" alt="スクリーンショット 2019-11-03 22.04.33.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/111366/af9a2af9-0259-1222-21e0-ef6e3a08c8cb.png">

ダークモードでも白くしたいなら、whiteにしなきゃダメですね。。

<img width="262" alt="スクリーンショット 2019-11-03 22.04.16.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/111366/42ec77d2-2933-5227-308a-04acae5ca4a3.png">

僕はダークモード使わない派なので、原因わかるまで時間かかっちゃいました。。。結構みんなダークモード使うんですね笑

気をつけたいと思います。

(P.S ダークモード、開発者にとってはめんどくさいですねww)
【愚痴＆失敗談】結局機械学習とかデータサイエンスティストってなんなの？

## 経緯
※注意 ただの愚痴なのでためになることは書いてありませんが悪しからず。

私はWEBエンジニアでしたが、ちまたで話題のデータサイエンティストってかっこいいじゃん！！なってみたいぜ！！という感じでとりあえずWEBエンジニアをしながらG検定を取得しました。
その後、E資格も取得しようと思ったことを機にqiitaを始めました。E資格を取得するためには講義を受け、レポートをqiita等で提出すればE資格の受験資格を得れるからです。

ただ、E資格を取得しようとしている最中に転職活動が成功し、無事データサイエンティスト(正確にはデータサイエンティストを募集している求人)に就職が決まりましたのでその資格は取得していません。もともと転職先を見つけるためにそっちの分野の勉強頑張ってます的な意味でやっていただけなので。

これからじゃんじゃん分析して、世の中改革していってやんぜ！！みたいな気持ちでした。

## ただの失敗
WEBエンジニアからデータサイエンティストになろうって時点で年収の低下や下積みをやらされる(ここではテスター等新卒の人達がやらされるであろう仕事のことを指す)ことはある程度覚悟はしていました。なぜなら、転職エージェントに頼っても「いきなりデータサイエンティストは難しい」や「一旦データベースエンジニアを経由したほうがいいよ」等、私が経験したPythonやDjangoができるからって役に立たないよ？君そっちの分野は未経験だよ？的な脅しというか実際そうなのかもしれませんがそうした印象を受けました。
私は「転職エージェント役に立たねえｗｗ」って思いながら某転職サイトで、ベンチャーの「データサイエンティスト募集！！未経験可。優しい先輩方が一から教えてくれます。」みたいな求人に夢みて自分で転職活動を行ったわけです。。。
10月から新しい会社に入ったのですが、実態はこれがデータサイエンス？？とか分析ねえじゃんｗｗ今までやってたことと変わんねえｗ(むしろそれよりひどい)みたいなことが現実でした。

ただ、どうしても一つだけ言い訳をするのなら、E資格取得時に、うちの転職サービスから転職できたら受講料全額返金しますよー的なサービスがあったので、一石二鳥やんけ！！！
って思って転職エージェントにあったときに「データサイエンティストなんかになりたいの？？君の経験ならこうゆう大手のWEBエンジニアのほうがいいよ。機械学習なんてほっといても誰でもやらなきゃいけない時代が来るんだからそれまで基礎力つけなよ」ってめちゃくちゃ上から目線で来られたもんだからかちーんと来たのがすべての元凶です！！！笑
たしかに、そうゆう未来が来るという話も頷けますが、さすがにE資格経由のエージェントだからそっち方面強いと思って頼んだのにそりゃないだろｗｗｗｗって気持ちでいっぱいでしたね・・・

####結論 
転職活動はエージェントにしっかり頼ろう。彼らは転職のプロで、私たちは素人なのだから。
分析は大手じゃないとできない(と聞きました)から聞いたこともないベンチャーに夢見るな。

## 機械学習とデータサイエンス
もうこりゃ独学でやるしかない！！！て思って片っ端からネットでおすすめされている参考書を読みまくりました！！！(冗談抜きで10冊以上！！！)
でも結局ちまたで売られてる本って基本的なデータ解析手法を紹介しているだけなんですよね・・・（自分がセレクトした本が同じようなものに偏ってただけかもしれませんが）
いざkaggleやろうにも、とりあえずxgboost使って、特徴量エンジニアリングして、そのあとそれに合った分析手法？？を使ってmodelを作成していくみたいなことになると思うんですよ。私の偏見かもしれませんが。
でも、kannelみて勉強するにしても自分で手探りでやるにしても虚無感がすごいというか・・・
なんかよくわからないけどすごく無駄なことしてる感じがするんですよね。
どうしてこの手法を選んだのかとか、このデータは〇〇のパターンだから〇〇が効くはず。なぜならこうだから・・・みたいな正解？なのか自分がすっきり理解したいのかわからないけどそうゆうのがないんですよ。知人や先輩にkagglerだったり分析のすごい人がいたり、大学時代に統計をとってたりしていたならば、自分のなかで府に落ちて前に進めると思うんですが。
そうゆう意味でいうと、自分が成長するためになにかきっかけづくりになればという思いでqiitaを書いたっていう少し邪な思いもありますｗ

####結論 
もし、データのパターンやそれにあった解析手法があるのならばそれを自分で見つけてまとめる。
知人にkagglerや機械学習の先輩が欲しいならそうゆうイベントに参加する。
が今のところ自分が導きだした答えです。

## 終わりに
今回は自分の愚痴と失敗談を投稿しました。僕と同じ被害者が出ないでほしいという気持ちと、アドバイスくれる優しい人達が現れたらいいなーという想いでです。
実際のデータサイエンティストになるとデータの収集やデータのクレンジング等の地味な作業が多くつまらないよと聞きますが、そもそもその土俵にすら立てなかった自分が悔しいです。
今すぐには無理ですがまた転職活動を行おうと思いますし、今の会社で一応データサイエンティストの職種なのだからちゃんとそうゆう経験ができないか社長に頼みこんだりしてもがいてみようと思いますｗ
次にいつ投稿するかわかりませんが、次に投稿するときは今よりも有意義な仕事をしていて、タメになることを記載できればと思います。
今の仕事より下はないと考えてますので後は登っていくだけかな笑
それではまたいつか。
ご意見やアドバイス等すこしでも憐れに思ったかたのコメントお待ちしております！！！
正規分布のエントロピーを丁寧に計算する

# はじめに
`正規分布　エントロピー`などと検索すると、エントロピーを最大にする分布として正規分布自体を導出する解説は多く出てきます。

しかし、逆に正規分布からそのエントロピーを求める話は意外と見かけません。
今回、正規分布のエントロピーを計算したのでここに残しておきます。

# 正規分布のエントロピー
平均$\mu$、分散$\sigma^2$の正規分布は以下の式で表されます。

```math
p(x)=\frac{1}{\sqrt{2\pi\sigma^2}}\exp \left( -\frac{(x-\mu)^2}{2\sigma^2} \right)
```

この分布の（微分）エントロピーは以下のようになります。

```math
H[x] = \frac{1}{2}\left\{ 1+\ln \left( 2\pi\sigma^2 \right) \right\}
```

# 導出
エントロピーの式に当てはめて計算していきます。
（明らかに$\mu=0$として簡単化しても結果は同じですが敢えて一般的な形で計算します）

```math
\begin{align*}
H[x] &= -\int_{-\infty}^\infty p(x)\ln p(x)dx \\
&= -\int_{-\infty}^\infty \frac{1}{\sqrt{2\pi\sigma^2}}\exp \left( -\frac{(x-\mu)^2}{2\sigma^2} \right) \ln \left\{ \frac{1}{\sqrt{2\pi\sigma^2}}\exp \left( -\frac{(x-\mu)^2}{2\sigma^2} \right) \right\} dx \\
&= -\int_{-\infty}^\infty \frac{1}{\sqrt{2\pi\sigma^2}}\exp \left( -\frac{(x-\mu)^2}{2\sigma^2} \right) \left\{ -\frac{1}{2}\ln\left(2\pi\sigma^2 \right) -\frac{(x-\mu)^2}{2\sigma^2} \right\}dx \\
&= \frac{1}{2}\ln \left( 2\pi\sigma^2 \right) \int_{-\infty}^\infty \frac{1}{\sqrt{2\pi\sigma^2}}\exp \left( -\frac{(x-\mu)^2}{2\sigma^2} \right)dx + \frac{1}{\sqrt{8\pi\sigma^6}}\int_{-\infty}^\infty (x-\mu)^2\exp \left( -\frac{(x-\mu)^2}{2\sigma^2} \right) dx
\end{align*}
```

ここで、前半の積分は正規分布の積分そのものなので1になります。

後半の積分について、$t:=x-\mu$と置換します。
$t\cdot t\exp(-t^2/2\sigma^2)$とみて部分積分[^1]を使い、

```math
\begin{align*}
&\int_{-\infty}^\infty t^2\exp \left( -\frac{t^2}{2\sigma^2} \right)dt \\
&= \left[ -t\sigma^2 \exp \left( -\frac{t^2}{2\sigma^2} \right) \right]_{-\infty}^\infty +\sigma^2 \int_{\infty}^\infty \exp \left( -\frac{t^2}{2\sigma^2} \right)dt \\
&= \sqrt{2\pi\sigma^6}
\end{align*}
```

ゆえに、

```math
\begin{align*}
H[x] &= \frac{1}{2}\ln\left( 2\pi\sigma^2 \right)\cdot 1 + \frac{1}{\sqrt{8\pi\sigma^6}}\cdot \sqrt{2\pi\sigma^6} \\
&= \frac{1}{2}\left\{ 1+\ln \left( 2\pi\sigma^2 \right) \right\}
\end{align*}
```
となります。

# おわりに
正規分布のエントロピーを計算しました。
エントロピーが分散だけで決まり、分散が大きくなるとエントロピーも増大するのは直感とも合っています。

また、$\sigma^2 < 1/(2\pi e)$のときエントロピーが負（！）になります。
連続分布のエントロピー（微分エントロピー）は実は負にもなり得るんですね。


[^1]: https://mathwords.net/x2joex2jo
Arduinoでタコメーター作成～ハードウェア編～

こんにちは。

前回の続きでハードウェア編について記載します。

まずは波形整形MCUと回転数算出MCUに信号を渡すの回路図です↓

![全体回路1103.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/408650/4275b23b-5b60-a9cb-c1e3-738206eef845.png)

上の回路図は初心者向けに分かりやすいようにGNDやVCCの回路の省略はしてません。
なにも考えずに回路図通りに結線すれば動作すると思います。

また、パスコンは省略しています。
というのも、容量選定が良くなかったのか、思ったようなノイズ処理ができなかったのと、とくに処理しなくてもソフトウェアで処理できていたので省いてます。
もし適切な容量選定が可能なら入れてもいいと思います。

それとD1とD2ですが、SBDのほうがより望ましいが通常のダイオードでも対応可能ということでこの表記です。

もはや説明不要かと思いますが、それぞれの部品の意味を書いておきます。
D1：CTセンサの波形のマイナス成分除去のためのダイオードです
D2：5V+D2のVf以内に電圧を抑える過電圧保護用クランプダイオードです
　　A0ピンに電源以上かからないようにしています
R1：電源に大電流が流れないようにするための電流制限抵抗です
R2：CTセンサの負荷抵抗です。抵抗値が大きくなるほど取り出せる信号電圧も比例します
R3：フォトカプラの電流制限抵抗です
R4：MCU2のD10pinのプルダウン抵抗です

ここまで書いておくとわかりやすいかと思いますが一つ注意点

僕は素人です

なので容量選定や用語、回路設計に誤りあるかもしれません。
たとえば厳密に言えばクランプダイオードも5＋vfですのでA0の完璧な保護にはなっていないです。
他にも用語の誤用とか...

まぁ気にしていたらきりがないので参考にお願いします

とりあえずハード編はこのくらいかな？
続いては「波形整形ソフトウェア編」です！

ではまた
Laravelでのnull値判定

<h1>この記事の目的ときっかけ</h1>
Laravelで開発初めて5ヶ月くらいたっけどnull判定がどのように行われるのかあまり理解できておらず毎回なんとなーくで実装していたらめちゃめちゃ時間のムダだったことに気がついた。
そこでパターンを洗い出して一生忘れないようにここに残しておく。
(備忘録です)

<h1>issetとempty</h1>
まずここの使い分けが全くできていなかった。公式ドキュメントに書いてあります。公式は最強。
https://readouble.com/laravel/5.8/ja/blade.html

<h3>isset</h3>
<b>定義されていて、かつnullではない</b>時にtrueを返す。

<h3>empty</h3>
<b>空</b>の時にtrueを返す。
ここでいう空というのは、
<b>null, 0, "0", false, 空の配列</b>である。



例１

```
$value = " "

isset($value) = true

定義されている、かつnullではない

empty($value) = true

空
```


例2

```
$value = null

isset($value) = false

定義されているがnull

empty($value) = true

空
```

例6

```
$value = 0
isset($value) = true

定義されている、かつnullではない

empty($value) = true

空
```

例7

```
$value = []
isset($value) = true

定義されている、かつnullではない

empty($value) = true

空
```

<h1>リクエストの場合は空文字が勝手にnullになる</h1>
Laravel5.4以降はリクエストで" " のような値が渡されると勝手にnullになる。empty使っておけばあまり問題ないかとは思います。

 <h1>まとめ</h1>
issetとemptyでは判定対象が違います。そこさえ把握しておけば難しいことはないのだなーと思いました。
mac でターミナルのメニューバー表示

**ターミナルの使用の豆知識**
macビギナーだと
わかりづらい使いかたがあったので
その備忘録を描きます

ターミナルでこの画面の出しかたです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/430767/d09f0c30-212f-be00-6234-f5346e960f31.png)

macのメニューバーと似ていますが、

ターミナルを最大化して
macのデスクトップと同じ要領で
マウスを最上部に持ってくると出てきます。

以外と気付きづらい上にシェルの編集をやるとなると
割りと必須条件なので、書き記します。

結構細かい説明がHPにもないので
専門書でも読もうと思うこのごろです。
Python csvデータをPandasで読み込む　⇒Matplotlibでグラフ化

csvデータをPandasで読み込んでMatplotlibでグラフ化するまでのPythonコードです。
csvデータの読み込みについては汎用性を高くしたため，パスを選択し，読み込むことが可能です．

Python 3.7.3です．コードは以下になります．

```python
# モジュールのインポート
import os, tkinter, tkinter.filedialog, tkinter.messagebox
import numpy as np
import pandas as pd
import matplotlib.pyplot as plt
 
# ファイル選択ダイアログの表示
root = tkinter.Tk()
root.withdraw()
 
# ファイルの拡張子　fTyp = [("","*")] or fTyp = [("","*.csv")]
fTyp = [("csv-file","*.csv"), ("All-file","*")]
 
# フォルダパスを取得
iDir = os.path.abspath(os.path.dirname(__file__))
tkinter.messagebox.showinfo('解析プログラム','ファイルを選択してください！')
file = tkinter.filedialog.askopenfilename(filetypes = fTyp,initialdir = iDir)
print(file)

# ファイルパスの認識
file1 = file.replace('/', os.sep)
file_name = os.path.basename(file)
data_path = os.path.dirname(file1)
os.chdir(data_path)
print(file_name)

# csvファイル読み込み
data = pd.read_csv(file_name,encoding = "utf-8",skiprows = 100)# skiprows = 5 encoding="shift_jis" or "utf-8"
print(data)
 
#Y軸(振幅)の定義
y = np.array(data)
y = y.reshape(-1,)
 
#X軸(時間軸)の定義
samp = 100 #サンプリング周波数(Hz)
samp_t = 1/samp
x = np.array(np.arange(0,(samp_t*len(y)),(1/samp)))
 
#グラフ化
plt.title("Graph")                  
plt.xlabel("time(s)")#&amp;amp;amp;横軸ラベル                    
plt.ylabel("Voltage(v)")#縦軸ラベル
plt.grid(True)#目盛表示                 
plt.tight_layout()#全てのプロットをボックス内に
plt.plot(x,y)
plt.show()
```

より詳細に知りたい方は以下の記事をご覧ください(´・ω・`)
https://kgrneer.com/python-csv/
[macOS/iOS] FileHandleをrawモードで読み出す方法

# [macOS/iOS] FileHandleをrawモードで読み出す方法
元記事は、StackOverflowの、[Listening to stdin in Swift](https://stackoverflow.com/questions/49748507/listening-to-stdin-in-swift)です。特に、サンプルコードは丸写しです。

## 環境
* 作成日: 2019/11/03
* macOS 10.15
* Xcode 11.0
* Swift 5

## 課題
標準入力の[FileHandle](https://developer.apple.com/documentation/foundation/filehandle)オブジェクトを、availableDataメソッドで呼び出した場合、改行キーが押されるまで、結果を返さない。キー入力ごとに値を取り出したい。

## 解決方法
標準入力のFileHandleを、rawモードで動作させる。下記のサンプルコードは、StackOverflowの[Listening to stdin in Swift](https://stackoverflow.com/questions/49748507/listening-to-stdin-in-swift)の丸写しです:

````
// see https://stackoverflow.com/a/24335355/669586
func initStruct<S>() -> S {
    let struct_pointer = UnsafeMutablePointer<S>.allocate(capacity: 1)
    let struct_memory = struct_pointer.pointee
    struct_pointer.deallocate() 
    return struct_memory
}

func enableRawMode(fileHandle: FileHandle) -> termios {
    var raw: termios = initStruct()
    tcgetattr(fileHandle.fileDescriptor, &raw)

    let original = raw

    raw.c_lflag &= ~(UInt(ECHO | ICANON))
    tcsetattr(fileHandle.fileDescriptor, TCSAFLUSH, &raw);

    return original
}

func restoreRawMode(fileHandle: FileHandle, originalTerm: termios) {
    var term = originalTerm
    tcsetattr(fileHandle.fileDescriptor, TCSAFLUSH, &term);
}

let stdIn = FileHandle.standardInput
let originalTerm = enableRawMode(fileHandle: stdIn)

var char: UInt8 = 0
while read(stdIn.fileDescriptor, &char, 1) == 1 {
    if char == 0x04 { // detect EOF (Ctrl+D)
        break
    }
    print(char)
}

// It would be also nice to disable raw input when exiting the app.
restoreRawMode(fileHandle: stdIn, originalTerm: originalTerm)

````
FirebaseFunctionsで素のJSを返す

# 実現したいこと

FirebaseFunctionsを使ってリクエスト元やパラメータに合わせたJSファイルを作り返したい

こんな風に使いたい

```html
<script src="https://asia-northeast1-fir-functions-return-js.cloudfunctions.net/hello"></script>
```

# Functionsの実装

`functions/index.js`

```javascript
exports.hello = functions
  .region('asia-northeast1')
  .https.onRequest((request, response) => {
    // Using query
    const name = request.query.name || 'defaultName';
    // Return alert js
    response
      .contentType('application/javascript; charset=utf-8')
      .send(`alert('Hello ${name}')`);
  });
```

`response.send` で返してあげるだけで読み込み可能でした。

# サンプル

**サンプルページ**

https://fir-functions-return-js.firebaseapp.com/

**ソースコード**

https://github.com/akinov/firebase-functions-return-js


※自ブログからの転載です
http://akinov.hatenablog.com/entry/2019/11/03/205102
Kali で日本語入力できない

サイバーセキュリティプログラミングを最初のページからすすめているが、そもそもlinux系初心者のためいろいろわからない。
日本語入力できなくてストレスたまったので直し方の備忘録。

* apt-get updateでエラーが起きる
* 署名が無効という旨のエラーメッセージ
 * https://kotaeta.com/71900341
* apt-get updateに成功
 * その前に、vi /etc/apt/sources/listを編集してミラーサーバからパッケージ取得するように変更した
 * ミラーリスト https://http.kali.org/README.mirrorlist
* apt-get install ibus-anthy
* 再起動
「Kubernetes on Azure ハッカソン@名古屋」の参加レポ

#Kubernetes on Azure ハッカソン@名古屋
初めてハッカソンに参加してみました！
Docker、Kubernetes超初心者でしたが、まとめてみました。

## ハッカソンの概要
講師：Microsoftの寺田さん
１日目：寺田さんの説明を聞きながら、Kubernetes構築まで
２日目：参加者のみで１日目の内容を構築 ＋ DevOps環境構築
私は、DevOps環境構築はできませんでしたが、後日、DevOps環境構築手順を共有いただきました。
ありがとうございます！

モブプログラミング形式で、ハッカソンを実施しました。
初めてモブプログラミングを行いましたが、周りの方と助け合いながら進めることができて面白かったです！
1人だったら、多分構築までできなかっただろうな・・・。感謝です！
## ハッカソンの内容（手順）
内容は、寺田さんがGitHubで公開してくれている手順をもとに実施しました。
https://github.com/yoshioterada/k8s-Azure-Container-Service-AKS--on-Azure/blob/master/k8s-Hans-On.md
https://github.com/yoshioterada/k8s-Azure-Container-Service-AKS--on-Azure/blob/master/HoL-Contents.pdf

以下の環境を構築することができました。
![aks勉強会_20191026.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/526897/2fa48106-853c-162e-c4f3-caac60b980a5.png)
Azure環境に、VMを立てて作業しましたが、1人で実施する場合は、
手元の環境に、DockerとAzure CLIをインストールすれば良いと思います。

## AKSリソース作成時の注意点
AKSは、リソースを作成する際に、オプションを正しく設定する必要があるらしく、後から変更できないオプションもあるようです。
ハッカソン中も、外部公開できず困りましたが、AKSのHTTP routingのオプションが足りなかったようでした。
HTTP routingについては、以下のコマンドで追加できました。
「az aks create --resource-group myResourceGroup --name myAKSCluster --enable-addons http_application_routing」

＜AKS HTTP routing設定方法＞
https://docs.microsoft.com/bs-latn-ba/azure/aks/http-application-routing

## 感想
今回のハッカソンに参加して、AKSの知識だったりもちろんですが、周りの方から刺激をもらえてとてもよかったです！参加者の皆様ありがとうございました。
目的にあったモノを構築できるように頑張っていきたいと思います。

また機会があれば、参加してみたいと思いました！！

## 参考
＜マイクロサービスが注目される理由　導入検討に向けて気を付けるべきポイント＞
https://www.atmarkit.co.jp/ait/articles/1910/18/news005.html
pipenvの仮想環境にDjangoをインストールする

# 概要
　この記事は初心者の自分がRESTfulなAPIとswiftでiPhone向けのクーポン配信サービスを開発した手順を順番に記事にしています。技術要素を1つずつ調べながら実装したため、とても遠回りな実装となっております。

　現代はframeworkを使った開発が当たり前になっています。Pythonの場合「Django（ジャンゴ）」というframeworkが良く使われています。通常なら複雑行のプログラムで実現する処理を、Djangoを使えば1行で実装できるなど、frameworkはプログラミングを楽にしてくれます。

　Djangoをインストールする方法はいろいろありますが、今回はpipenvというツールを使う方法を纏めます。pipenvはpythonが動く仮想環境（プロジェクトと呼びます）を作成、管理するツールです。コンピュータに直接環境を構築せず仮想環境とすることで、１台のコンピュータで複数の環境を使い分ける事ができます。

### 参考
https://qiita.com/anvinon/items/5d9c128ef8b65b866dfe
https://qiita.com/nochifuchi/items/4fe0164f0d8949cf11b7

### 環境
MacOS 10.15
Homebrew 2.1.15
固定インターネット回線


# 作業手順
* pipenvをインストール
* pipenvでpythonの仮想環境を作る
* pipenvの仮想環境に Django をインストールする

### pipenvをインストール
念のため pipenv が既にインストールされていないかを、pipenvのバージョンを表示するコマンドを実行して確認します。

```
$ pipenv --version
```
"-bash: pipenv: command not found" というメッセージが表示された場合、pipenvはインストールされていません。

ここから、[Homebrew](https://brew.sh/index_ja) を使ってpipenvをインストールします。Homebrewをインストールしていない場合は先にインストールをしてください。

```
$ brew install pipenv
```

こんな感じの表示が出たらインストール完了です。自分の環境では 1,2分でインストールが完了しました。
<img width="570" alt="pipenv-installed-m.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/526594/692be516-1bed-5faa-093d-4f4ffe5c4d84.png">


先ほどのバージョン確認のコマンドを実行してインストールしたpipenvのバージョンを確認します。自分の環境では version 2018.11.26 がインストールされました。 

### pipenvでpythonの仮想環境を作る
まず仮想環境を作るディレクトリを作成します。そのディレクトリ配下でプログラムを作成したり実行する事になります。様々なタイプの環境を使いたい時は、それぞれディレクトリを使い分ける事で実現できます。

ディレクトリの作成は下記のコマンドです。Finderで作成しても大丈夫です。

```
$ mkdir [ディレクトリのパス]
```
ターミナルで作成したディレクトリに移動し、下記のコマンドでpipenvの仮想環境（プロジェクト）を構築します。自分は"amiApp"というディレクトリに環境を構築しました。

```
$ pipenv install
```
<img width="640" alt="pipenv-install-m.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/526594/34d24aa2-33bc-0150-fcf4-e4f5e5771393.png">


ここでディレクトリの中身を確認してみます。ディレクトリの中のファイルやディレクトリを表示するコマンドはこちらです。

```
$ ls
```

すると、"Pipfile"と"Pipfile.lock" というファイルが出来ています。Pipfileは、
>Pipenv仮想環境がプロジェクトの依存関係を管理するために使用する専用のファイル

とのことです。
Pipfileの中身を確認すると、このようになっています。パッケージなどの構成を管理するファイルのようです。そして[requires]の所に python_version = "3.7" という表記があります。pipenvの仮想環境を作ったタイミングで一緒にpythonもインストールされるようです。

```
[[source]]
name = "pypi"
url = "https://pypi.org/simple"
verify_ssl = true

[dev-packages]

[packages]

[requires]
python_version = "3.7"
```

ちなみに指定のpythonのバージョンで仮想環境を作るには、下記のようにコマンドを実行します。

```
$ pipenv --python [バージョン番号]
```

pythonやDjangoを動かす仮想環境は出来たので、続いてDjangoをインストールします。Djangoはパッケージなので、インストールをするとPipfileの[packages]の所にDjangoが追加されるはずです。

### pipenvの仮想環境に Django をインストールする
下記のコマンドでdjangoをインストール出来ます。

```
$ pipenv install django
```

Pipfileの中身をもう一度確認すると、[packages]にDjangoが入っています。

```
[[source]]
name = "pypi"
url = "https://pypi.org/simple"
verify_ssl = true

[dev-packages]

[packages]
django = "*"

[requires]
python_version = "3.7"
```


以上でpipenvの仮想環境にDjangoをインストールする作業は完了です。

次回は、[今回作成した環境でDjangoのコードを動かしてみます](https://qiita.com/Ajyarimochi/items/0964d314c8bd968fcc80)
初心者によるプログラミング学習ログ 145日目

# 100日チャレンジの145日目

twitterの100日チャレンジ#タグ、#100DaysOfCode実施中です。
すでに100日超えましたが、継続。

100日チャレンジは、ぱぺまぺの中ではプログラミングに限らず継続学習のために使っています。

145日目は、

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">おはようございます<br>145日目<br><br>udemyでjavascript学習<br>メンターさんのjavascript課題<br><br>課題ようやくいい感じに仕上がった…・ω・<br><br>ところでデイトラというのも最近気になっています<a href="https://twitter.com/hashtag/%E6%97%A9%E8%B5%B7%E3%81%8D%E3%83%81%E3%83%A3%E3%83%AC%E3%83%B3%E3%82%B8?src=hash&amp;ref_src=twsrc%5Etfw">#早起きチャレンジ</a><a href="https://twitter.com/hashtag/100dayOfCode?src=hash&amp;ref_src=twsrc%5Etfw">#100dayOfCode</a> <a href="https://twitter.com/hashtag/%E9%A7%86%E3%81%91%E5%87%BA%E3%81%97%E3%82%A8%E3%83%B3%E3%82%B8%E3%83%8B%E3%82%A2%E3%81%A8%E3%81%A4%E3%81%AA%E3%81%8C%E3%82%8A%E3%81%9F%E3%81%84?src=hash&amp;ref_src=twsrc%5Etfw">#駆け出しエンジニアとつながりたい</a> <a href="https://twitter.com/hashtag/javascript?src=hash&amp;ref_src=twsrc%5Etfw">#javascript</a></p>&mdash; ぱぺまぺ@webエンジニアを目指したい社畜 (@yudapinokio) <a href="https://twitter.com/yudapinokio/status/1189287640304099329?ref_src=twsrc%5Etfw">October 29, 2019</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>