웹 개발자

저번에 하던거 이어서 1. 실시간 채팅 내용을 db로 영구저장 2. 영구저장한 db를 통해 div를 생성해주고 다음에 class에 참여했을때도 채팅 기록이 남아있도록 div 영구생성 3. 사용자의 채팅이 상호간 구분이 가능하도록 디자인 을 하도록 하겠음 일단 실시간 채팅 내용을 db로 영구저장 하는건 기존의 댓글기능이랑 유사한듯 클라이언트에서 post 요청을 하고 서버에서 그 post 요청을 처리해주면 될듯 태그를 이용해서 채팅을 전송할때 /chat으로 post 요청을 하고 server 에서 처리해줌 router.post('/chat', async(req, res)=> { try{ await db.collection('chatting') .insertOne({ classId : req.body.class..

https://github.com/uijeongjin/blog GitHub - uijeongjin/blog: express + mongodb를 이용해서 블로그 만들어봤습니다. express + mongodb를 이용해서 블로그 만들어봤습니다. Contribute to uijeongjin/blog development by creating an account on GitHub. github.com 코드들은 깃헙에 올려뒀습니다.

먼저 실시간 채팅을 구현하기 위해서 websocket중 socket.io 를 사용할건데 일반 채팅과 실시간 채팅이 뭐가 다르냐면 일반 채팅의 경우 내가 채팅을 보내면 서버에서 작업을 완료하고 수신자가 채팅을 읽기 위해선 서버의 작업이 완료된 후 새로고침을 해서 요청을 받아야함 실시간 채팅의 경우 내가 채팅을 보내면 서버에서 websocket을 통해서 새로고침 없이, 즉시 작성한 채팅을 수신할 수 있음 먼저 클래스에 참여한 경우 room에 join 하도록 코드를 작성하면 될듯 그럴려면 class 생성시, 임의의 랜덤한 초대코드를 생성하고 Class 참가하기 버튼을 클릭하면 초대코드를 입력하는 부분을 생성하고 초대코드가 일치할경우 req.session.username을 해당하는 class의 document ..

지금 매일매일 조금씩이라도 개발을 하고 있는데 지금 상황이 매우 곤란하다. socket.io를 이용해서 실시간 채팅을 구현하는 중인데 전부 잘 코드를 작성한것 같은데 크롬과 엣지로 다른 아이디로 로그인해서 클래스에 참여한다음 채팅을 하면 본인의 채팅만 보이고, 다른사람에게 나의 채팅이 전송되지 않는다. room에 참여하는 로직도 정상적이고, 메시지를 전송하는 로직도 정상적이고, 전송받은 메시지를 div로 생성하는 로직또한 정상적인데 되질 않으니 미치겠다.. gpt 바드 등 아무리 물어봐도 해결되지 않는다, 이럴땐 어떻게 해야하는걸까.. 현타가 온다

머리가 많이 꼬여서 다시 기능개발 순서 정리하고 개발함 내가 참여한 클래스 목록을 보여주는 기능을 먼저 만들면 좋을것같음 1. 내가 만든 참여중인 CLASS 버튼 누르면 내가 참여중인 CLASS 보여주고 참여중인 CLASS 클릭하면 해당하는 CLASS의 상세페이지로 이동하도록 먼저 코드를 작성하면 이후 개발할때 직접 ULR 치고 들어가야하는 번거로움이 없을듯. nav.ejs 에서 태그로 링크 걸어주고 태그로 get요청 받은후 class.js에서 get요청을 처리해주면 될듯 이후 classList.ejs 페이지를 하나 만들고, 그 페이지로 render 시켜주고 현재 참여중인 클래스 목록을 보여주면 될거같은데 일단 여기서 고생좀 했음 왜냐 클래스에 대한 정보를 db에 저장할때 class에 참여한 유저들을 배..

그전에, 회원기능을 먼저 만들어둬야 class 생성 , 참가 기능을 만들때 참여하는 사용자들의 정보를 제어하기 편할것 같아서 회원기능을 먼저 만들건데 기존에 blog 프로젝트 할때 만들었던 회원기능이 있어서 그대로 사용합니다. express-session 이용하는 세션 방식이고, 암호화는 bcrypt 이용해서 암호 저장하는 방식입니다. class 기능을 만들려고 하는데 node.js 의 라이브러리에 socket.io라고 실시간 통신을 도와주는 라이브러리를 이용할 겁니다. 같은 class 구성원끼리 실시간 채팅 기능먼저 만들고, 나머지 기능을 추가해 나가면 될듯합니다. 기능 설명먼저 하면 1. class 생성 버튼을 클릭하면 get요청해서 class 생성 페이지에 이동하고 2. class 생성 페이지에 작..

기본적인 개발 세팅하기 npm 패키지 이용해서 express, nodemon, ejs, mongodb, dotenv 등등 설치해주고 세팅함 저번 블로그 개발할때 사용했던 server.js 틀 그대로 가져다 사용해도 무방할듯 //dotenv 설정 require('dotenv').config(); const express = require('express'); const bcrypt = require('bcrypt'); const session = require('express-session'); const { MongoClient, ObjectId } = require('mongodb'); const app = express(); // bodyparser 설정 app.use(express.urlencode..

첫 프로젝트 끝났네요. 일단 기쁩니다. 어떤 기술을 배워도, 직접 만들어 본적이 없었는데 이번에 직접 만들어 보면서 개발 이라는게 무엇인지 생각해 볼 수 있던것 같아요 개발 포스팅 둘다 처음이라 많이 서툴렀지만 조금이라도, 꾸준히 개발하고 꾸준하게 기록하는데 초점을 맞추려 했습니다. 취업을 위해 만들어 보려고 했던건데 이러한 명확한 목적이 없는 프로젝트는 그렇게 매력적이지는 않은것 같아요. 성능을 개선하고, 여러가지 기능들을 개선해볼까 생각해봤는데 만들려했던 서비스가 아니라, 직전에 express + mongodb 기능설명을 들으면서 forum을 만들었는데, 활용한 기술들중 간단한 것들을 이용해서 직접 어떤 프로젝트를 만들어보려는게 목적이였습니다. 그래서 블로그 프로젝트는 여기서 마무리 하려고 합니다. ..

검색기능 만들기전에 저번에 댓글기능을 만들었는데 게시글을 삭제하면, 댓글도 보이지는 않지만 comment collection에 그대로 남아있을것 같습니다. 그래서 게시글을 삭제할 경우, 댓글도 삭제되도록 기능 수정을 좀 했습니다. 댓글 작성할때 comment 컬렉션에 postId : req.params.id 저장해뒀기 때문에 글 삭제할때 deleteMany()를 이용해서 postId : req.params.id 인 comment들 전부 삭제해주면 게시글을 삭제할때 댓글도 삭제될것 같네요 await db.collection('comment').deleteMany({ postId : req.params.id }); /delete/:id 요청에서 이거 하나 추가해주면 끝인듯 합니다. 이제 검색기능을 만들어 볼..

댓글 기능을 만들어 보겠습니다. 댓글 기능을 말로 설명하면 1. 글의 상세페이지에 댓글을 작성할 공간, 보여줄 공간을 만들기 2. 작성할 공간에서 작성버튼을 누르면 서버로 데이터를 보내기 3. 서버에서 받은 데이터를 검증한 후 db에 저장하기 4. 서버에서 db에서 저장한 데이터를 가져와서 html을 생성해준다. 이렇게 4단계를 순서대로 만들면 될것 같습니다. 1. 먼저 댓글을 작성할 폼을 만들어 줍니다. 이렇게 input 하나 button 하나 구성하고, 폼태그로 감싸서 post 요청 해주면 될듯 댓글 보여줄 공간 댓글 작성 이제 댓글작성 버튼을 클리갛면 /comment 로 post 요청을 해줄듯합니다. 이제 insertOne() 함수를 이용해서 저장해주면 되겠네요 comment 컬렉션의 documne..