筋トレもプログラミングも反復練習が大事である。

プログラミング初心者三十路越えアスリート系女がフリーランスプログラマーを目指すブログ

開発日記vol.4 railsチュートリアルに書いていなかったこと・ナビゲーションバーの表示を修正する

f:id:simpledancer:20180922151044p:plain

railsチュートリアルではこのナビゲーションバーのアカウントとドロップダウンリストが表示されるようになるのですが、私が作ったものには、ドロップダウンリストが表示されない!

ということで解決したのでメモがてら。

application.jsがチュートリアルのものと変更する必要があった

f:id:simpledancer:20180922151257p:plain

一番下の require bootstrap 消す。

手順

まずここで確認したけど間違いはなく↓

getbootstrap.com

ここに書いてあるの確認

github.com

私の場合

  • gemfileは問題なかった
  • パーシャルも問題なかった(というかチュートリアルのほぼそのまま)

ということでまずは上二つを確認してから挙動がうまくいかなかったのでメンターにヘルプを求めたところそんな感じ。でした。

自分だと堂々巡りだったので一瞬で解決。。

 

 

開発日記vol.3 gitで苦戦。知らなかったことを知る毎日。

f:id:simpledancer:20180215104851j:plain


昨日ビデオチャットをして無事解決したのですが

masterブランチのリモートとローカルの内容がぶつかり合い、

さらにあとで作ったブランチもコンフリクトを起こし

コンフリクト祭りで一人ではどうにもなりませんでした!

 

まじで独学で開発できる人ってすごいなと思っています。

一人で解決できなかったけど、昨日もいっぱい今まで知らなかったことがたくさん知れました!

忘れないようにアウトプットしようと思います。

simpledancer.hatenablog.com

gitに自分の名前とアドレスを登録しておく

gitに登録するという概念が全く持ってなかったのですが

どうやら自分の情報を登録しておく必要があるようです。

githubとかbitbacketとか使ってるので、それに入ってるからそもそも登録することすら知らなかった。

Git - 最初のGitの構成

Gitをインストールしたときに最初にすべきことは、ユーザー名とE-mailアドレスを設定することです。全てのGitのコミットはこの情報を用いるため、これは重要で、次々とまわすコミットに永続的に焼き付けられます:

知らなかったよねえ。私だけかな。。

vimでファイルの内容を変更する 

gitでコンフリクトが起こったとき、今まではテキストエディタを開いて、ファイル探して直して、、としていたんですが、

なんとターミナル上でvim画面を呼び出し、そこでファイルを編集できてしまうということを知りました!すごいね!

qiita.com

 

simpledancer.hatenablog.com

開発日誌vol:2 git pushできない時

f:id:simpledancer:20180827133138j:plain

出張に持っていったけど、書籍を読むタイミングがなかった。。
お昼に3日間の出張から先ほど帰ってきて続きをやっています。

どうやら作ったブランチがリモートと差異があるようで、git pushできない。

割と試行錯誤(と言うかメンターに色々アドバイスをもらいながら)やってみたのですが

やはりダメだ。。。

と言うわけで

禁じ手のgit push -f コマンドを使うことにしました。

git push -fとは

強制的にローカルのものをpushしちゃうコマンドなので、本当はあまり使っちゃいけないらしい。

でも私の場合、

一旦ローカルブランチを削除→masterをマージする→そこから新たにブランチを同じ名前で作成 →編集 と言う形でしたので 多分大丈夫だと思い(しかも今回は自分のアプリなのでええい!やってやれーってなりました)

(`git pull origin master` -> `git checkout ブランチ` -> `git rebase master` -> ~編集~ -> `git push origin ブランチ`)

qiita.com

と言うわけで無事にpushを強制したので、メンターにプルリクエストを出すことができました。

オンラインでもオフラインでも聞ける人がいるってのは大事

テックアカデミーを受けている時も思いましたが、本当にすぐに聞ける環境ってのは大事!

オンライン上だとうまくニュアンスが伝えるのに苦労したりする場合もあるけれど、どこがどうなっていて、どう言うエラーが出ていて、ここまでやったけど、ここがどうもわからない。または、こうでは無いかと言う仮説をちゃんと伝える。

メンターさんもいくら熟練でもちゃんと書いておかないと無駄な時間がかかるので

質問はとにかく詳細に書くのを意識しています。そうすることによって自分も理解できる部分は大きいなと思います。

独学だけでやってるときはteratailとかも使っていたけど(もちろん今でも参考になるので頼れる存在ではありますが)

全然知らない人にいつ何時帰ってくるかわからない質問をしてモヤモヤするよりは絶対お金払ってでもメンターを雇うなり、プログラミングスクールで払うなり、エンジニアの彼氏を作るなり、私みたいに無給でもいいからプロジェクトに参加、みたいなのでもいいと思う。

まじで、独学はコスパ一番悪いかも知れない。。。!(一部の天才をのぞいて)

開発日記をつける!gitとbootstrapの件は解決しました。

f:id:simpledancer:20180915170815j:image

富山出張中。

数日前から自分のwebサービスを作ることになりました。

しょっぱなからエラーが出まくり〜で

webサービスの内容は伏せながら技術的にエラーが出た部分や解決したことなどを書き留めて行きたいと思います。

simpledancer.hatenablog.com

gitのコンフリクトが起こってしまった

まず、ブランチで作業をしていたのですが、それをコミットするときコンフリクトが起こってしまった。

というか解決に丸2日間かかったので、何回もブランチを作ったり消したり

マージしたり、もうわけわからなくなりましたが。

気をつけたいことで今まで意識してなかったこと
  • 開発の時にmasterで作業して origin masterをpushするのはとても危険だということ
  • 基本ブランチを作って作業をすること
  • コミット文わかりやすいものにすること日本語でももちろんok(後から自分がわかりやすい)
  • 迷ったらとにかく自分の今のbranchを確認する(git branchする)
今回新しくやったこと
  • リモートリポジトリに上げたmasterブランチとローカルのブランチに差異が出ていて、新たに作っているブランチでエラーが出てニッチもサッチモいかない時、問題なさそうならば一度テキストエディタを閉じて、リモートのマスターをローカルにマージし、そこからもう一度新たにブランチを作り始める。(書いていてわけわかんなくなるね)
  • bootstrapの導入は基本的に全く今まで困ったことがなかったのになぜエラーが出たかというとおそらく、scssファイルをいくつも用意していてcustom.cssという作ってしまったscssファイルの方にインポート文を書きapplication.scssのファイルに書かなかったこと(だと思う)

今日進んだところ

  • footerを作る
  • トップページにサインインボタンの表示
  • bootstrapの反映
  • 仮画像の挿入(リサイズ)

いやあ、出張中で日中暇なので朝からずーっとやってたけどあまり進まなかった〜!

 

アプリの開発を始めました!まず最初にやったこと

f:id:simpledancer:20180810111714j:plain

先日からメンターに背中を押されて自分のアプリの開発を始めました。

仕事を受注するにせよなんにせよ、やはり自分のアプリを作っていく方が

詳しくなれるし、成長できるし、楽しいよと。

そういうわけで作ってみることにしました。

 

ざっくり最初にやったこと

  1. 大まかな最低限何日までにトップページまで作ると決める。
  2. アプリのアイディアをいくつかだしてみる
  3. そのうちのいくつかを手書きでどういう機能が必要かなど大まかに書いてみる
  4. 似たサイトがあればそのサイトをざっと作りを確認する
  5. とりあえずタイトルを決める
  6. rails newする
  7. githubにリポジトリを作る

と、まずはrails newしてしまうと動き出せる!ということです。

今つまずいているところ

・githubがうまくプルリクエストがメンターに出せない。。

masterブランチと他のブランチの差異がないのか?とりあえず差分がないよ、と言われているためできないのです。うーん。なんなんだろう。。

そうするとgitignoreとかよくわかんないけどそこも調べています。

gitignore — 苦労する遊び人の玩具箱 1 ドキュメント

qiita.com

・bootstrapが導入できない謎

Scssファイルに

import文も書いているしgemもbundle installしているし application.jsも修正したのに。。。!ここ止まってて。

bootstrapの導入で止まったことなんてほぼなかったので超イライラしています。

なんなのでしょうか。。

 

そしてそれをチェックしてもらうためにgithubをプルリクしようとしてできない。。という堂々巡り。。。!!!

解決したらまた書きます。

 

今日は引きこもって仕事までは格闘するのです。

 

simpledancer.hatenablog.com

 

エラーを怖がらないようにする/herokuのデプロイできない

f:id:simpledancer:20180828231022j:plain

リーダブルコードを出張中読みます! 

simpledancer.hatenablog.com

  

simpledancer.hatenablog.com

 
この2日間くらい昔やっていたテックアカデミーの教材を復習がてらやり直しています。

かなりスムーズに進んでいるのですが

herokuのデプロイのところでつまずきました。

何度やってもherokuのappのurlではみることができない。。。

エラーが出ているのを参考に何度か気をつけた点などを覚書程度に書いておきたいと思います。

bundle installとgit pushし忘れていた 

simpledancer.hatenablog.com

 

最初gemfileを少し変更したのでそのあと普通にコミットしていたのですが、

gemfileを変更した後にbundle installをし忘れてからコミットしてしまっていました。

そしてさらにgit pushしてなかったのでリモートリポジトリの内容も変わってないわけです!

最初何度やってもherokuがデプロイできないので、今開発でお世話になってるメンターに仕事と関係ないけど聞いてみようと思って、リモートリポジトリを確認してもらおうとgithubみてみるとgemfileが変更できてなかったので、pushし忘れだと気がつきました。

で、bundle installしてコミット、git pushしてリモートリポジトリを更新。けど、動かないじゃん!

困った時はteratail

 

bundle installをwithoutproductionしてみる

そもそも、そもそもgemfileをいじりまくってpg のとこ消したりつけたりしてたんですが、そもそもそもそも

bundle installじゃなくて↓ にしなきゃいけなかったようで。

bundle install --without production

qiita.com

 その後一連の流れ

コミット→プッシュ→herokuにpush すると無事。。。

こういうのを何回もやっているとだんだん頭の中で流れが理解できてきますね。

エラーが出るといつもいやあああ!ってなってたんですけど、エラーに全て書いてあるって言われるので怖がらずにしっかり読んだりしていくとちゃんとヒントが出ているものなのですよね(今更!)

 

カスタムバリデーションって知らなかったのでこの機会に。

f:id:simpledancer:20180827133138j:image

いまお手伝いしている開発で、bundle exac rspecしたけどエラーで真っ赤かになりましたと。(ちなみに配下のindex.htmlを直してもbundle exac rspecするたびにファイルが生成されるので実装コード自体を直さなければエラーは出まくりますよと)

コードを読んでもどこでエラーが出ているのかわからないのですが

ヒントをもらいまくって

どうやらバリデーションのところが問題らしいと。

そして、バリデーションってテックアカデミーの時とかは、ああなんか制限するやつってくらいしか覚えていなかったけれど

それどころじゃないらしいのでしっかり調べてみることにしました。

railsguides.jp

まずバリデーションとは

バリデーションは、正しいデータだけをデータベースに保存するために行われます。たとえば、自分のアプリケーションで、すべてのユーザーには必ず電子メールアドレスとメーリングリストアドレスが必要だとします。正しいデータだけをデータベースに保存するのであれば、モデルレベルでバリデーションを実行するのが最適です。

モデルレベルでバリデーション???

ということは他レベルでのバリデーションもあるということですね?

どういうことでしょうか??

 他も見てみよう

  • データベース制約やストアドプロシージャを使用すると、バリデーションのメカニズムがデータベースに依存してしまい、テストや保守がその分面倒になります。ただし、データベースが (Rails以外の) 他のアプリケーションからも使用されるのであれば、データベースレベルである程度のバリデーションを行なっておくのはよい方法です。また、データベースレベルのバリデーションの中には、使用頻度がきわめて高いテーブルの一意性バリデーションなど、他の方法では実装が困難なものもあります。
  • クライアント側でのバリデーションは扱いやすく便利ですが、一般に単独では信頼性が不足します。JavaScriptを使用してバリデーションを実装する場合、ユーザーがJavaScriptをオフにしてしまえばバイパスされてしまいます。ただし、他の方法と併用するのであれば、クライアント側でのバリデーションはユーザーに即座にフィードバックを返すための便利な方法となるでしょう。
  • コントローラレベルのバリデーションは一度はやってみたくなるものですが、たいてい手に負えなくなり、テストも保守も困難になりがちです。アプリケーションの寿命を永らえ、保守作業を苦痛なものにしないようにするためには、コントローラのコード量は可能な限り減らすべきです。

 

 データベース、そしてコントローラ も出てきました。

バリデーションの実行時の動作って結局どうなるの?

バリデーションのコードを書くと、例えば文字が入力足りなかったりしたら赤字でエラーが表示されたりとかするために書くんでしょ?

とだけ(ざっくり!)思っていたんですが、中ではもっと複雑な動作がなされていたようです。

新規レコードを作成して保存すると、SQLのINSERT操作がデータベースに送信されます。既存のレコードを更新すると、SQLのUPDATE操作が送信されます。バリデーションは、SQLのデータベースへの送信前に行うのが普通です。バリデーションのいずれかが失敗すると、オブジェクトは無効(invalid)とマークされ、Active RecordでのINSERTUPDATE操作は行われません。これにより、無効なオブジェクトがデータベースに保存されることを防止します。オブジェクトの作成、保存、更新時に特定のバリデーションを実行することもできます。

なんというか、まとめるにまとめられない。

今日は風邪をひいて声が出ないので引きこもってずっとPC叩いてました。

でも人間の集中できる時間って短いですね。。

Rspec,git diff etc...今日も自分の知らなかったことをどんどん使いました。脳みそが痒いです。頑張る。。。

 twitterアカウント作り直しました!

そしてUdemy がセール中なのもあり今日はVue.jsのコースも買ってしまいました。。。

1200円セール中!

 

エンジニアの知的生産術を買いました。生活がどんどんエンジニアっぽくなってきたよ。

f:id:simpledancer:20180824201122p:plain

「初学者にはどのようにプログラミングを学べばいいかかなりタイムリーな内容になると思うよ」って言われてしまったんで。

kindleじゃない本はなるべく買わないようにしてるんですけど。

買いました。

難しそ〜

メンターに勧められたらとりあえず自己投資!

もうプログラミングに関しては数年独学したけど、結局ダメだったので

今のメンター立場の方のおすすめは、全部真似してやろう!自己投資できるものはやってやろう!ってことで本もバンバン買っちゃいます。

毎日知らないことだらけが出てきて大変ですが、楽しいです。

もちろんいつものようにダンスの仕事も練習もこなしていますよ〜

 

発売されたばかりですが、本を読むのは好きなのでちょっと楽しみです。

やはりメンターは必要だ!

テックアカデミーを1か月だけやっていましたが、その間も質問し放題だったので進めるスピードが全然違いました!

今回たまたま縁あってメンターしていただいていますが

深くまで考えることができるし、うやむやにしていたところを見逃されないというか。

独学オンリーだと、やっぱりまあいいか〜って流しすぎてるところがたくさんありました。。

オンラインでも対面であっても質問できるってかなり良い環境です。

teratailやスタックオーバーフローももちろん役に立ちますが

自分がバンバン質問できる環境を手に入れるのって近道かもしれません。

そういう意味ではプログラミングを独学で学び始めたら、早い段階でインターンにいくなり、プログラミングバイトをするなり、メンターを雇うなりした方が良いのではないかな〜と思いました。

 

開発覚書 gitを理解するためにやったこと

f:id:simpledancer:20180810111714j:plain

はい、数日前から友人の会社のアプリ制作に参入してます。

simpledancer.hatenablog.com

しょっぱなからgitでつまずきました。

そもそも個人で開発する場合はプルリクエストなんて必要ないのですから。。

 

www-creators.com

Redeme.mdの編集をしたよ

今回はREDEME.mdを編集してねというミッションだったのですが

そもそもmdってマークダウンの略だったんだ!初めて知りましたよ。

マークダウン記法については以前少しだけやっていたけど実際に使うのは初めて。

qiita.com

マークダウンを書いたらチェックできる便利なサイトもありますね

これ結構役に立ちました!

dillinger.io

プルリクエストを出してみる

プルリクエストを出すのも初めて。。作業表をもらってやってみました。

  1.  現在自分のブランチが master だと思うので git checkout -b (ブランチ名) をして新しいブランチ作成
  2. README.mdに見出しを作成し、その下に今回の行ったことを完結に記
  3. git add README.md でREADMEを gitの更新配下にする
  4. git commit -m 'コミットメッセージ〜〜' とし commitする
  5.  git push origin fix-readme をしてrepositoryにcommitした内容をpushす
  6.  github の New pull requestボタンから master <-  ブランチでブランチのプルリクエストを作る
  7. reviewers をレビューしてもらう人 、 Assigneesを自分にする

という感じで無事プルリクエストも出せ、レビューもしてもらいましたが、そのあと同じブランチで修正をかけたので、さらにプルリクエストを出そうと思ったら

create pull request ボタンが出てこない!

どうやら同じブランチでpushすると自動でpullリクされてるらしいので下に出てくるまーじボタンで自分でマージすれば良いようです。

backlog.com

Udemyのgitコースを購入しました

f:id:simpledancer:20180824145547p:plain

Udemy のおすすめで書かれていたもう怖くないGit!チーム開発に必要なgitを完全マスター のコースを購入しました!

わかりやすいです、まだ途中なんですけど。

昨日飲み会だったんですけど、おじさまにご馳走になったので、浮いた分で自己投資!

飲み会代にもならないくらいですけど。

今日は移動中にみました。スライドと音声だとかなり構造がわかりやすく説明してくれてます。

これは確かにgitを理解するのに良い教材だなと思います。(本とかよりもいいかもね)

 

simpledancer.hatenablog.com

sale中なのでUdemyでReactのコースを購入しました!

f:id:simpledancer:20180823101945p:plain

Udemy でReactのコースを購入しました!

24000円→1200円!

とってもお買い得。。!一週間セール期間中なようです。

購入理由

あれ、Rubyじゃないんだ?って感じなんですけど、

今携わり出した開発でgit yarnのところにつまづきました。

このコースの最初の方で

f:id:simpledancer:20180823102320p:plain

と、昨日までで苦労したところが全部網羅されているので(

yarnとgit)

本1冊分でものすごいボリュームなので、これは買いだな!と思って購入しました。

Udemyの使い方のおすすめ

Udemy の動画は倍速とか、速度を変えてみることもできるし、スマホアプリがあるのでスマホでも見られる。。つまり移動中なども電車の中でみることができます。

私は前は講座の最初から止めつつ、書きつつ。。ってしていたのですが

  1. コース概要を確認
  2. 倍速で流れを確認
  3. 実際コードを書いていく

この流れがどうやら良さそうです!

この方の学習方法参考になります!

 

 

書籍もなるべくおすすめされたものは購入していく予定ですが、行かんせん、技術書、重い。。。!なので動画の教材の方が個人的にはすごい助かる。