Leta Learns

B대면 노래방 | 211120 본문

HUFS/소프트웨어 공학

B대면 노래방 | 211120

leta 2021. 11. 20. 17:23

#lobby에서 room 만들고 해당 room 입장

room 만들 때 roomname을 지정해서 각각의 roomname마다 다른 방에 들어간다.

(room id보다 roomname으로 구분하는 게 수월할 것으로 판단됨)

/*lobby.js*/

import { useNavigate } from 'react-router-dom';

const navigate = useNavigate();
    const onEnter = roomname => {
    	navigate('/room', {replace:true, state: { nickname : {roomname}}})};

 

 

 

#room 화면에 방제 띄우기

{history.state.usr.nickname.username} //중괄호 중요!

{history.state[하고 그 뒤에 경로]} ...이런 식으로

 

 

 

 

#mui.com

부트스트랩 처럼 사용하기 좋은 사이트. UI 소스 제공

https://mui.com/

 

MUI: The React component library you always wanted

MUI provides a simple, customizable, and accessible library of React components. Follow your own design system, or start with Material Design. You will develop React applications faster.

mui.com

 

 

 

#git

hard reset / 변경사항 모두 제거 (변경 내역 삭제)

soft reset / staging 전 상태로 돌아감.. (변경 내역 남음)

 

 

 


 

 

 

room에서 방 나가기 버튼을 눌러 lobby로 돌아갈 때는 파라미터가 필요하다. (intro에서 lobby로 갈 때 이모티콘, 닉네임을 파라미터로 전달하기 때문)

이모티콘과 닉네임으로 유저 인스턴스를 생성하여 room에도 useNavigate를 해주어야 할 것으로 보인다.

 

 

CORS(cross origin resource sharing) (CSP와 유사)

room 화면에 유튜브 영상을 뜨게 하기 위해 CORS를 허용해주어야 한다.

현재 localhost:3030/~~~ 사용중. 그래서 여기에 있는 re

'HUFS > 소프트웨어 공학' 카테고리의 다른 글

B대면 노래방 | 211204  (0) 2021.12.07
B대면 노래방 | 211122, 211201  (0) 2021.12.04
B대면 노래방 | 211117  (0) 2021.11.18
B대면 노래방 | 211115  (0) 2021.11.15
B대면 노래방 | 211113  (0) 2021.11.13
Comments