一週間メモったことをまとめるページ

11/18

 

 

一応受託とSESの企業ということもあり

久々に面接的な形で外に〜

 

久しぶりに自分を見直す機械で新鮮。

 

→改めて自分まだまだできること少ないと思い知らされる。

コードもプログラミングの考え方もコミュ力ももっと磨ける!!

 

11/19

 

ウォーキング+全力ダッシュ

 

繰り返し試行錯誤積み重ねることで

サービスが出来上がる。

 

     継続力+方向性 = 大事

 

リモートはみんなで共同で編集してるリポジトリ(開発者全員に影響を与える保存先)

ローカルはリモートとは隔たれた自分だけのリポジトリ(ファイルの保存先)

最悪ローカルでやらかしても何とかなるが

リモートでやらかした場合修正に時間がかかる。リモートへのプッシュは慎重に

(フリーランスになって働くにあたっては確実に気をつけないと爆死する)

 

SourceTreeの使い方かな

 

線路みたいになるのは

複数のブランチを切ったときに

今行ってるブランチとは別のブランチがコミットを続けていった場合に表示される。

 

複数のブランチが切られてる時に

現在のブランチ以外でソースコードに変更があった場合

線路が別れるみたいな表示

 

 

⬆️の画像みたいに線路の分岐の発生

線路の集合点はハブになってる駅みたいな感じ。

東京で言うたら東京駅とか新宿とか渋谷かな

 

ドロップダウンメニュー

cssだけで動かす方法

https://into-the-program.com/vue-dropdown-menu/

 

CSSだけでドロップダウン再現はかなり疲れる。

 

jqueryを用いないと大変そう

https://tech-dig.jp/dropdownmenu/

 

   jQuery使ってしまえばかなりの再現性

 

   SourceTree開発できる基礎知識が身についた日って感じ

 

11/20

ウォーキング+全力ダッシュ

 

laravel * Vueでサービス開発始めよう

SourceTreeの学習もできるしVueも同時にやりつつLaravelも

メインはVueで

     ここから自分のLaravel と Vue用いたサービス開発が始まったっぽい

 

どんなサービス??

自分の登録した言葉や記事リンクがコメントと共に保存できるサービス

カテゴリに分けたり

お気に入り機能も

    こんなサービス盛り込みたい的な

 

Laravelでログインできないとき

 

DBの設定が間違ってる時が多い!!

.envファイルの設定見直し

サーバーの再起動 

command+C → php artisan serve

何回忘れたことか(笑)

    DBとの接続ミスったっぽい

    .envファイル内の記述とDBの名前が違ったり

   接続するやり方が違う的な感じだった気が。

 

  • 通常のWeb ページでは実現できないユーザー体験を実現できる。
  • 高速なページ遷移を実現できる。
  • ネイティブアプリの代わりとして提供することができる。

    ⬆️おそらくSPA(Single Page Application)の解説

     SPAの代表格といえばGoogle Maps Facebook

    ページの切り替えが一部だけなのでサクサク動くのが魅力

 

お昼はheaderから!!!!

webpack.mix.js

の記述を変えれば

 

npm run dev(.envファイル)の確認ファイルを変更する事ができる

参照サイト

https://qiita.com/ma7ma7pipipi/items/b5953e0524a203ef02f5

 

 

これがwebpack.mix.jsの中身になってて

第一引数の中のファイルをコンパイルして 第二引数のディレクトリ内に出力させる

 

 

scssは@importで他のファイルを読み込むことができる

使うページごとにファイルを分割できるのは

保守性高いね!!

 

    ファイルの名前ごとにそのファイルの記述が

    何を書いてるか教えてくれるような書き方で。

 

command+数字で左から数字番目のタブに移動できる

 

最初に複数ブランチ切って

そこからその切ったブランチ同士をつなげた後で

masterのブランチをそのマージしたブランチにマージすると一本の直線になる。

 

 

 

一人で開発進めるにあたってもGit使うべき

★アカウントに草生える(錯覚資産)

★ファイルのver管理ができる(保管)

★複数人で開発の時、確実に使う(慣れの意)

エンジニアとしてだけでなくてファイルの保管にもつかえるので

他の分野でも使えるGitはお勧め

 

     Gitみたいに便利なツールあったんかいな。

     ゴリゴリ使いこなそ

bootstrapかScssか

Bootstrap

すごい便利でレスポンシブ対応も簡単にclass名で決定できる

一方で画一的なデザインになってしまう。

制限もある

Scss

コード量はBootと比べると増える。

階層構造を理解していないと難しい。

一方で画面サイズに応じた自由自在な表示が可能

おすすめはSCSS。やっぱり似通った画面は面白くない!!

低コストでサクッと作りたいときにはおすすめ!!

    SCSSに役割分担しすぎてわかりづらくなる場合もあるけど

    自分的にはやっぱり記述分担してわかりやすくする方が良き。

 

SPAで作りたいからやっぱりNavComponentを何とかいじってVue.Router導入しよう!!!!

これをやらないとVueでやってる意味は皆無。LARAVELで構築した方が絶対楽

https://www.ritolab.com/entry/180

 

   Vue Router

          Nav や sidebarの記述で使うとすっごい捗る。

   自分的にはありよりのあり。

           to = にリンク指定して

           routerのファイルにpath指定する

 

 

   簡単にですけど、こんな感じでrouter-viewの部分が

 クリックされたリンクで切り替わるって言う仕様です。

 

  すごい便利なんです。

 

   vueに携わる仕事したいっす。   div id ="app"で指定して

    これで自分も開発始めた〜〜

11/21

ウォーキング+全力ダッシュ

出社は早く 最近調子がいい友達も 出社は早い

★今日のタスク整理

★予期せぬトラブルへの対応

★会社からの評価(錯覚資産)

★同僚とのコミュニケーション 一週間だけでも継続してみたら

意外と惰性で継続できるよん!!

 

    早く出社するメリットまとめてる

    特に今日のタスク整理ができてるかできていないか大事。

    俯瞰の視点は大事。

 

コンパイルしないとvueやscssのファイルはで認識できない

    元はjs cssのファイルやかんねぇ〜

 

mysqlのサーバーの再起動

よく忘れるから掌にでも刻みたい

https://helloworld-blog.tech/php/laravel5-6-vue-js2-5%E3%81%A7spa%E3%82%92%E5%AE%9F%E8%A3%85%E3%81%99%E3%82%8B

 

リベース

★コミットすることなくマージする事ができる

★履歴がきれいになる

 

基本的に複数人で開発している時にリベースを行うのは危険。

詳細が分からないけどリモートの整合性が取れなくなる。。。

 

     基本的にリベースは使わない方針で行きたい

 

router-setting

でRouterをAlComponent内で使用できるように!!!!

そしてSPAの実装。

Routerの実装完了

 

app.js router.jsとで機能分けてあげる

router.jsがリンク先を判断してそのページを返す

app.jsが頁とrouterとのハブ的な役割

 

app.jsを読み込んだ頁

<router-view/>部分に読み込んだコンポーネントが表示。

 

感覚でいいから絵にかくと分かりやすい

一つしかないもの

componentみたいに複数あるもの

それらを簡単な図示してあげよう。

イメージよりも実際に目で見た方が記憶に残る。

   こんなページ作りたいって時に頭でイメージしても

   メモリ使ってしまって明らか効率悪くなるから

   神にでもデザインや、雰囲気を記してあげること大事。

 

 

SourceTreeとは仲良くなったはず

ブランチ→コミット→マージ→プッシュのループ

これら以外は使う機会少ない。

 

   習うより慣れろの精神で自分で使ってたら知らぬ間に覚えてる。

   行動の中身を考える人いるけど

   最初は行動してみてそこから考えてみるべき。

   自分はそれを意識してる。   

 

https://gimmicklog.com/jquery/203/

drawerメニューの実装

 

    これはすごい便利なDrawerメニュー

    しかも実装簡単

 

https://uncle-javascript.com/vue-component

componentをまとめたいけどできない

→require(‘’)でファイル名出いけた

簡単やん。。。

 

     jsの理解がまだまだ。

 

 

複数人開発

最近始めたばっかりだけど必須なのは

Git等のver管理ツール

slackなどの意見交換

コミュニケーション

 

リモートで開発中でこれないと100%開発の質落ちる

Git導入してない企業あるっての聞いたけど

どうやって管理してんのさ。。

https://qiita.com/aipacommander/items/d61d21988a36a4d0e58b

 

確か木曜日までで

  • BladeファイルにRouter導入した
  • API調べてリンクに実装
  • app.jsファイルからrouter.jsファイルに分けてapp.jsファイルの負担を減らす

 

の実装。

11/22

 

classや役割わけたほうがよいもの意識して書く

 

午前中

画面構成 Mypage Post drawermenu完成

 

    会社での勉強会的なので、設計の仕方習ってるけどすごい勉強になる。

    エンジニアが効率的なのはPCのメモリ使わないように意識したり

    コストのからない設計とかやってるからやろうな。

 

    これが普段の生活と、仕事との境界線がなくなって

    コミュ力なくなる原因なんかもって思ってしまう。     

 

style scopedを使えばそのvueファイルのみにスタイルが適用される

          componentファイルのstyle部分に記入した内容はその

   component内にしか適用されない。

 

昼からサーバー側

https://blog.hirock17.com/laravel/35/

laravelでDBとのつながりを設定してるから

vueで画面を作っている以上controllerの情報をview側に渡してそれをvueで受け取る

という流れ

   Controller->View->Vue

   っていう流れがむずかしす。。。。

 

    受け渡しとかもつらたんやな

scssは全ての部分から呼び出せるようにwebpack.mix.jsに

記述してあげることで読み込み可能

 

昼からは

 

頁編集楽にするためにつくってるふぁいるは絶対アップしない

POST投稿を保存するロジックと保存した投稿をvueで表示させるコードを書く。

 

scss

ネストして同じ中身を使い回すときで

ネスト内の値を参照するときはすべてのセレクタを含めてあげる必要がある

     @extend .inpiut-title-containerのように全てのセレクタ名を指定します〜

 

入力されたデータを都度更新できるのか

seederファイルにDBに作るデータの個数記入したら

具体的な内容を決めるためにファクトリーファイルに移動して記入

できたらDatabaseSeederにseederファイルを呼び出すための記述を記入

php artisan db:seed

    DatabaseSeederに記入するの忘れて時間取られた。

    自分の考えてるように上手くいかない場合それは違う可能性があるっ

    ていうのを早く受け止められるようにしよ。

なんとかSPA作ることができたから後は

これがなんでかっていうのを人に説明できる様に。

投稿ページ行きます

入力します

送信押します

メソッド走ります

axiosで取得??で表示??

http://dim5.net/laravel/using-conditional-where.html

laravelのORMがわかりやすく書いてある記事

https://qiita.com/niisan-tokyo/items/156eb35c6eeaf07b9b65

ORMについて

 

    ORMって何の事かと思ってたけど

    SQLを用いずにDBのデータと連携ができる。

 

 

 

 

   こんな感じでPHPのコードを書くのと一緒に書くことができるっていう。

   非常に便利。

 

一週間どうやった

 

今週はやりきった感がある

そして感情の起伏が大きかった。

 

感情が揺れ動く時ってなんか強くなれる気がする。

めっちゃ抽象的すぎて怒られそうやけど。そんな一週間。

 

今週のツイート3選

 

 

 

来週もコツコツ頑張りやす。

 

おすすめの記事