技術ムキムキBlog

だいだい1年目エンジニアが奮闘するブログ

ほんとうに初心者の私が初めてASP.NetでWebアプリを開発した話

こんにちは。
新人エンジニアの或です。

今回は初めてASP.Netを使って基礎の基礎から簡単なWebアプリケーションを開発した話を書きます。

はじめに

開発したもの

  • Todoアプリ
    • Todoの登録、更新、削除ができる
    • ログインしたユーザにごとにTodoが管理できる
    • ユーザの管理画面がある

環境

きっかけ

  • プログラムを書くお行儀を身に着けたいと思ったから。
  • 道具(エディタ)の使い方を身に着けたいから。
  • 仕事でASP.Net開発をする予定があるものの、一人でWebアプリケーションを完成させたことがなく、成功体験をつくりたかった。
    • Visual Studioで開発をするという勘所がつかめるはず。
    • コードを書くことに慣れていけるはず。

開発中の話

Udemyを受講

www.udemy.com
ほとんどこちらでゼロから学びました。
とっつきやすく、知識のない私でも完成まで問題なくたどり着ける内容だったうえ、+αで深堀して勉強でできるきっかけももらえます。

開発中の自分ルール

  • コードに処理を足していきながらコードの動きをコメントにメモする。
  • 調査は最小限に収め、完成を優先させる。
    • 完成後、コードにかいたコメントを基に調べ学習をしてブログに書く。

かかった時間と内訳

開発にかかった時間(勉強時間も含む)とそれぞれの日にやったこと、感想などを書いていきます。

  • 開発期間:7日間
  • 実働時間:18時間
1日目 2時間 36% 完了 - VSコンポーネント追加(VS自体はインストール済み)
- MVCモデルについて
- デモアプリについて
- EntityFrameworkについて
- デフォルトページ作成

あれ、VSにコンポーネントを追加できない?単純にやりかたわからず。以下で解決。
Visual Studio 2017にコンポーネント(機能)を追加する方法

2日目 1時間 40% 完了 - 1日目の復習+ソースコード解説

このソースコード解説はありがたい。見返します!
また、興味をそそられコードの仕組みが知りたくて以下の本を買いました。
C#の絵本 第2版 C#が楽しくなる新しい9つの扉

3日目 3時間 64% 完了 - セキュリティ
- Bootstrap
- メンバーシップフレームワーク(認証)

はじめて認証の仕組みを体験しました。
難しいとは聞いていましたが、こちらも調べて記事にしたい。

4日目 3時間 76% 完了 - Gitの勉強
- Entity Framework(認証情報をDBで管理する)

既存のシステムの改修ではコードファーストは使わないと思いますが、今後自分でアプリケーションを作るうえでとても自信になりました。
Gitは概念と手順の理解を進めた。すでに記事化。
alui.hatenablog.com
参考:Git - Book

5日目 3時間 76% 完了 - エラーの解決
- Using構文について
- パッケージマネジャーコンソール

→エラー内容見てもわからず、大体の場所に検討をつけ、動画見なおした。

6日目 2時間 88% 完了 - ユーザー管理機能の実装

コードファーストの便利さをかみしめる。

7日目 1時間 100% AllClear!! - ユーザーのパスワードをハッシュ化
- ユーザごとのTodoの管理
- PBKDF2 (ハッシュ化、salt、ストレッチング)

セキュリティネタは自分の中で最優先ではないが深堀したい分野。これも記事にする。

開発が終わって

アウトプット

  • このブログ
  • 自端末にWebアプリのソース
  • GitHubにWebアプリのソース
  • その時勉強した知識を分割したBlog(これから・・・)

感想

今回は勉強するツールとして他の人の開発記事でも、本でも、学校でもなく、Udemyを選択しました。
これの良かったことを以下に書いていきます。

  • ページをめくる必要がない
  • 完成品があること。
  • 正しい道具の使い方をコードの書き方と一緒に学べたこと。
    • 記事を見て自力でコードを書く時は力技の時もある。
    • その文字が書かければいいや。で終わってしまっては次に通じない。このあたり解決できた
  • 勘所がない分野には文字だけでなく「しゃべる」「手が見えること」の重要さを感じる。
    • 声でコードの解説付きで勉強すると、実現しているコードの書き方以外に、コードの書き方、背景や結果も踏まえて確認できること。

今後やりたいこと

やりたいこと多すぎ問題。
優先度高い順から描いた。上から実現させていきます。

  • 今回学びが多かったので本記事でさらった触れた内容について記事を書くこと。書きたい記事は以下。
    • C#コードが動く仕組み
    • デバッグのやり方をマスターする
    • MVCモデルとは?
    • Entity Framework
    • 認証について
    • Git続編(もっと使いこなす)
    • Todoアプリの続編(デザインや追加機能、セキュリティ面の実装)
    • セキュリティについて(どういう手法で何をされる可能性があり、どう防げばよいいか。)

今後もどんどん作るぞ。

毎日ぎじゅつ記事!〈6_2018年9月18日〉

ほぼ一年目エンジニアの或です。
今日見た記事をさらっと紹介していきます。

speakerdeck.com
→点と点を結びつける力とはこういうことか。

gigazine.net

speakerdeck.com

yandod.github.io

simplearchitect.hatenablog.com
→調べる力こそプログラマには必要だと信じて疑わない私にとっては衝撃的なタイトル。

qiita.com
→気になる記事。キープ

やりたいこと

改めてやりたいことを書いておく。

  1. 書いたコードの動きを一部でも良いので図示化
  2. KotlinでAndroidアプリを作る
  3. Goで通知システムを作る
  4. ペアプロミング(これは相手がいないとできない...)


今日は以上。

Slackbotで、今日見られるアニメをお知らせ

こんにちは。ほぼ1年目エンジニアの或です。
今日は、slackbotを使っていこうと思います。

きっかけ

私はアニメをテレビではなく、ネット配信で見ています。
そのため、どの時間にアニメを見ているのかを全く意識していません。
いつでも見られるのがネット配信のいいところです。
しかしそのおかげで見逃し、番組によってはアーカイブが1週間分しかなく泣きを見ることも。

Amazon のPrime Videoなんかは見ているが番組が更新がわかりやすいです。
また、配信がされるとアプリごとに通知の設定ができますが、他のものと混ざってしまう上、一度アプリを開くと消えてしまいます。
ここまでつらつらと言い訳を書きましたが、その日みられるアニメをリマインドしよう!と、このような思考に至ったわけです。

botで実現したいこと

  1. 自分が見ているアニメがどこで配信されているかを知ること。
  2. 通知タイミング:そのアニメが配信されるタイミング(大体が0時)
  3. 通知内容をあとで見返せること。
  4. プッシュ通知で実現。

プラットフォーム選び

私が普段使っているツールで、通知を受け取るのにいいと思うプラットフォームは以下でした。

  1. Twitter
  2. LINE
  3. Slack

Twitterの場合

Twitterbotを作るとなると新しくアカウントを作り、そのアカウント自体をbotとして運用する必要があると思います。
そのbotをフォローすることによって、botの恩恵を受けることができます。
個人的な感覚ですが、Twitterを使うならみんなで共有できるものがいいなぁと。実現したいこと1を満たすと個人用にカスタマイズされた通知しかできないので共有しにくい。
また、昨日の実装には時間が少しかかりそう。またの機会に。

LINEの場合

こちらもTwitter同様、自分専用にカスタマイズしたbotを作るには実装に時間ががかります。
ありもので探すと、リマインくんというLINE botが。
ちょっと使ってみました。
f:id:alui:20180917231102p:plain
アニメの配信なので、毎週Push通知が欲しいところ。
1度きりの設定しかできない模様。

Slackの場合

今回はここが本編です。
/remindコマンドでリマインドを設定できます。
get.slack.help

設定してみた。以下を送信。

/remind #info_anime 火曜日は〇〇で△△の配信があるよ Tuesdays
/remind <通知したいチャンネル> <通知したい内容> <通知するタイミング>

あとの設定はマウスでできます。
f:id:alui:20180918001214p:plain
Slackでは、真夜中=0:00のよう。
無事通知が来ましたよ!
f:id:alui:20180918001434p:plain
とりあえずこれでよさそう。
使ってみて不都合があったら自分でカスタマイズしていこうと思います。

毎日ぎじゅつ記事!〈5_2018年9月17日〉

ほぼ一年目エンジニアの或です。
今日見た記事とひとことを書いていきます。

qiita.com
→通知システムの実装はしてみたい。


qiita.com
→アイデアを実証するためには、手法だけじゃなく、ソースや分析点が重要であるという良い例。

qiita.com
→なんだか釈然としない記事ですが・・まあ規約は守らないとね☆

techblog.oscasierra.net
→実際に行くとなるとハードル感じてしまう。記事から入ろう・・・


qiita.com
→こういう考え方あるのかーと

qiita.com
→本を読む参考にしたい。今年はあと半期で5冊読むぞ。

qiita.com
Twitterbotは作ってみたい。Twitterじゃなくてもいいけど。

qiita.com
→後で作るために記事をキープ。

今日は以上です。

ほぼ一年目エンジニアが、GitHubを使い始めた

こんにちは。

ほぼ1年目エンジニアの或です。

趣味で作り始めたTodoアプリのソースコードを実験台にしてGitHub連携をしてみました。Todoアプリ自体については、別の記事で紹介します。

大まかな流れはこちらを参考にしました。
techacademy.jp

はじめに

私は作業前にある程度概念などを勉強しました。
わかりやすく紹介されている記事もたくさんありますが、
有志が翻訳しているGit公式のページGit - Bookを見ることをお勧めします。

ローカルでコミットする

GitHubアカウント作成・Gitインストール済みを前提とします。

GitHubにてアップロード先のリポジトリを作成後、 
ファイルを作成したディレクトリ(ファイルを管理したい場所)で右クリックからGitBushを起動。
f:id:alui:20180916015703p:plain

起動したGitBush上で以下を実行。

git init    ♯カレントディレクトリをGitリポジトリに変換
git add TodoApp   ♯追加したいファイルやディレクトリ
git add TodoApp.sln
git commit -m "<コメント>"   ♯ローカルでコミットする

最初コミットするときはコメントの部分を”first commit”にするのがお行儀みたい。


反映されたことを確認します。

git status

リモートリポジトリに反映する。

コミットが完了したら、リモートに反映していきます。
リモートへ反映すると、GitHub上で確認することができます。

git remote add origin <追加するリポジトリのGitHubのURL>
git push origin master

ここまでやると、GitHubのページに反映されました。
f:id:alui:20180916021501p:plain

おめでとうございます!!
これで Gitでソース管理ができるようになります。

本編はここまでですが、以下にて後で使えそうな記事を2つ紹介します。

おまけ1:Gitで管理しないファイルやフォルダについて

Git上で管理したくないパッケージなど、共有不要なファイルがあるままにしておくと、
以下のメッセージが出ます。

Untracked files:
  (use "git add <file>..." to include in what will be committed)
.vs/    ♯gitにあげたくないファイル
packages/ ♯gitにあげたくないファイル

調べてみると、管理対象からファイルやフォルダを外すには以下方法があるよう。

  1. .gitignoreを使う
  2. git rmを使う

おまけ2:Gitの改行コードに関して

改行コードの違いで全行に差分が生じてしまうのを防ぎます。
#今回は一人で編集しているので手順としては省きました。
複数の環境で編集するときコードレビューやgit blameコマンドに影響が出ないようにする。
参考:.gitattributesで改行コードの扱いを制御する