いそべやきはビールの夢をみる

今日もしがないえんじにあ

【C#】dictionaryをあれこれする

値の上書きや取り出しで苦戦したので残しておく。

名前とその人の体重をまとめて格納したいのでdictionaryを使う。

◆まずは普通に定義。

var dic = new Dictionary<string, int>(3);

◆データ格納。

dic.Add("田中", 40);

dic.Add("大山", 45);

dic.Add("佐藤", 60);

◆「〇〇さんは△△kgです」の形式で全部取り出し

foreach(var d in dic)
{
  Console.WriteLine($"{d.Key}さんは{d.Value}kgです");
}

田中さんは40kgです
大山さんは45kgです
佐藤さんは60kgです

◆名前のみ取り出し(System.Linq名前空間の定義必要)

var keys = dic.Keys.ToList();

foreach(var k in keys)
{
  Console.WriteLine(k);
}

田中

大山

佐藤

◆体重のみ取り出し

var values = dic.Values.ToList();

foreach(var v in values)
{
  Console.WriteLine(v);
}

40

45

60

◆全員の体重を2倍に上書き

foreach(var k in keys)
{
 dic[k] *= 2;
 Console.WriteLine(dic[k]);
}

80

90

120

◆体重の小さい順に並び替え

var asc = dic.OrderBy(x=>x.Value);
foreach(var a in asc)
{
 Console.WriteLine($"{a.Key}さん:{a.Value}kg");
}

田中さん:80kg

大山さん:90kg

佐藤さん:120kg

◆体重の大きい順に並び替え

var desc = dic.OrderByDescending(x => x.Value);
foreach(var d in desc)
{
 Console.WriteLine($"{d.Key}さん:{d.Value}kg");
}

佐藤さん:120kg

大山さん:90kg

田中さん:80kg

◆体重が100kg超えている人だけ抽出

var target = dic.Where(t=>t.Value>=100);
foreach(var t in target)
{
 Console.WriteLine($"{t.Key}さんは100キロ以上です");
}

佐藤さんは100キロ以上です

 

Linqを使いこなせるようになりたい。

既存のDBにカラムを追加したい_ASP.NET Core MVC アプリ

migrationしちゃった後にDB設計ミスっていたことに気づき、カラムを追加したい場合。

以下に丁寧な手順が載っているが、移行の部分で微妙に引っかかったので残しておく。

docs.microsoft.com

データベースを削除し、移行を使ってデータベースを再作成します。 データベースを削除するには、データベース ファイル (MvcMovie.db) を削除します。 次に、ef database update コマンドを実行します。 

データベースファイルを削除したら以下の手順にそって移行作業をする。

docs.microsoft.com

この時、addするmigration名に注意。すでに作成したmigration名指定すると怒られる。

$ dotnet ef migrations add InitialCreate

The name 'InitialCreate' is used by an existing migration.

 

当たり前だろって感じですが。違う名前に修正して実行。

$ dotnet ef migrations add AddAuthorColumn

うまくいったので続けてデータベースもupdate

$ dotnet ef database update

 

仕事ではASP.NET Webフォームをいつもさわっているけど、MVCフレームワークの方が「どこに何を書く」というのが比較的整然としてて良いなあと思う。

.net core MVC Webアプリを作成し、初回コミットしようとしたら失敗した

何も考えずfirst commitしようとしたら失敗したので、備忘録として残しておく。

 

【事象】

.net core MVC Webアプリを作成し、初回コミットしようとしたら失敗

↓↓コマンド↓↓

$ git init

$ git add .

$ git commit -m "first commit"

 

[ERROR] Matched one or more prohibited patterns

Possible mitigations:

- Mark false positives as allowed using: git config --add secrets.allowed ...

- Mark false positives as allowed by adding regular expressions to .gitallowed at repository's root directory

- List your configured patterns: git config --get-all secrets.patterns

- List your configured allowed patterns: git config --get-all secrets.allowed

- List your configured allowed patterns in .gitallowed at repository's root directory

- Use --no-verify if this is a one-time false positive

 

エラーログを確認すると、以下の2つのファイルに問題があるようだ。

/wwwroot/lib/jquery-validation/dist/additional-methods.js

/wwwroot/lib/jquery-validation/dist/additional-methods.min.js

 

【原因】

git secretsが原因の模様。AWSが公開しているもので、パスワードなどの情報をgitに誤コミットしてしまうのを防いでくれる。

今回該当のファイルはAWSとは無関係だが、アルファベットや数字の羅列の箇所が秘密情報だと認識されたのかも。

どちらにせよgit管理しなくても問題ないファイルだったため、まとめてgit管理対象外とする。

 

【解決策】

.gitignoreファイルを作成、jquery-validation配下は無視するようにした。

 

①git initしたディレクトリ配下に「.gitignore」を新規作成

.gitignore」に以下記述

jquery-validation/

③ステージング履歴は取り消して再度git add

$ git reset .

$ git add .

$ git status  //git管理対象外になっているか確認

$ git commit -m "first commit"

 

取り敢えず全部gitignoreするというパワープレーだが、additional-methods.jsが何の設定をしているのかちゃんと理解できていない現状の最適解ということで…

 

20代社会人、何故勉強をするのか?まつもとゆきひろさんの講演を聴いて考えたこと

更新サボっていた間に、プログラミングスクール卒業して転職してポンコツエンジニアになってた。勉強不足とコミュ力のなさとミスの多さで落ち込んで食欲が止まらない。あと毎日8時間くらい寝ちゃう。要するに元気。

 

まつもとゆきひろさん特別公演「20代エンジニアのためのプログラマー勉強法」(サポーターズColab主催)に行ってきました。

 

目黒川沿いの会場付近は花見客でごった返し。桜満開の土曜日昼間だというのに講演聴きに来るなんて「偉いね君!」と褒め合いたくなったが知ってる人誰もいない。

 

晴れた土曜日5回分の価値はあるであろう、素敵なお話を聴けたので、自分が考えたことと共に残しておく。

 

プログラミングの具体的な勉強法の話はなくて、「20代の勉強法(何故、何を、いつ、どこで、どのように)」というテーマだった。以下、メモと薄まりゆく記憶を頼りに要点をまとめる。

                                    

    1. 20代の人が何故勉強するのか
      ・大きな成果になる可能性が高いから。体力、発想の柔軟性という観点では「若い」というだけでアドバンテージ。そのアドバンテージを生かして勉強をすることで将来的に価値ある成果に繋がる。まつもとさんがRuby作り始めたのも27歳。
      ・社会的地位が低い分、戦略的に生きる必要があるから。働く上で、辛い状況に追い込まれることがあるかもしれない。自衛のためにも戦略のもと勉強をしよう。

    2. 何を学ぶのか
      ・得意なこと、好きなことを勉強しよう。苦手克服よりも、早く上達するし、モチベーションアップにも繋がる。
      ・差別化できることを勉強しよう。人と異なる専門領域を持っていれば、大きな成果に繋がるかも。
      ・具体的に何を勉強するべきか?は誰も教えてくれない。自分についてのインベントリ(棚卸し)を頻繁に行って、「自分は何が好きか」「自分の性質は」「妥協点は」などを振り返ろう。自分で学ぶことを決めよう。

    3. いつ学ぶのか
      ・暇を撲滅しよう。睡眠時間やプライベートは絶対に犠牲にしないこと。生産性を高めて仕事を早く終わらせて余った時間で(こっそり)勉強しよう。
      ・優先順位をつけよう。勉強を意識的に優先して、それ以外で削れる時間はないか工夫しよう。チェックするニュースサイトを集約化するとか。

    4. どこで学ぶのか
      ・周囲からの評価を得られる環境。自分が勉強することを、周囲の人が評価・尊重してくれることでモチベーションアップにつながり、それが成果に結びつく。それが周囲に評価され・・・というループがある環境。
      ・勉強することを尊重してくれない、邪魔して来る人がいたら、そこから逃げても良い。他人や組織のあり方を変えることは大変だから。すたこら逃げて良い環境に行こう。

    5. どのように学ぶのか
      ・記憶力より検索力。概要を把握しておいて、「どのように調べたら良いか」が分かっていれば良い。知のインデックスを貼ろう。
      ・アウトプットをして差別化しよう。インプットは誰でもやる勉強法だが、アウトプットの心理的ハードルが高い。クオリティはひとまず棚上げしても、自分の考えや学びを表現する訓練をしよう。            

 

講演を聴いて、最近は状況に流されるままに勉強をしていたなあ〜と反省した。

「勉強しないと仕事やばい!全然わからん!」という期間があるのは仕方ないけど、長期的な視野で「なぜ自分はプログラミングを勉強しているのか」をはっきりさせておかないと、いつかきっと勉強しなくなるな・・・

現時点のインベントリをしておこうと思う。

譲れないこと:東京周辺で働くこと。人の役に立つモノづくりに関わること。

得意なこと:ない。笑

好きなこと:コツコツ勉強すること

理想の状態:専門性が高く、思い立った時にすぐに希望の会社に転職できる

プログラミング、楽しいけど得意じゃないんですね。じゃあ勉強すべきじゃないか。否。「楽しい×コツコツ=得意」というわけわからん式が成り立つことを信じているので、やはりプログラミングを勉強し続けようと思う。

 

もうちょっとブログ頑張ろう・・・C#のお勉強中なのでその進捗がてら・・・

 

 

【正規表現】数値を3桁区切りにしてカンマを付与したい

345678みたいなただの数字の羅列を、345,678みたいにしたい。調べたら沢山解説記事がありました。

 

345678.to_s.gsub(/(\d)(?=(\d{3})+(?!\d))/, '\1,')

 

 

え?は?全然わからないぞ。

とりあえず分解して見てみよう。

①gsubメソッド使ってるな・・・

文字列 .gsub( / pattern / , ' replacement  ' ) で文字列の中で、指定した正規表現(pattern)に一致した文字をreplacementに置き換えることができる。

②345678.to_sってなんだ・・・

to_sで数字を文字列にしている。なんのためかといえば①で書いたgsubメソッドは文字列にしか使えないから。

345678という数字を文字列にして、gsubメソッドでカンマを付与した形に置き換えているのか。大まかな骨組みは理解。

正規表現

 /(\d)(?=(\d{3})+(?!\d))/ 

難所ですが、?=(肯定的先読み)と?!(否定的先読み)の使い方が分かれば意外と簡単。

A(?=B)  直後にBがあるAに一致

A(?!B) 直後にBがないAに一致

ややこしい・・・実際に当てはめてみる。(\d)(?=(\d{3})+(?!\d))を見やすくスペース開けて見ます。

(\d) (?=(\d{3})+(?!\d))

A(?=B) の形になるので、「直後に(\d{3})+(?!\d)がある(\d)に一致」と読める。

 

(\d{3})+(?!\d)を詳しく。

(\d{3})は数字が3つ連続している状態。+は直前の文字の繰り返し。(?!\d)は直後に数字がない状態。つまり、数字が3の倍数だけ続いている状態を示している。

 

まとめると、/(\d)(?=(\d{3})+(?!\d))/ は

「直後に数字が3の倍数だけ続いている数字」というpatternです。

 

④置換でカンマの付与

'\1,' ってなんだ、いきなり数字出てきた・・・

\1とか\2で後方参照ができるそうです。通常は/pattern /というように正規表現を書きますが、/(pattern) / と()で囲むことで、その文字を参照できるようになるらしい。

\1  一つ目の()の中身を参照

\2  一つ目の()の中身を参照

 

ここでは、1つ目の()つまり/(\d)(?=(\d{3})+(?!\d))/ の(\d)を参照しています。その上でカンマを付与しています。

 

複雑なことしてるようですが、数字一つ一つについて正規表現適用して、マッチしたらカンマ付きの文字に変えて・・・ということを繰り返してるってことですね。

 

一発で変換できるメソッドがあればなあ〜ドラえも〜んという気分です。

 

 

【非同期通信実装備忘録①】preventDefaultで止めたイベントは止めっぱなしにしてはいけない。

TECH::EXPERTに通い始めてちょうど一ヶ月。初めてコネクトを利用し、メンターさんに質問をしました。筋道立てて話すのが苦手&途中で話が崩壊しそうだと思い笑、状況と質問したいことを事前に紙に書き出したのですが、頭が整理できていいなと思いました。今後もエラーが出た時は、ウンウン悩むだけでなく、紙に状況を書き出してみよう。

 

そしてエラーは一瞬で解決…

 

以下のようなチャットアプリを作成しており、

メッセージ送信機能の非同期通信の実装をしていました。

が!連続して投稿できない。

投稿後、また文字を入力して「send」ボタンをクリックしても何も起こらない…

 

非同期通信の処理に関して、jQueryでこのように書いていました(一部省略)。

 

$('#new_message').on('submit', function(e){
e.preventDefault();

…省略…

 $.ajax({
 非同期通信のオプションを定義
 })

 .done(function(data){

   …省略(非同期通信成功時の処理)…

 $('.text-message').val('')  // テキストの入力欄をリセット
   })
 .fail(function(){
 alert('error');
 })

});

 

エラーの原因

→preventDefault();でフォームのsubmitイベントを止めて非同期通信を行なっていたが、イベント再開の処理を記述していなかったため。

 

投稿後の「send」ボタンの状態を検証画面で確認してみると、「disabled」属性が付いていました。input要素が無効になってしまっています。

sendボタンのHTML情報

<input type="submit" name="commit" value="Send" class="chat-content__form-submit" data-disable-with="Send" disabled="">

 

解決法

→ .done(function(){  }内に、submitイベントを再開させるコードを書く。

 

.done(function(data){

   …省略(非同期通信成功時の処理)…

 $('.text-message').val('')  // テキストの入力欄をリセット

   $('.chat-content__form-submit').attr('disabled', false);    //追加!
   })

 

これで連続投稿ができるようになりました。投稿後の「send」ボタンを検証してみると…

<input type="submit" name="commit" value="Send" class="chat-content__form-submit" data-disable-with="Send">

「disabled」属性が付いていないことが確認できます。

 

つらつらと書いてきましたが、重要な学びは以下の2点です。

☆preventDefault();でイベントを中断させた場合、保存完了後の処理の中にイベントを再開させるコードを記述する。

☆エラーかな?と思ったら検証画面もよく確認する。自分がテキスト上に書いたコード以外の情報が分かる。

 

正確且つ見やすい、無駄のないコードを書くに至るには道のりは長いですが…千里の道も一歩から、頑張ります・・・。

 

 

 

railsメソッド「fa-icon」について。

毎日更新なんて目標を掲げていましたが、ブログを開設しただけで「ふう〜」となっていました。これから肩肘張らずに、勉強になったこととか、日常のこととか、どんどん書いていきます(不定期です)。プログラミング初心者なもので、見当違いなことを書いていましたらご指摘いただけると幸甚です…。

 

今日はRuby on rails の便利メソッド「fa_icon 」について整理します。

font-awesomeを使って下のようなアイコンを表示したい時、

f:id:m_isobeyaki:20181202165355p:plain

 

gem「font-awesome-rails」をインストールして、ビューファイルに以下のようなコードを書きました。(hamlで記述)

 

%i.fa.fa-pencil-square-o

 

これでも問題ないのですが、fa_icon というrailsのヘルパーメソッドを使うことで、もうちょっとスッキリさせられます。

 

=fa_icon "pencil-square-o"

 

クラスの追加もできます。

=fa_icon "pencil-square-o", class: 'icon'

 

 

あまり記述量は変わっていませんが、アイコンを複数並べて表示する場合、%(タグ)がいくつも連なっていると見難いコードになります。

 

%ul.header__lists
 %li.list
  %i.fa.fa-pencil-square-o
 %li.list
  %i.fa.fa-cog

⇩ fa_iconを使って書くと

%ul.header__lists
 %li.list
  =fa_icon "pencil-square-o"
 %li.list
  =fa_icon "cog"

 

ちょっとだけスッキリした、、かな?