20210114_アウトプット(チャット風UIの作り方・オリジナルアプリ)
今日行ったこと 5時間10分
エンドポイントについて 1 時間
👉JavaScriptに書いてあるopen
とルーティングがリンクしていることがわかりすっきり。オリジナルアプリ 2時間
👉もう一度作り直しを始めた。
新しい発見
吹き出しのCSSの方法
- オリジナルアプリに取り入れたいと思ったためドットインストールで学習。
ドットインストール「CSSでチャット風のUIを作ってみよう」のレッスンより
ドットインストールを通して初めて知ったことは、
〜第一ステップ〜
(1)width
とheight
を同じpxにする。(ここでは20pxとする)
(2)border
で線をつける。(border 5px solid black;
)
👉まずは□(四角)ができる。
〜第二ステップ〜
(3)border
で線に色をつける際「右側の辺だけこの色」と指定できると知る😲(border-right-color: white;
)
(4)(3)のsolid(銭の太さ)を極太にしていく(ここでは40pxとする)
(5)(1)のwidth
とheight
を0pxにしていく。
👉△が出現する。
始めは「え??どゆこと???」と思ったが、
四角形作った後に、ボーダーを利用して、三角形に見える形にしていくというのを理解した!!(すごい!)
オリジナルアプリについて
もう一度作り直すことにした。
自動化(circleCI)やCSSフレームワーク(マテリアライズ)等、新しいことにどんどんチャレンジしようと思っていた。
しかし、いざオリジナルアプリを作ると、初歩的な部分すら時間がかかる&思った通りの実装が出来ないことに気づく。
新しいことにチャレンジしすぎて、エラーが発生している場合に、今回初めてチャレンジした新しい技術が原因なのか、今まで習得してきた知識で実装した部分が原因なのか、エラーを捉えることが出来ていないことに気づく。
一つ形にしてから、改善できる部分に、自分がやったことない新しい技術にチャレンジして取り入れていこうと方向性を変えることにした。
今日やったこと
gemの導入
ヘッダーフッターの実装スタート
ロゴの作成
感想
勉強時間確保できたのはよかった!しかし、つい遅くまでやってしまい寝不足気味。
ヘッダーとフッターに思いの外時間かかる。全然上手くいかない。
ドットインストールで吹き出しの方法を学んでいる時、ワクワクしたなあ。
エンドポイントについてメンターさんに聞いてやりとりしている際、励ましてくれて本当に嬉しかったなあ。頑張ろうと思えた。
覚書(12/29計画の見直し)
(1)やるべきこと (2)やりたいこと (3)やれること
(1)やるべきこと
- 卒業要件の完成
(2)やりたいこと
追加実装を学ぶためのミニアプリ作成
オリジナルアプリの作成
PHPの勉強
面白そうだから参加したい・見たい(やめ太郎さんのキータ表彰・yahooイベント)
読書
(3)やれること
メンタル:楽しみながら、ゲーム感覚でいく🎮😎
時間で区切り(達成すればよし)
PHP 一日15分以上
オリジナルアプリ 1日1時間以上
追加実装のミニアプリを作り、引き出しを増やす
優先順位 | 内容(機能) | 締め切り | 達成度 |
---|---|---|---|
1 | AWS S3 | 12/18 | 完了(フリマアプリ)に実装) |
2 | AWS EC2 | 12/24 | 完了(フリマアプリに実装) |
3 | ウィザード形式 | 12/27 | 完了 |
4 | SNS認証 | 12/28 | 完了 |
5 | 複数条件検索 | 12/29 | 完了 |
6 | タグ付 | 12/31 | 完了 |
7 | 画像プレビュー | 1/2 | 完了※フォーク |
8 | 複数枚写真OK | 1/4 | 完了※7に追加実装 |
9 | コメント機能(即時更新) | 1/8 | 完了 |
10 | クレカ登録 | 1/10 | |
11 | パンくず | 1/14 | |
12 | 日本語エラー | 1/18 |
身に付ける力(直近)
PHP7
Docker