Skip to content

GitLab

Commit eda45ede authored by Soo Hyun Kim's avatar Soo Hyun Kim
Browse files

soo-01-12

parent b7f87260
Hide whitespace changes
Inline Side-by-side
client/package.json
View file @ eda45ede
...@@ -6,6 +6,7 @@ ...@@ -6,6 +6,7 @@
"@testing-library/jest-dom": "^5.11.6", "@testing-library/jest-dom": "^5.11.6",
"@testing-library/react": "^11.2.2", "@testing-library/react": "^11.2.2",
"@testing-library/user-event": "^12.6.0", "@testing-library/user-event": "^12.6.0",
"axios": "^0.21.1",
"bootstrap": "^4.5.3", "bootstrap": "^4.5.3",
"react": "^17.0.1", "react": "^17.0.1",
"react-bootstrap": "^1.4.0", "react-bootstrap": "^1.4.0",
......
client/src/Pages/HomePage.js
View file @ eda45ede
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { Row, Col, Modal, Button, Form } from 'react-bootstrap'; import axios from 'axios';
import { Row, Col, Modal, Button, Form, Alert } from 'react-bootstrap';
import Tabs from 'react-bootstrap/Tabs'; import Tabs from 'react-bootstrap/Tabs';
import Tab from 'react-bootstrap/Tab'; import Tab from 'react-bootstrap/Tab';
import ClosedList from '../Components/ClosedList'; import ClosedList from '../Components/ClosedList';
import OpenList from '../Components/OpenList'; import OpenList from '../Components/OpenList';
import Chat from '../Components/Chat'; import Chat from '../Components/Chat';
import Menu from '../Components/Menu'; import Menu from '../Components/Menu';
import catchErrors from '../utils/catchErrors';
// import styled from 'styled-components'; // import styled from 'styled-components';
// const List = styled.div` // const List = styled.div`
...@@ -22,9 +24,10 @@ function Home() { ...@@ -22,9 +24,10 @@ function Home() {
const [show, setShow] = useState(false); const [show, setShow] = useState(false);
const [show2, setShow2] = useState(false); const [show2, setShow2] = useState(false);
const [chat, setChat] = useState(false); const [chat, setChat] = useState(false);
const [checkedI, setCheckedI] = useState(false); // const [checkedI, setCheckedI] = useState(false);
const [chatR, setChatR] = useState(INIT_CHATR); const [chatR, setChatR] = useState(INIT_CHATR);
const [disabled, setDisabled] = useState(true); const [disabled, setDisabled] = useState(true);
const [error, setError] = useState('');
const handleClose = () => setShow(false); const handleClose = () => setShow(false);
const handleShow = () => setShow(true); const handleShow = () => setShow(true);
...@@ -39,24 +42,28 @@ function Home() { ...@@ -39,24 +42,28 @@ function Home() {
isChatR ? setDisabled(false) : setDisabled(true) isChatR ? setDisabled(false) : setDisabled(true)
}, [chatR]) }, [chatR])
function handleChange(event){ function handleChange(event) {
const {name, value} = event.target const { name, value } = event.target
setChatR({...chatR, [name]:value}) setChatR({ ...chatR, [name]: value })
console.log(chatR)
} }
async function handleSubmit(event){ async function handleSubmit(event) {
event.preventDefault() event.preventDefault()
const response = await fetch('chat/makeChat', { try {
method: 'POST', setError('')
headers: { // const response = await fetch('chat/makeChat', {
'Content-Type': 'application/json' // method: 'POST',
}, // headers: {
body: JSON.stringify(chatR) // 'Content-Type': 'application/json'
}) // },
const data = await response.json() // body: JSON.stringify(chatR)
console.log(data) // })
setChatR(INIT_CHATR) //const data = await response.json()
const response = await axios.post('chat/makeChat', chatR)
setChatR(INIT_CHATR)
} catch (error){
catchErrors(error, setError)
}
} }
return ( return (
...@@ -90,6 +97,9 @@ function Home() { ...@@ -90,6 +97,9 @@ function Home() {
<Modal.Header closeButton> <Modal.Header closeButton>
<Modal.Title>방 생성</Modal.Title> <Modal.Title>방 생성</Modal.Title>
</Modal.Header> </Modal.Header>
{error && <Alert variant='danger'>
{error}
</Alert>}
<Modal.Body> <Modal.Body>
<Form onSubmit={handleSubmit}> <Form onSubmit={handleSubmit}>
<Form.Group as={Row} controlId="chatName"> <Form.Group as={Row} controlId="chatName">
...@@ -119,7 +129,7 @@ function Home() { ...@@ -119,7 +129,7 @@ function Home() {
type="checkbox" type="checkbox"
checked={chatR.isOpen} checked={chatR.isOpen}
name='isOpen' name='isOpen'
onChange={() => setChatR({...chatR, isOpen: !chatR.isOpen})}/> onChange={() => setChatR({ ...chatR, isOpen: !chatR.isOpen })} />
</Col> </Col>
</Form.Group> </Form.Group>
{ {
...@@ -128,7 +138,6 @@ function Home() { ...@@ -128,7 +138,6 @@ function Home() {
: (<p><b>비밀방</b>으로 개설되며, 참여자들에게 코드를 공유해야합니다.</p>) : (<p><b>비밀방</b>으로 개설되며, 참여자들에게 코드를 공유해야합니다.</p>)
} }
<Form.Group as={Row}> <Form.Group as={Row}>
{console.log(chatR)}
<Col sm={{ span: 5, offset: 4 }}> <Col sm={{ span: 5, offset: 4 }}>
<Button type="submit" >방 생성</Button> <Button type="submit" >방 생성</Button>
</Col> </Col>
...@@ -138,25 +147,25 @@ function Home() { ...@@ -138,25 +147,25 @@ function Home() {
</Modal> </Modal>
<Modal show={show2} onHide={handleClose2}> <Modal show={show2} onHide={handleClose2}>
<Modal.Header closeButton> <Modal.Header closeButton>
<Modal.Title>참여 코드로 채팅 참가</Modal.Title> <Modal.Title>참여 코드로 채팅 참가</Modal.Title>
</Modal.Header> </Modal.Header>
<Modal.Body> <Modal.Body>
<Form onSubmit={() => { console.log('제출') }}> <Form onSubmit={() => { console.log('제출') }}>
<Form.Group as={Row} controlId="formCodeE"> <Form.Group as={Row} controlId="formCodeE">
<Form.Label column sm={4}>참여 코드</Form.Label> <Form.Label column sm={4}>참여 코드</Form.Label>
<Col> <Col>
<Form.Control type="text" /> <Form.Control type="text" />
</Col> </Col>
</Form.Group> </Form.Group>
<Form.Group as={Row}> <Form.Group as={Row}>
<Col sm={{ span: 5, offset: 4 }}> <Col sm={{ span: 5, offset: 4 }}>
<Button type="submit">참가</Button> <Button type="submit">참가</Button>
</Col> </Col>
</Form.Group> </Form.Group>
</Form> </Form>
</Modal.Body> </Modal.Body>
</Modal> </Modal>
</Col> </Col>
</Row> </Row>
</> </>
......
client/src/utils/catchErrors.js 0 → 100644
View file @ eda45ede
function catchErrors(error, displayError){
let errorMsg
if (error.response){
errorMsg = error.response.data
console.log(errorMsg)
} else if (error.request) {
errorMsg = error.request
console.log(errorMsg)
} else {
errorMsg = error.message
console.log(errorMsg)
}
displayError(errorMsg)
}
export default catchErrors
\ No newline at end of file
package.json
View file @ eda45ede
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
"type": "module", "type": "module",
"scripts": { "scripts": {
"test": "echo \"Error: no test specified\" && exit 1", "test": "echo \"Error: no test specified\" && exit 1",
"dev" : "nodemon server/server.js" "dev": "nodemon server/server.js"
}, },
"repository": { "repository": {
"type": "git", "type": "git",
...@@ -18,6 +18,7 @@ ...@@ -18,6 +18,7 @@
"dependencies": { "dependencies": {
"express": "^4.17.1", "express": "^4.17.1",
"mongoose": "^5.11.9", "mongoose": "^5.11.9",
"nanoid": "^3.1.20",
"nodemon": "^2.0.6", "nodemon": "^2.0.6",
"validator": "^13.5.2" "validator": "^13.5.2"
} }
......
server/controllers/chat.controller.js
View file @ eda45ede
import chat from "../models/chat.js" // import { useState } from 'react'
import Chat from "../models/Chat.js"
import { customAlphabet } from 'nanoid'
import isLength from 'validator/lib/isLength.js' import isLength from 'validator/lib/isLength.js'
const nanoid = customAlphabet('1234567890abcdef', 10)
const makeChat = async (req, res) => { const makeChat = async (req, res) => {
const {name, interest, isOpen} = req.body; const { name, interest, isOpen } = req.body;
// console.log('/bodyCheck', interest);
const roomId = nanoid()
const chat = await Chat.findOne({ roomId })
while (chat) {
roomId = nanoid()
chat = await Chat.findOne({ roomId })
}
try { try {
if (!isLength(name, { min: 3, max: 10 })) { if (!isLength(name, { min: 3, max: 20 })) {
return res.status(422).json({message: 'Name must be 3-10 characters'}) return res.status(422).send('채팅방의 이름은 3-20자여야 합니다.')
} else if (interest=='Choose...' || interest==''){
return res.status(422).send('분야를 반드시 선택하여야 합니다.')
} }
const newChat = await new chat({ const newChat = await new Chat({
roomId,
name, name,
interest, interest,
isOpen isOpen
...@@ -17,7 +31,7 @@ const makeChat = async (req, res) => { ...@@ -17,7 +31,7 @@ const makeChat = async (req, res) => {
res.json(newChat) res.json(newChat)
} catch (error) { } catch (error) {
console.log(error) console.log(error)
res.status(500).json({message: 'User signup error'}) res.status(500).send('방생성 에러')
} }
} }
......
server/models/chat.js
View file @ eda45ede
...@@ -3,6 +3,11 @@ import mongoose from 'mongoose' ...@@ -3,6 +3,11 @@ import mongoose from 'mongoose'
const {String} = mongoose.Schema.Types const {String} = mongoose.Schema.Types
const ChatSchema = new mongoose.Schema({ const ChatSchema = new mongoose.Schema({
roomId: {
type: String,
// default:() => nanoid(),
unique: true
},
name: { name: {
type: String, type: String,
required: true, required: true,
...@@ -20,4 +25,4 @@ const ChatSchema = new mongoose.Schema({ ...@@ -20,4 +25,4 @@ const ChatSchema = new mongoose.Schema({
timestamps: true timestamps: true
}) })
export default mongoose.models.chat || mongoose.model('chat', ChatSchema) export default mongoose.models.Chat || mongoose.model('Chat', ChatSchema)
\ No newline at end of file \ No newline at end of file
server/utils/catchErrors.js 0 → 100644
View file @ eda45ede
function catchErrors(error, displayError){
let errorMsg
if (error.response){
errorMsg = error.response.data
console.log(errorMsg)
} else if (error.request) {
errorMsg = error.request
console.log(errorMsg)
} else {
errorMsg = error.message
console.log(errorMsg)
}
displayError(errorMsg)
}
export default catchErrors
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment