さわぴかのなんでもノート!

学びのアウトプット!なにについて書くかはわかりません!なんでもノートです!

【今日学んだこと】未経験からエンジニアで転職「7週間目その1」

月曜日!

やっぱPHPとかJavaとか触ってるほうが楽しいかも、、って思ってしまった今日

今日やったこと

  • skype朝礼、終礼with Mさん、Eさん
  • 同世代祭りシステムのを進める、
  • Spring入門の本
  • bootstrapの勉強

できなかったこと

明日やること

  • skype朝礼、終礼with MさんEさん
  • 同世代祭りシステムのを進める

  • 管理画面にキーワード検索を追加

  • 案件を表示する一般公開側にもキーワード検索を追加する
  • 「案件リスト」にて案件作成時、選択してコピーできるようにする
  • 管理画面の方のURL、adminを入れて変える
  • ページネーション作る、20件ずつとか

  • 見た目を整える

見た目 * ヘッダー作る * フッター作る * 上記二つができたら、テンプレートのレイアウト化する * 検索窓を増やす * その他見た目、できる範囲で、、、

今週やること

  • 勉強しつつ同世代祭りシステムのを進める
  • 表側も出来るだけかく

来週やること

めも

Javaのこと

同世代祭りシステムのを進める

今日の流れ

・Sさんから返ってきたのをまとめて返す

・bootstrapの勉強しつつ、見た目を綺麗にしていく


・Sさんから返ってきたのをまとめて返す

カラムの結合 MySQL CONCAT(文字列1, 文字列2, 文字列3)

HTML/CSS、bootstrapのこと

先週考えてた全体像

【トップ画面】

ヘッダー

  • サービス名
  • 検索?

トップ

  • サービスの説明文
  • 補足?

案件一覧

  • 検索
  • 案件一覧:カテゴリとタイトルと案件詳細少し

フッター * ご利用ガイド? * 利用規約? * 会社概要? * お問い合わせ? * コピーライト

もともとこぴったのがbootstrap使ってたからついでにそのまま使ってみる

bootstrap

このチュートリアル見てみる

https://bootstrap.hana87.club/

タイポグラフィ? →「文字をきれいに、読みやすく見せる」設定

タイポグラフィとは?基本ルールと作り方 37の要点

グリッドクラス →Bootstrapグリッドシステムには4つのクラスがあります。

xs(電話機用) sm(タブレット用) md(デスクトップ用) lg(大型デスクトップの場合)

ジャンボトロン →大きなボックス

f:id:pikahika:20200316105304p:plain
before

f:id:pikahika:20200316105323p:plain
after

ウェル →.well クラスは、灰色の背景色と少々のパディングを持ち、要素の周りに丸みのある境界線を追加

ボタンについて

https://bootstrap.hana87.club/button.html

ラベルがうまく動かないー

https://bootstrap.hana87.club/badge.html

https://bootstrap.hana87.club/typography.html

一通りみるのすぐできちゃった、入れ込んでみるかー

あ、bootstrap4になってからなくなったのとかもあるから動かない模様

Bootstrap4に用意されているクラス【card編】

バッジ~Bootstrap4移行ガイド

f:id:pikahika:20200316125241p:plain
いらん線はあるけどカテゴリをラベルにできた

aタグの水色を黒に→class="text-body"

aタグの下線を無くしたい→

display: inline-block;
text-decoration: none;

ならないなんでー

PCの時は2列にしてみたいけど、うまくいかないー

[https://cccabinet.jpn.org/bootstrap4/layout/grid:title]

[https://bootstrap.hana87.club/navbar.html]

フォームも綺麗にする

[https://bootstrap.hana87.club/modal.html]

追加のCSS聞いてなかったの、

なかったからだった、初歩的w

でもaタグの下線が消えない

a:hover {

    text-decoration: none;
}

hoverした時、が抜けてたという

Bootstrap4カラムの位置を調整【カラムのオフセット】

f:id:pikahika:20200316170331p:plain
とりあえずこんな感じになったけど、、、って感じ

f:id:pikahika:20200316170732p:plain

Bootstrap4 Border(ボーダー)の使い方を徹底解説 | WEBST8

入れ込みたいもの

・管理画面の一覧のテーブル、これのホバーテーブルにしよ

https://bootstrap.hana87.club/table.html

・検索後のカテゴリをラベルでみやすくしたい done

https://bootstrap.hana87.club/badge.html

・ページネーション

https://bootstrap.hana87.club/pagination.html

・パネル

https://bootstrap.hana87.club/panel.html

一覧画面に入れてみよう

・ナビゲーションバー

https://bootstrap.hana87.club/navbar.html

・フォーム

https://bootstrap.hana87.club/form.html

・送信完了!をモーダルでやってもいいかもしれない

戻ってやりたいこと

外部キー設定

マイグレーションはあったけどシーダーはないのかな、調べる

セキュリティ的なの何も気にしてないCSRFあたりってどうするんだろ

インデントの整理

Spring Boot でログイン画面 + 一覧画面 + 登録画面の Webアプリケーションを作る ( その10 )( ログイン画面作成3 ) - かんがるーさんの日記

あとで見る

Spring Bootで使われる基本的なアノーテーションと設定の仕組み (1/3):CodeZine(コードジン)

スネークケース、キャメルケースあたり質問しよ

カテゴリのinsert

joinの仕方 done

カテゴリのプルダウンをDBから done

あとなぜかログインのところがデフォルトの?が最初に表示されちゃう。多分どっかがうまく切り替わってない

エラーページを作る

うーん、複数条件検索ってどうするんだろ、自由記述の検索窓どうしよう

inにするために、先にチェックされたカテゴリのidをカンマ区切りにしてから入れ込むとか、、、?

とりあえずフリーワードの検索orカテゴリ1つバージョンにするか

公開されてない案件 jobs/2 とかにされた時のエラー画面

テンプレートのレイアウトか

手前の詳細部分にはjob_id入ってるんだけどnull?か何かで0でDBに入っちゃう

コードが全体的に汚い、綺麗にしたい

選択したプルダウンを検索語の画面でも保持しておきたい気持ち

管理画面の並び順の変更

コントローラ、増やしたほうがいいのかなーと思いながらjobに集約してしまっている感

カテゴリの編集が、全部営業スタートになっちゃってる

ユーザー側のエラー

【応募はいません。のif文】

マイグレーションが変 けど結局hiddenで送ってしまった

【jobs/2とかにした時のエラー画面を作りたい(is_enabled=1以外の時の処理)】

テンプレートの共通化

管理画面のURL

ページャー 20件ずつとかかな

上に戻るぽたんとかもつけたらjavascriptもかけていいかな

検索したら何件ありました、みたいなやつ?