운현 운현

https://www.youtube.com/watch?v=-xXASlyU0Ck&t=2007s를 보며 실습하며 정리하는 글 ---이어서 수정기능을 만들어준다. Shad cn에서 dialog를 검색하고 인스톨해준다.https://ui.shadcn.com/docs/components/dialog DialogA window overlaid on either the primary window or another dialog window, rendering the content underneath inert.ui.shadcn.comnpx shadcn-ui@latest add dialog 이걸 설치하고, 예시코드를 붙여넣어보면 label이 없다고 빨간줄이 그일텐데, label도 검색해서 install 해준다.http..

https://www.youtube.com/watch?v=-xXASlyU0Ck&t=2007s를 보며 실습하며 정리하는 글----- 저번시간에 Message Menu를 만든거에 이어서 Delete를 만들거다.먼저 ShadCN에 가서 Alert Dialog를 검색하고 인스톨해준다.https://ui.shadcn.com/docs/components/alert-dialog Alert DialogA modal dialog that interrupts the user with important content and expects a response.ui.shadcn.comnpx shadcn-ui@latest add alert-dialog 그리고 새로운 컴포넌트를 만들어줄거다.components/MessageActi..

https://www.acmicpc.net/problem/12919 백트래킹으로 풀었다.시간을 줄이기 위한 대 똥꼬쑈#include using namespace std;string s, t;bool flag = false;map mp;int tACnt;int tBCnt;int seqA;int seqB;int tmpSeqA;int tmpSeqB;int cntA(string str){ int cnt = 0; int tmp = 0; int tmp2 = 0; tmpSeqA = 0; tmpSeqB = 0; for (int i = 0; i t.size()) { return; } if (str == t) { flag = true; ..

https://www.youtube.com/watch?v=-xXASlyU0Ck&t=2007s를 보며 실습하며 정리하는 글---메세지를 수정하거나 삭제하는 등을 할 수 있게끔 해보자. 가장 먼저 수정/삭제등의 버튼이 있어야겠지.... 표시를 누르면 수정 삭제등의 버튼이 모달?로 나와서 수정 및 삭제할 수 있게해주는 걸 우선 만들어보자.shadCn에서 dropdown menu를 검색해 인스톨해준다.https://ui.shadcn.com/docs/components/dropdown-menu Dropdown MenuDisplays a menu to the user — such as a set of actions or functions — triggered by a button.ui.shadcn.comnpx sh..

https://www.youtube.com/watch?v=-xXASlyU0Ck&t=2007s를 보며 실습하는 영상 ---저번에 메세지를 데이터베이스에 저장하고 표시하는 것까지 해줬다. 아직 소켓통신을 하지 않기에 데이터를 인서트하고 새로고침을 하고 데이터를 다시 받아와야지 내가 입력한 메세지가 나온다.그런데, 이렇게 데이터를 입력하고 다시 받아오기까지 시간이 좀 걸리기에, 내가 이런 이런 입력을 하면 당연히 DB에 저장될 걸로 가정하고, 내 화면에 바로 입력값을 표시해주는 방법이 있다. optimistic update라고 하는데 https://react.dev/reference/react/useOptimistic useOptimistic – ReactThe library for web and native..

https://www.youtube.com/watch?v=-xXASlyU0Ck&t=2007s를 보며 실습하는 영상 ----- 이제 채팅들을 화면에서 보여주는 걸 만들건데, 우선 쉽게 관리하기 위해 컴포넌트 두개를 새로 만들어준다.components/ListMessages.tsxcomponents/ChatMessages.tsx그리고 이전에 app/page.tsx에서 채팅들을 표시주는 부분을 긁어와서 ListMessages.tsx 컴포넌트에 넣어주고, 이를 다시 ChatMessages.tsx 컴포넌트에서 가져온다. page.tsx에서는 이부분을 새로만든 컴포넌트로 대체해준다. // components/ListMessages.tsx"use client";import React from "react";const..

https://www.youtube.com/watch?v=-xXASlyU0Ck&t=2007s를 보며 따라하는 실습  ---저번시간에 이어서 메세지 만들기를 진행한다. components/ChatInput.tsx 파일을 만들어준다."use client";import React from "react";import { Input } from "./ui/input";export const ChatInput = () => { // 메세지 전송 펑션 const handleSendMessage = (text: string) => { alert(text); }; return ( { if (e.key === "Enter") { // enter 키를 누르면..

https://www.youtube.com/watch?v=-xXASlyU0Ck&t=2007s이 동영상을 보며 만드는 챗 웹 실습예제 다음으로 이어서 채팅 UI를 만든다.import ChatHeader from "@/components/ChatHeader";import { Button } from "@/components/ui/button";import InitUser from "@/lib/store/InitUser";import { createClient } from "@/utils/supabase/server"; // supabase 객체 불러오기. // 서버 컴포넌트니깐 서버에서 임포트해온다.import React from "react";const page = async () => { const s..