My Proect (38) 썸네일형 리스트형 채팅 프로젝트 - 4 구현 및 영상 Front-endpage.tsx'use client';// 'use client' 지시어는 이 파일이 클라이언트 측에서 렌더링되고 실행되는 "클라이언트 컴포넌트"임을 Next.js에 알립니다.// useState, useEffect와 같은 React 훅을 사용하거나 브라우저 API와 상호작용하려면 이 지시어가 반드시 필요합니다.import { useEffect, useState } from "react";import { Box, Heading, VStack } from "@chakra-ui/react"; // UI 구성을 위한 Chakra UI 컴포넌트들import socket from "../lib/socket"; // 앞서 설정한 socket.io 클라이언트 인스턴스를 가져옵니다.import { Ch.. 채팅 프로젝트 - 3 API 명세서 작성 API 명세서를 작성하는 이유는?1. 프론트엔드와 백엔드 간 약속프론트는 이 API가 어떤 요청/응답을 주고 받는지 모르고는 화면을 만들 수 없습니다.백엔드도 프론트가 뭘 요청하는지 정확히 모르고 기능을 구현하면 동작이 어긋납니다.명세서를 통해 양측의 오해없이 명확한 계약을 맺습니다. 2. 개발 속도 향상백엔드 API가 아직 완성되지 않아도 프론트엔드는 명세서 기반으로 Mock 데이터를 만들어 개발할 수 있습니다.병렬 작업이 가능해지고, 의존성 병목을 줄입니다. 3. 테스트와 유지보수에 유리QA나 자동화 테스트 시 명세서 기준으로 정상/비정상 케이스를 명확히 정의할 수 있습니다.나중에 API를 수정할 때도 명세서를 보면 영향 범위를 바로 알 수 있습니다. 4. 문서화 & 인수인계다른 개발자나 외부 파트너.. 채팅 프로젝트 - 2 프로그램 설치 1. 시스템에 직접 설치하는 핵심 프로그램컴퓨터에 한 번만 설치하면 여러 프로젝트에서 계속 사용할 수 있는 필수 프로그램들입니다.프로그램설치 목적Node.jsReact와 Next.js는 JavaSrcript 기반 기술입니다. Node.js는 브라우저가 아닌 환경 (예: 개발용 컴퓨터)에서 JavaSrcript를 실행할 수 있게 해주는 자바스크립트 런타임입니다.Next.js 개발 서버를 실행하거나, 프로젝트를 빌드하는 등 모든 작업에 필수적입니다.npm 또는 yarnNode.js를 설치하면 기본적으로 npm(Node Package Manager)이 함께 설치됩니다. 이것들은 React, Next.js, Chakra UI 같은 라이브러리들을 프로젝트에 쉽게 추가, 관리, 삭제할 수 있게 해주는 패키지 매니.. 채팅 프로젝트 - 1 기획서 이 프로젝트는 VS CODE CURSOR AI에서 Next.js + Chakra UI + Socket.IO + FastAPI를 활용하여 제작하였습니다. ## 🗂️ 프로젝트 개요 | 항목 | 내용 | | ------------ | ----------------------------------------------------- | | 🎯 목표 | 로그인 없이 접속하면 랜덤 유저와 실시간 1:1 채팅 가능 | | ⏳ 기간 | 1일 (8시간 기준) .. Carblre - 중개폼 프로젝트 소스코드https://github.com/BHbae/Carblre.git GitHub - BHbae/CarblreContribute to BHbae/Carblre development by creating an account on GitHub.github.com 보고서 및 작업일지ERD SiteMap 이번 프로젝트를 하면서 느낀점공공데이터를 가지고 chart를 구현해 내는 과정에서 파싱이 잘못 되었다는 걸 알았다. 처음부터 다시하기에는 시간이 너무 많이 지나서 지금 할 수 있는 최선의 방법이 무엇인지를 생각했을 때 완료된 몇몇개의 데이터를 다른 시도에 넣었고, 차트도 하나하나 노가다로 집어 넣었다. 유기견 스윙 프로젝트 할 때도 비슷한 상황이 있었는데 같은 문제가 반복되서 차근차근 다시 해.. 15일차 - 메인 페이지 구현 및 차트 기능 구현 index.jsp 지역별 통계 .. 14일차 - 로그인, 회원가입 화면 구현 ▶ 일반로그인, 회원가입 선택 페이지, 회원가입 signin.jsp 일반 로그인 변호사 로그인 일반 로그인 로그인 변호사 로그인 .. 13일차 - 마이페이지 구현 (개인정보수정, 비밀변호 변경) myPage.jsp My Page 마이페이지 마이페이지 마이페이지 예.. 이전 1 2 3 4 5 다음
