UMC 9週目
14331 ワード
1.学習目標
2.9週目以降
💡 6週目受講後の感想、それぞれの進捗状況を共有
目標:APIとDBを重点的に改善する.💡 Webページでサーバと非同期で通信するのも面白いですが、これは休暇中に自分で行い、APIに集中しています.
3.実習
タスクリスト
アプリケーションがプロジェクトを開始する前に不足点を復習する
やりたいこと
へんか
ページング処理は、既存の応答を「応答Entity」→「BaseResponse」に変更します(ステータスコードを表示します).
たとえばisSuccess、code、message
{
"isSuccess": true,
"code": 1000,
"message": "요청에 성공하였습니다.",
"result": {
"result": [
{
"postIdx": 6,
"caption": "LastTest",
"userIdx": 6
}
],
"pageInfo": {
"hasNext:": true,
"currentPage:": 2,
"totalPages:": 8
}
}
}複数のInsert
Post、Post Media、Mediaの3段階構造では、Postをプライマリ・テーブル、メディアをサブテーブルに変更することで、メディアを参照Postに変更
start transaction;
INSERT INTO Post (caption,userIdx)VALUES("StellaTest",6);
INSERT INTO Media (postIdx,fileData,thumbNail) VALUES(last_insert_id(),"Photo",1);
commit;データベースでTRANSACTIONを実行し、複数のクエリーを行ごとに実行します.
PostIdxは、PostテーブルのプライマリキーとAUTO INCREMENTであるため、last insert id()を介してメディアテーブルに入力される
制限点:1つの投稿に複数の写真とビデオを挿入する場合、Insert文をどのように処理しますか?
DMコンテンツの表示
select Message.roomIdx,Message.content
from Room
inner join Message
ON Message.roomIdx = Room.roomIdx
where Room.roomIdx=?
ORDER BY Message.content DESC;SELECT User.nickname, Message.content
FROM User
INNER JOIN Message
ON Message.sender = User.userIdx
WHERE (sender, content) IN (select sender, content
FROM Room
INNER JOIN User as u1
ON Room.user_1 = u1.userIdx
INNER JOIN User as u2
ON Room.user_2 = u2.userIdx
INNER JOIN Message
ON Message.roomIdx = Room.roomIdx
WHERE u1.nickname="test2" AND u2.nickname="97_csh")
ORDER BY Message.createAt DESC;API Sheet
API開発構想整理→API develop
🔥 問題シュート(失敗した経験も成長のための経験!)
Instagram . Media , CONSTRAINT Media_post_ID FOREIGN KEY ( postIdx ) REFERENCES Post ( postIdx ) ON DELETE CASCADE ON UPDATE CASCADE)postはpostIdxをプライマリテーブルとして参照し、mediaはpostIdxをサブテーブルとして参照するため、挿入時に参照整合性エラーが発生します.
tagIdxはTagテーブルのプライマリ・キーであり、メディアのサブテーブルであるため、defaultまたはidx値を入力する必要があります.
[ソリューション]
取引照会
start transaction;
INSERT INTO Post (caption,userIdx)VALUES("StellaTest",6);
INSERT INTO Media (postIdx,fileData,thumbNail) VALUES(last_insert_id(),"Photo",1);
commit;メディアテーブルのtagIdxのdefaultを「0」に設定
[参考資料]
4.コアキーワード
静的/動的Webページ
静的Webページ:サーバに格納されているHTML/CSSを直接表示します(変更はありません.変更時にHTML自体を変更する必要があります).
動的Webページ:サーバに格納されているHTMLに状況に応じてデータを追加/加工して変化を表示します(たとえば、ユーザーの要求に応じてWebページをリフレッシュする必要はありません).
ダイナミックWebページとは?
HTML DOM
ドキュメントオブジェクトモデル(DOM、Documentオブジェクトモデル)は、XMLまたはHTMLドキュメントにアクセスするインタフェースです.
このオブジェクトモデルは、ドキュメント内のすべての要素を定義し、これらの要素にアクセスする方法を提供します.
HTML DOM
HTML DOMは、HTMLドキュメントの処理およびアクセスのための標準的な方法を定義します.
すべてのHTML要素はHTML DOMでアクセスできます.
Webブラウザのレンダリング
レンダーエンジンは、要求されたコンテンツをブラウザ画面に表示する役割を果たします.HTML、CSS、JavaScriptなどのファイルをブラウザが画面に表示する形式に変換し、ピクセル単位で表示します.
ブラウザの表示と最適化
Ajax
同期/非同期
[서버 측 JS - 동기와 비동기 1 : 개요](https://www.youtube.com/watch?v=jjypeFGJC3c)代表的なフレームワークReact、Vue/Angular
SPAタイプは、最初にブラウザにページ全体をロードし、Ajaxのみで特定の部分にデータをバインドします.
既存vs SPA
5.参考資料
ドキュメントオブジェクトモデル(DOM)-Web API|MDN
Webサービスが必要！CDNって何?
Bootstrap
Free Bootstrap Themes & Templates
パブリックデータポータル
追加されたリファレンス
http://tcpschool.com/javascript/js_dom_concept
https://sjparkk-dev1og.tistory.com/27
Reference
この問題について(UMC 9週目), 我々は、より多くの情報をここで見つけました https://velog.io/@shwncho/UMC-9주차テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol