今日やるべきこと

🍊 今日やるべきこと

組織

mappageコンポーネント

kakao map導入

サイドバーレイアウト

kakao地図位置交付学習

注意事項

注意

心理標識

Webアクセス可能注意

alt必須

反応型、移動符号化

tabinde=>キーボードサポート

が必要

ロード処理が良好かどうか(インジケータ、レイアウト保持、ロード失敗時フィードバック)

.

のデータをロードできない場合は、ユーザーに正しいフィードバックを送信していますか?

でロードされたデータサイズが0の場合、エラーやエラーのように見えますか?

開発者コンソールを開くと、JavaScriptエラーが発生しますか?

モードウィンドウエラーハンドル

が必要

誤ったハンドルを作るルールも必要です.
ネットワークエラー
サーバAPIから受信したエラー
ユーザブラウザ環境エラー

無限ロード処理

コメントリンク

逆宣言エラー処理

はんのうごさせいぎょ

ディスカッションが必要

immer.js=>(不変性)

マニュアルの開始位置=>正しい位置を特定する必要がある

ココアマップ使用公告

🍊 今日のアレンジ

🍉 地図機能と注意事項をまとめる

=>モードの内容
1.ガイドプロフィール、氏名、性別
2.正しいアドレスを決定する必要があります=>ガイドの開始位置=>
3.ガイド可能日
4.参考写真
5.ガイド内容
6.後日の開業案内

基本

フィルタなしで「検索ガイド」ページに移動する場合は、ガイドカード全体を表示します=>地図を大韓民国全体を表示するように設定します
=>img等はalt詳細記載が必要

地図エリアを拡大すると、該当する位置のガイドカードが表示され、フィルタリングされると、フィルタリングされた日付と性別に一致するガイドカードが表示されます.
=>サーバリクエストとリフレッシュが多数発生します.

このモードを表示するには、地図タグをクリックします.
=>モードウィンドウを表示しても、Webのurlを共有するためにrouteに設定できます.
=>Naverは、表示モードと非表示モードに応じてurlにスマート-androundを追加し、url共有を可能にします.
=>地図表記の場合は必ず読む必要はありませんが、aria-hidden=「true」でいいのでしょうか?
=>カードにtabindexを置いておけば、カードを検索するのは難しくないはず…

選択したモードに対応するカードが視覚的に表示されます.
=>色盲などの障害者を考慮する必要がある.

ガイドカードは2サイズございます
=>Webバージョン、アプリケーションバージョン(アプリケーションバージョンのUIはまったく計画されていません.予想外の時間がかかる場合があります).

はんのうがた

地図は収縮に適用され、サイドバーは適用されません.
=>767 pxはいずれもWeb反応型アプリケーションなので、この大きさに応じてサイドバーや移動サイズを適用すべきです...

移動

767px

フィルタ項目をヘッドに、カードを下に、

カードは水平スライド形式(スクロールにより実現)

を採用する.

ガイド毛髪は全画面充填形式

を採用する.

🍉 地図地図=>ココア地図として確定

Google静的地図apiのデフォルトは640 px X 640 pxを提供し、より大きな地図を提供するためには追加のステップが必要です.私たちのページには640 px以上のサイズが必要です.

の3倍、韓国人はプレイヤーなので、韓国の住所値だけが必要です.今後は世界的にサービスを拡大する可能性がありますが、現在4週間のプロジェクト進行中で、我々の目標は確定しているので、KakaoMapでも十分なサービスが実現できます.

🍉 ref vs getElementById

ref vs getElementById
refを使用すると、一方向データストリームに干渉しないため、コードのメンテナンスが容易になります.
ほとんどの場合、refを使用しないで同じコードを実現することができます.Netflixはrefを絶対に使用しないという原則を制定し遵守しているそうです.

🍉 NavBar position問題

解決コード

  position: sticky;
  position: -webkit-sticky;

他のページをブラウズすると、ほとんどの上に固定するためにnavbarはfixedを使用していることがわかります.しかし、navbarが下の要素と重なる可能性があります.この問題を解決するためには、空のラベルを挿入するかabsolute positionを使用する必要があります.
stickyを使用してnavbarの後の次の素子を位置決めするのがこれより良いと思いますのでstickyを使用することにしました.

🍊 DevLog

今日はどのようにプロジェクトに貢献しましたか。

mappageコンポーネント構成

Kakao map実現

サイドバーレイアウト

今日のプロジェクトで苦労したことは何ですか。

webとモバイルリアクション型を実現するには、コンポーネントのモバイルバージョン構成を考慮すべきであるが、Webバージョンの構成が完了した後、モバイルバージョンを考慮すると、コンポーネントを再構成する必要があるという問題がある.

今日のプロジェクトで残念に思ったことは何ですか。

モバイルデバイスとWebのすべてのレイアウト構成を考慮して、コードの作成を開始する必要があります.

明日は何をしてプロジェクトに貢献すればいいですか?

地図案内カードスタックデータ生成

dbスタックデータに基づいて地図タグ

を実現する

ブートカードUI構想