# chat
chat.tsx
채팅부분을 꾸며본다pages/chats/index.tsx 와 pages/chats/id.tsx 두 개의 file로 구성됨.import { NextPage } from 'next'import Link from 'next/link'import Layout from '.
Room.js(1)
대화방을 클릭 했을때, 대화 내용이 뿌려지는 방역시, 코딩에 있어서 가장 어려운 부분임.cache와 scriptions가 같이 들어가기 때문에 집중!!집중!! 반복!!반복!!이 필요한 부분.!!!persistCache 부분은 주석처리한다.꼭 필요한 부분도 아니고, su
Subscription(4)_playground
playGround에서 subscribe를 어떻게 실행시키는지를 다룸.playGround에서 connection setting(회색바탕의 기계아이콘) 들어가서,Subscriptions의 주소(ws://localhost:4000/graphql)확인하고,Implementa
33.Subscription(1)_server.js
backend에서 가장 어려운 부분, 중요한 부분, update가 자주 일어나는 부분.고래도 할 수 있다!!!!! 항상, 공식문서를 참고할것.!!! https://www.apollographql.com/docs/apollo-server/data/subscrip
29. Message( model, typeDefs)
backend에서 가장 어려운 부분이니 집중 또 집중, 복습 또 복습 하자이렇게 통으로 올리는 이유는 model들 간의 relation을 확인하라고~schema.prisma와 비교해 가면서 Message와 Room 확인바람.computed Filed를 미이 만들어 놓은
🌈현직자와 커피챗
평소 취업 준비를 하면서 너무 위축되고 걱정이 많았다...😂 누군가의 조언이 절실했당... 그러던 와중 정말 큰 용기를 내서 트위터에서 활발히 활동하시고 계신 FE개발자님께 메시지를 보냈다!! 내향인의 엄청난 용기.. 커피챗을 요청드렸고, 너무 감사하게도 흔쾌히 허락
.png)
웹 소켓으로 익명 채팅 만들기(GIF파일 전송 가능)
1. 뼈대 구축하기(npm, DB, 추가html/css), 2. main 화면 구현하기, 3. 채팅방 생성 구현하기, 4. 일반 채팅 구현하기, 5. GIF 파일 전송하기
Nakama Server
Nakama는 소셜과 실시간 게임을 위한 확장이 가능한 서버입니다. 유저인증, 소셜기능, 데이터 저장, 실시간 패킷 통신이 가능합니다.
[채팅 프로그램] Socket 활용한 간단한 콘솔 채팅 프로그램
콘솔 채팅 구현 (서버와 클라이언트)종료되지 않으면 답이 올때까지 무한 대기이는 추후 GUI를 활용한 채팅 프로그램 만들어 볼 예정"종료" 라는 단어가 들어간 문장 전송 시 서버-클라이언트 간의 대화 연결 종료socket 활용무한 대기가 필요하다GUI를 활용하면 이 문
Socket.IO
Socket.IO를 이용한 실시간 웹 서비스socket.io 서버 생성var Server = require('socket.io');var io = new Server(httpServer축약 형태var io = require('socket.io')(server);연결 e
시작부터 2주까지
코드스테이츠 부트캠프에 들어온지 어느덧 2주가 흘렀다.불안과 설렘이 반씩 섞인 시작이였다. 낯선 환경과 미래에 대한 걱정이 내게 불안감을 일으켰고, 새로운 환경과 기대감에 가득찬 미래상이 설레게 했다. 그런 마음을 안고 첫날을 시작했다.전에 python으로 인공지능사관
첫 개발 시작부터 지금까지
내가 Github에 처음 잔디를 심었을때가 2019년 11월 26일이였다. 현 포스팅을 하는 시점이 2020년 2월 6일이니 어느덧 73일이나 지난 셈이다. 첫 시작은 막연한 도피와 새로운 시작 사이의 어느 중간지점이였다. 의미없는 공무원책을 붙잡고 끝없는 자기붕괴와 자기비하속에서 해무속을 항해하는 기분이였다. 처음 지인의 도움으로 cmd창을 켜서 cl...
TIL. 04 HTML - 실습(동영상, 댓글, 채팅)
동영상 삽입 `` Inline Frame의 약자로 웹 브라우저 내에 또 다른 프레임, 즉 다른 HTML 페이지를 삽입할 수 있도록 해준다.(유튜브 동영상, 지도 등) allowfullscreen 전체화면 속성 동영상 삽입 결과 댓글 기능 >DISQUS 서비스를 활
[Surfers] 화면 - Room & Chat
"서퍼 모집하기"에서 방을 만들었거나 "서핑 참여하기"에서 방을 선택한 경우 또는 "나의 방 목록"에서 참여한 방 중 하나를 선택하면 해당 Room페이지가 렌더된다.Room화면 렌더 시 ComponentDidMount로 유저토큰과 해당 Room의 id을 사용해 serv