이것저것

node는 서버가 아니라 javascript 실행기이다. 브라우저도 마찬가지 typescript의 실행기는 deno이다. deno는 아직 개발중 typescript는 개발이 라이브러리로 실행됨 지금은 node가 필요하다. node도 어느정도 할줄 알아야한다. 브라우저에서 실행안됨 ` 빽팁 ~ 틸드 외어두면 좋다. vscode 설치 node 설치 git 설치 npm i typescript로 설치한다. npm i -g typescript -g를 붙히면 typescript를 명령어로 쓸수있다. 파워쉘에서 typescript를 치면 에러가 난다. ctrl+shift+p를 누르고 (안되면 f1) select default 치면 터미널 기본값 설정이 나온다. git을 설치했으면 git bash가 뜰것이다. git ..

client-io 선언 위치 해결법 : 아래와 같이 컴포넌트의 밖에 선언을 해준 뒤 사용해주면 되는 거였다. import React, { useEffect, useState } from 'react'; import io from "socket.io-client" let server = "http://localhost:3002/api" let socket = io(server); const Chat = () => { ... 이제 이 부분은 해결되었으니 이벤트를 만들고 받아오는걸 해보자 현재 이벤트를 보내고 받는 부분이 안되고 있다. 해결 : socket.io에서 주소를 /api 를 붙여서 보냈기 때문이다. (이유는 모름 하면서 잡을 것) 그냥 emit은 나를 포함한 대상에게 메시지를 보내고, broadca..

로그인 페이지 만들기 우선랜딩페이지 css작업을 했고, 로그인페이지 css작업을 했다. 로그인페이지에 form>input*2+br+button 을 만들어주고, 이메일과 비밀번호 입력받도록 해준뒤 핸들러를 연결해주었다. LoginPage.js(axios완성안됨) const LoginPage = () => { const [ Email, setEmail ] = useState(""); const [ Password, setPassword ] = useState(""); function onEmailHandler(event) { setEmail(event.target.value) } function onPasswordHandler(event) { setPassword(event.target.value) } fu..

요즘엔 이런 CSS 프레임워크를 많이 사용한다 Material UI / React Bootstrap / Semantic UI / Ant Design / Materialize 를 리액트에서 많이 쓴다. https://ant.design/ client로 가서 설치 npm install antd --save 클라이언트의 index.js에 다음 코드로 import import 'antd/dist/antd.css'; Redux 리덕스가 없으면, 데이터가 여기저기서 참조하게 되므로, 복잡해지기 쉽다. 리덕스는 store에서 쏴주므로, 훨씬 데이터 state관리가 용이해진다 다운받아야 할 dependency 목록 : redux / react-redux / redux-thunk / redux-promise 이 중 th..