Act99 기술블로그

이번에는 채팅기능을 구현하려고 한다. 처음에는 Nestjs 와 Graphql 을 이용해서 CRUD를 만들고 gql 태그를 이용해 Apollo Client로 쿼리를 보내주고 Mutation 을 보내주는 형태로 채팅을 구현하려고 했다. 하지만 보통 실시간 채팅 앱 구현은 Websocket을 이용한다고 해서 채팅구현 로직을 바꾸게 되었다. 두 가지 방법을 모두 써서 괜찮은 것으로 구현하려고 하는데, 첫 번째는 NestJS 자체의 WebSocket을 이용해 실시간 채팅을 구현하는 방법 두 번째는 GraphQL 과 WebSocket을 이용해 채팅을 구현하는 방법 이렇게 두 가지 방법을 사용하려고 한다. 먼저, NestJS의 WebSoketGateway 방법을 진행했다. 이 방법은 정말 간단하게 구현이 가능한데, ..

내가 가지고 오는 코인API 데이터에는 이평선에 대한 정보가 없다. 따라서 이평선을 구현하는 함수가 필요하다. Functions 폴더에 ave-cal.ts 파일을 만들어준다. (평균을 구하는 함수) 그리고 다음처럼 구현했다. const aveCal = (close: number[], length: number) => { const cloXArray: [number, number][] = []; const calClo20: number[] = []; for (let i = 0; i a + b) / length ); } for (let..

드디어 이사를 완료했다. Nextjs 로 이사하면서 router를 설정할 필요가 없다는 장점 외에는 아직 큰 장점을 못느끼고 있다. (이제 막 시작하는 단계라 그런 것 같다.) 이사하면서 node version을 v16 으로 해서 Apollo codegen이 작동하지 않았다. 그래서 결국 수작업으로 타입들을 만들어주었다. (추후 해결할 예정) 그리고 결과물은 잘 나오는 것을 확인할 수 있다. 이젠 채팅기능을 구현할 차례이다. 코인차트 볼린저밴드를 구현한 후 바로 진행할 것이다. 채팅기능은 Apollo Client 를 이용해 작업할 예정이다. 따라서 NestJs에서 미리 백엔드 작업을 해야겠다. https://github.com/act99/stock-chat GitHub - act99/stock-chat:..

React를 하면서 항상 Next.js 를 사용해보려고 생각만 했는데 이번에는 실제로 사용해보려고 한다. Next js의 장점은 1. 자동 라우팅 (아주 매력적이다. 편안...) 2. SSR 구현에 용이하며 덕분에 SEO 최적화가 가능하다. (이건 직접 체감하기에는 오래걸릴 것 같다.) https://nextjs.org/ Next.js by Vercel - The React Framework Production grade React applications that scale. The world’s leading companies use Next.js by Vercel to build static and dynamic websites and web applications. nextjs.org 그럼 바로 작..