ポートフォリオ作成に着手してもうすぐ１ヶ月が経とうとしていますが、中々javascriptさんと仲良くなれなくてしゅんとしちゃってる今日この頃の俺です。 今回はセッターとゲッターについて学習していきます。 今一度セッターとゲッターについて復習しておく…

昨日はPF進捗報告会と技術面談を詰め込みました。つよつよな方々と話すことによってつよつよになれた気がしている勘違い野郎ことスバルです。 貴重なアドバイスをいくつかいただいたので、咀嚼するために、一つづつブログにログとして残していこうと思ってい…

データをフロントで持たせたい。そんなことって日常茶飯事ですよね。僕は脳筋すぎて、データ？とりあえずVuexに突っ込むっしょﾋェﾋェとか考えてました。 技術面談でその考えは儚くも砕けさりました。 どうやら静的な値はconstに切り出して保管しておく方法が…

絶賛ポートフォリオ悪戦苦闘中なわけで。 その中で、診断内容とお酒テーブルを結びつけたいと思っている。 そしてお酒テーブルから派生して同じカラムを持つ酒の種類テーブル？みたいなものを作りたい。 はいはい、中間テーブルにid持たせて多対多を作るやつ…

vueインスタンスが生成されてとか知らんし。とりあえず動けばいいし。 と考えていた自分に鞭を打つ。ライフサイクルフックを軽くでも頭に入れておかないと痛い目にあうらしい。 Vue嫌い！無理！とイヤイヤ期に突入してしまった自分を鼓舞するために、今回は…

ActiveModelにあるデータを.vueに呼び出すためにはどうすればいいんだ。 やり方があるみたいなので、学習していく。 Railsにあるデータをjsonに直す モデルをvueに表示させる 解説 v-for axios mounted 実際にとってきたデータ Railsにあるデータをjsonに直…

今後の投稿では、RUNTEQのカリキュラム内容に言及することは控えさせていただきます。 さて、エラーに詰まった時は圧倒的インプットに逃げてしまうことスバルです。 今日もアウトプットドリブンなインプットをしていきたいと思います。 今回はv-modelについ…

とりあえずVuexにデータを保存することはできた。でも、どうやって呼び出してくるの〜ドラえも〜んVuexから関数を呼び出してくる道具が欲しいよ〜〜。 しょうがないな~のび太君、はい、Google検索をあげるよ。どうやらmapState,mapGetters,mapMutations,mapA…

今日はバディ面談で河原さんと就活に関してお話ししたり、Discordで西村さんとお話ししたりして、エンジニアになる決意がより一層強まったぞ！みんなもバディさんや西村さんを頼ってくれよな！ #らんてくん感 さて、今回はバリデーションに関して。 ログイン…

ユーザーがいるページに応じて表示する内容に制限をかけたり、ゲストか会員かどうかに応じてなどの条件分岐を実装したい。 v-if条件分岐レンダリングというものがあるらしい。学習していく。 v-ifって何 v-if ディレクティブは、ブロックを条件に応じて描画…

PF進捗報告会お疲れ様でした〜映画の予告編共有、コンビニ飯レコメンド、乃木坂46の推しメンレコメンド、みなさん個性的だったな〜参考になるコードを散見したから自分のPF作成に参考にさせていくことにします〜 さて、今回はFormObjectについて取り扱ってい…

下記ブログへ移行しました。 octomblog.com

Webpacker手強かった、、 でも倒せた！成長！ここ二日間すごい足踏みしたけど、 また明日からVueの学習に戻れるから気持ち新たに頑張るぞいっ＃ぞい webpackの概要 webpackとはウェブコンテンツを構成するファイルをまとめてしまうツールです。一番多い使い…

今日中にエラーを討伐できなかったので前半後半に分けるという愚行をすることをお許しください。。 Herokuにデプロイを試みたときに下記エラーにハマりました。 yarn install v1.22.4 remote: [1/4] Resolving packages... remote: [2/4] Fetching packages.…

結局フロントエンドをVue.js、バックエンドをRailsに任せるという構成にして、Vuexを導入することにした。 Vuexを導入した理由は、アプリ作成を進めていく中で画面数がプロトタイプよりも増えたから。階層が複雑になることによる弊害を回避したかった。 早速…

「エラーに直面した時に、ネット上に沢山先人の知恵が転がっているので自分で解決しやすい」という理由でMySQLを選びました。 早速サーバー接続エラーにぶち当たりました。 先人の知恵をフル活用して対応していきたいと思います。 Github Actionsを実行した…

コンポーネント間で値を受け渡しする流れが一生分からない。悩んでも仕方ないから、とりあえずインプット量を増やす。てなわけで、今回は.syncに関して学習していく。 .sync修飾子のどこが凄い？ .sync修飾子って何？ どう使うんですか？ もっと分かりやすい…

絶賛ポートフォリオ作成中で、つまづきポイントが出てきた。 状態管理どうする？と。 ほとんどがRuby on Rails で一部だけVue.jsで実装する場合、セッション情報の管理とかはRailsが行うからVuexは入れないでいいとよく聞くけど、実際どうなの？と。 整理し…

Github Actionsに苦戦中。 まだ解決はしていませんが、途中経過を残しておきます。 その過程でDockerさんと知り合ったので、特徴についても書きました。 Github Actionって何？ Githubが用意している便利なワークフロー。 ブランチにプッシュした時に自動で…

早くGithub Actionsを実装して脳死デプロイができるようになりたいです。 今回は先人PFによく出てくるv-slotについて学習していきたいと思います。 v-slotとは propsとの違い どんな旨みがあるの？ 書き方は? 名前付きスロット 名前つきslotの省略記法 スコ…

状態を管理してくれるらしい。状態って何。分からない。 いつも通り、アウトプットありきのインプットをしていこうと思う。 Installation | Vuex Vuexとは 状態管理ライブラリ。データフローが単方向になるように設計されている。 大きなアプリケーション開…

コンポーネントを渡す流れが分からない、、 props?$emit?他のファイルに値を渡す作業って難しい。 どうやらpropsと$emitという概念があるらしい。 文献を参考にして頭に入った感を味わうために今日もVueの学習を進めていく。 props ポイント $emit ポイント …

v-〇〇の種類が多くて頭がパンクしそうです。脳をオンプレミスからクラウドに移行したいことスバルです。今回はv-modelについて学習していきます。 v-modelとは dataオブジェクトのプロパティの値とinputタブの入力値や選択値のデータを連動することができる…

他の方のポートフォリオを見ていると、mountedやcreatedなど、見知らぬ用語が頻出してちんぷんかんぷん。調べてみると、Vueにはライフサイクルフックなる概念があり、理解したいと思ったから学習する。 ライフサイクルフックとは Vueが初期化されてから削除…

Vueの４つの特徴（コンポーネント、トランジション、拡張性、リアクティブネス）の一つで あるトランジションについて、モーダルの実装を通して学習していきたいと思う。 transitionって何？ Vue は、transition ラッパーコンポーネントを提供しています。こ…

脳みそをオンプレミスではなくクラウドに移行したいことスバルです。 前々から気になっていたAPI。curlを入力するとjsonが返ってきて、それを読み込んでviewにjsonの中身を表示させるものかな？くらいの認識だから、もっと体型的に学んでいこうと思う。 それ…

データベースの違いがわからない。rails newする時のデータベースって何がいいの、、 分からないのなら調べちゃおう。 という事で、今回は個人開発によく使われているMySQLとPostgreSQL特徴についてまとめていきたい。 データベースとは データベースとは「…

今回はVueの特徴の一つである「コンポーネント」について学習していきたいと思います。 component(コンポーネント)って何 部品という意味で、使いまわすことが可能な塊というイメージ。 ヘッダー、フッター、ローディング画面やエラー画面など、複数のviewに…

最近Vue、コンポーネント、リアクティブ性、拡張性の高さ、トランジションが特徴、の学習を始めました。Vue Router公式を参考にして特徴と使い方についてまとめていきたいと思います Railsのルーティングとは違うのか？7と感じたので、学習していきます。 Vu…

やっとER図の作成が終わりました。これからポートフォリオ完成までの道のり、「issueを切り出す」ことをやっていきます。その前に、ER図作成時にやってしまったデータベース設計でのアンチパターンを2つまとめたいと思います。 当初のテーブル設計 下記テー…