WebSocket으로 채팅창 만들기를 시도 구글링해서 가져온 웹소켓 코드를 일단 실험.  다른 사람의 코드를 git clone으로 가져온 거라 그룹 실시간 채팅의 역할을 하기 위해서는 더 다듬어야할 필요가 있음. 또한 이 코드는 단순 스프링부트 + html + JS로 만들어진 것이기에 리액트와 DB에 어떻게 연결할지 생각해볼 필요가 있다. 일단 뼈대가 된 코드를 구했다는 사실에 만족하며 오늘은 여기까지.

인터프리터 언어 : 파이썬, JS 처럼 컴퓨터가 실시간으로 컴퓨터 언어로 변환하는 언어. 파일이 1개. 비교적 느림컴파일러 언어 : 자바, C계열언어 처럼 컴퓨터가 스스로 변환 파일을 만드는 언어. 파일이 2개. 비교적 빠름 자바의 특징1. 플랫폼 독립적2. 객체 지향적3. 멀티스레드 지원4. 자동으로 메모리 관리 JDK, JRE, JVM의 차이점JDK : 자바개발키트JRE : 자바 실행환경JVM : 자바 가상머신JDK는 JRE와 자바 개발도구를 포함, JRE는 JVM과 라이브러리를 포함 객체지향 프로그래밍의 4가지 특징1.캡슐화2. 상속3. 다형성4. 추상황 예외와 오류의 차이점예외는 프로그램이 스스로 제어할 수 있는 문제오류는 시스템 레벨의 문제로 프로그램이 스스로 제어할 수 없음 오버로딩과 오버라이..

이제 리액트 파트 UserForm.js : 유저를 등록하는 폼 생성import React, { useState } from "react";const UserForm = ({addUser}) => { const [name, setName] = useState(''); const [email, setEmail] = useState(''); const handleSubmit = (e) => { e.preventDefault(); // 무지성 제출 방지 addUser({name, email}); setName(''); setEmail(''); } return( ..

간단하게 테스트 해보기. mysqlCREATE TABLE IF NOT EXISTS user ( id INT AUTO_INCREMENT PRIMARY KEY, name VARCHAR(255) NOT NULL, email VARCHAR(255) NOT NULL UNIQUE);  UserMapper.xml select * from user insert into user(name, email) values(#{name}, #{email}) delete from user where id = #{id} update user set where name = #{name}, email = #{email} where id = #{id}  service, mapper는 생략 UserCo..

오늘은 간단하게 스트리밍 시작 / 종료 처럼 보이게 만들기 import React, { useRef, useEffect, useState } from 'react';import '../css/WebCam.css';const Webcam = () => { const videoRef = useRef(null); const [webCamView, setWebCamView] = useState(false); const getCamera = () => { navigator.mediaDevices.getUserMedia({ video: true }) .then((stream) => { let video = v..

웹캠과 리액트를 연결하는 것이 오늘의 목표 구글링을 통해 웹캠과 리액트를 연결할 수 있는 코드를 발견import React, { useRef, useEffect } from 'react';const Webcam = () => { const videoRef = useRef(null); const getCamera = () => { navigator.mediaDevices.getUserMedia({ video:true }) .then((stream) => { let video = videoRef.current; video.srcObject = stream; video...