728x90 반응형 리액트31 20230821 실습내용 my-app.zip 파일은 리액트 실습내용이고, board.zip 파일은 스프링부트 실습내용입니다. 설치 및 실행 방법은 아래 문서를 참고하세요. 리액트 https://myanjini.tistory.com/entry/20230818-%EC%8B%A4%EC%8A%B5%EB%82%B4%EC%9A%A9-react 스프링부트 #1 다운로드 받은 파일을 압축해제합니다. #2 이클립스에 동일한 프로젝트가 등록되어 있는 경우 임포트할 수 없으므로 메모장으로 settings.gradle 파일을 열어 rootProject.name을 수정합니다. rootProject.name = 'board-20230821' #3 압축해제한 폴더를 지정해 Gradle Project를 임포트합니다. #4 application.propert.. 2023. 8. 21. 20230818 실습내용 - react 오늘까지 실습한 내용입니다. 참고하세요. #1 파일 다운로드 후 압축해제 합니다. #2 명령 프롬프트(cmd.exe)를 실행합니다. #3 #1에서 압축해제한 폴더로 이동해서 npm install 명령으로 의존모듈을 설치합니다. C:\Windows\System32> cd c:\temp\my-app c:\Temp\my-app> npm install #4 VSCode와 개발 서버를 실행합니다. c:\Temp\my-app> code . c:\Temp\my-app> npm start #5 실행을 확인합니다. 2023. 8. 18. 웹 소켓을 이용한 채팅 내용 저장 (React + SpringBoot + SockJS + STOMP + MySQL) 웹 소켓을 이용해서 채팅 기능을 구현합니다. 채팅 내용은 MySQL DB에 저장되며, 채팅에 참여하면 이전 대화 내용의 일부를 받아 출력해 줍니다. 프론트엔드 의존 모듈 설치 의존 모듈을 설치합니다. SockJS는 WebSocket과 유사한 객체를 제공하는 브라우저 JavaScript 라이브러리로, sockjs-client는 JavaScript 클라이언트 라이브러리입니다. stompjs 라이브러리는 WebSocket 클라이언트를 통해 STOMP 브로커에 연결하고 STOMP를 제공합니다. c:\board-react> npm install sockjs-client c:\board-react> npm install @stomp/stompjs websocket Chatting2.js SockJS와 Stomp를 .. 2023. 4. 26. 웹 소켓을 이용한 채팅 (React + SpringBoot) 웹 소켓을 이용한 채팅 기능을 구현합니다. 하나의 채팅방에서 사용자 이름(닉네임)으로 구분해서 대화를 주고 받도록 되어 있으며, 채팅방 생성 및 지정, 채팅 내용 저장 기능은 반영되어 있지 않습니다. React Chatting.js // 브라우저의 기본 스타일을 제거해 주는 node 패키지 import React, { useCallback, useRef, useState, useEffect } from 'react'; import './Chatting.css'; const Chatting = () => { // # --------------------------------------------------------- // # 상태 변수 정의 // # ------------------------------.. 2023. 4. 19. 이전 1 2 3 4 5 ··· 8 다음 728x90 반응형
