Skip to content

GitLab

Commit 6e0a46de authored by seoyeon's avatar seoyeon
Browse files

Merge remote-tracking branch 'origin/master' into seoyeon2

parents 6ddc36e4 a4bff5ef
Hide whitespace changes
Inline Side-by-side
client/src/apis/endpoints.js deleted 100644 → 0
View file @ 6ddc36e4
const endpoints = {
API_BASE_URL: "https://localhost:8080/api",
HOME_API: "",
ROOM_API: "room",
PROFILE_API: "profile",
};
export default endpoints;
client/src/apis/profile.api.js
View file @ 6e0a46de
import axios from "axios";
const login = async (payload) => {
const { data } = await axios.post("/api/login", payload);
return data;
};
const signup = async (payload) => {
const { data } = await axios.post("/api/signup", payload);
return data;
};
const profileApi = { login, signup };
export default profileApi;
client/src/apis/room.api.js
View file @ 6e0a46de
import axios from "axios";
const login = async (payload) => {
const { data } = await axios.post("/api/login", payload);
return data;
};
const signup = async (payload) => {
const { data } = await axios.post("/api/signup", payload);
return data;
};
const roomApi = { login, signup };
export default roomApi;
client/src/apis/user.api.js
View file @ 6e0a46de
import axios from "axios"; import axios from "axios";
import endpoints from "./endpoints";
const login = async (email, password) => { const login = async (payload) => {
const payload = { email, password }; const { data } = await axios.post("/api/login", payload);
const { data } = await axios.post(`${endpoints.API_BASE_URL}/`, payload);
return data; return data;
}; };
......
client/src/components/Header.js
View file @ 6e0a46de
...@@ -7,7 +7,7 @@ const Header = () => { ...@@ -7,7 +7,7 @@ const Header = () => {
className="flex-column align-items-center justify-content-center p-2" className="flex-column align-items-center justify-content-center p-2"
> >
<div className="d-flex justify-content-center"> <div className="d-flex justify-content-center">
<Link to="/user"> <Link to="/">
<img src="/BORA.png" style={{ width: '160px' }} /> <img src="/BORA.png" style={{ width: '160px' }} />
</Link> </Link>
</div> </div>
......
client/src/components/Login.js
View file @ 6e0a46de
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import login from "../apis/user.api"; import { Redirect } from "react-router-dom";
import userApi from "../apis/user.api";
const INIT_USER = { const INIT_USER = {
email: "", email: "",
password: "", password: "",
...@@ -20,22 +21,25 @@ const Login = () => { ...@@ -20,22 +21,25 @@ const Login = () => {
function handleChange(event) { function handleChange(event) {
const { name, value } = event.target; const { name, value } = event.target;
setUser({ ...user, [name]: value }); setUser({ ...user, [name]: value });
console.log(user);
} }
async function handleSubmit() { async function handleSubmit(e) {
e.preventDefault();
try { try {
// setLoading(true); // setLoading(true);
// setError(""); // setError("");
const success = await login(user.email, user.password); const data = await userApi.login(user);
console.log(user); console.log(data);
setSuccess(success); setSuccess(true);
} catch (error) { } catch (error) {
// catchErrors(error, setError); // catchErrors(error, setError);
} finally { } finally {
// setLoading(false); // setLoading(false);
} }
} }
if (success) {
return <Redirect to="/user" />;
}
if (success) { if (success) {
alert('로그인 되었습니다') alert('로그인 되었습니다')
......
client/src/components/Room/ChannelList.js
View file @ 6e0a46de
...@@ -4,13 +4,6 @@ import LeftHamberger from './LeftHamberger'; ...@@ -4,13 +4,6 @@ import LeftHamberger from './LeftHamberger';
import RightHamberger from './RightHamberger'; import RightHamberger from './RightHamberger';
const ChannelList = () => { const ChannelList = () => {
const [admin, setAdmin] = useState('true')
// function copytoClipboard() {
// const [code, setCode] = useState()
// const roomcode = document.getElementById("textarea")
// alert("코드를 복사하였습니다.")
// }
return ( return (
<div> <div>
<nav className="navbar navbar-light d-flex justify-content-between"> <nav className="navbar navbar-light d-flex justify-content-between">
......
client/src/components/Room/LeftHamberger.js
View file @ 6e0a46de
import backward from '../../backward.png' import backward from "../../backward.png";
import ChannelSingle from './ChannelSingle' import ChannelSingle from "./ChannelSingle";
const LeftHamberger = () => { const LeftHamberger = () => {
function roomIdCopy() { function roomIdCopy() {
const t = document.querySelector('#roomId').innerText; const t = document.querySelector("#roomId").innerText;
console.log(t) console.log(t);
navigator.clipboard.writeText(t); navigator.clipboard.writeText(t);
document.execCommand('copy'); //document.execCommand("copy");
} }
return ( return (
<div> <div>
<div> <div>
<button <button
className="navbar-toggler" className="navbar-toggler"
type="button" type="button"
data-bs-toggle="offcanvas" data-bs-toggle="offcanvas"
data-bs-target="#left-hamburger" data-bs-target="#left-hamburger"
aria-controls="left-hamburger" aria-controls="left-hamburger"
aria-expanded="false" aria-expanded="false"
aria-label="Toggle navigation" aria-label="Toggle navigation"
style={{ border: '#f4c1f2' }} style={{ border: "#f4c1f2" }}
> >
<span className="navbar-toggler-icon"></span> <span className="navbar-toggler-icon"></span>
</button> </button>
</div>
<div
className="offcanvas offcanvas-start"
style={{ width: "330px" }}
tabIndex="-1"
id="left-hamburger"
aria-labelledby="hamburgerLabel"
>
<div className="offcanvas-header">
<p
className="col-6 offcanvas-title"
id="offcanvasExampleLabel"
style={{
fontWeight: "bold",
fontSize: "15px",
width: "150px",
color: "#000000",
}}
>
온/오프라인 사용자
</p>
<h6 className="mt-2" id="roomId">
{" "}
#ASV2AE985{" "}
</h6>
<button
type="button"
className="btn-close text-reset"
data-bs-dismiss="offcanvas"
aria-label="Close"
></button>
</div>
<div className="overflow-auto" style={{ height: "610px" }}>
<div className="mb-3">
<div className="m-3 p-1 row" style={{ backgroundColor: "#E0CEE8" }}>
<h5 className="col mt-2">온라인 사용자</h5>
</div> </div>
<ul className="mx-5" style={{ color: "#76D079" }}>
<li>
<p style={{ color: "black" }}>CHERRY</p>
</li>
<li>
<p style={{ color: "black" }}>JAEYEON</p>
</li>
<li>
<p style={{ color: "black" }}>SEOYEON</p>
</li>
<li>
<p style={{ color: "black" }}>JIWEON</p>
</li>
<li>
<p style={{ color: "black" }}>BYOUNGYUN</p>
</li>
</ul>
</div>
<div className="mb-3">
<div className="m-3 p-1 row" style={{ backgroundColor: "#E0CEE8" }}>
<h5 className="col mt-2">오프라인 사용자</h5>
</div>
<ul className="mx-5">
<li>CHERRY</li>
<li>JAEYEON</li>
<li>SEOYEON</li>
<li>JIWEON</li>
<li>BYOUNGYUN</li>
</ul>
</div>
</div>
<div>
<div className="d-flex flex-row-reverse">
<button
type="button"
className="m-3 rounded"
data-bs-toggle="modal"
data-bs-target="#exitRoom"
style={{
height: "30px",
fontWeight: "bold",
backgroundColor: "#E0CEE8",
color: "black",
border: "1px #D64D61",
}}
>
초대
</button>
<div <div
className="offcanvas offcanvas-start" className="modal fade"
style={{ width: '330px' }} id="exitRoom"
tabIndex="-1" tabIndex="-1"
id="left-hamburger" aria-labelledby="exitRoomLabel"
aria-labelledby="hamburgerLabel" aria-hidden="true"
> >
<div className="offcanvas-header"> <div className="modal-dialog">
<p <div className="modal-content">
className="col-6 offcanvas-title" <div className="modal-header">
id="offcanvasExampleLabel"
style={{
fontWeight: 'bold',
fontSize: '15px',
width: '150px',
color: '#000000',
}}
>
온/오프라인 사용자
</p>
<h6 className="mt-2" id="roomId" > #ASV2AE985 </h6>
<button <button
type="button" type="button"
className="btn-close text-reset" className="btn-close"
data-bs-dismiss="offcanvas" data-bs-dismiss="modal"
aria-label="Close" aria-label="Close"
></button> ></button>
</div> </div>
<div className="overflow-auto" style={{ height: '610px' }}> <div className="modal-body d-flex justify-content-center">
<div className="mb-3"> 어떤 방식으로 초대하시겠습니까?
<div className="m-3 p-1 row" style={{ backgroundColor: "#E0CEE8" }}> </div>
<h5 className="col mt-2">온라인 사용자</h5> <div className="row mb-3">
</div> <div className="d-flex justify-content-evenly">
<ul className="mx-5" style={{ marker: "#2e873a" }}> <button
<li className="marker: #2e873a" style={{ markerColor: "2px #2e873a" }}> type="submit"
CHERRY className="col-2 p-1 btn btn-primary"
</li> style={{ width: "120px" }}
<li> >
JAEYEON 카카오로 초대
</li> </button>
<li> <button
SEOYEON type="submit"
</li> className="col-2 p-1 btn btn-primary"
<li> data-bs-dismiss="modal"
JIWEON style={{ width: "120px" }}
</li> onClick={roomIdCopy}
<li> >
BYOUNGYUN 방 Id 복사
</li> </button>
</ul>
</div>
<div className="mb-3">
<div className="m-3 p-1 row" style={{ backgroundColor: "#E0CEE8" }}>
<h5 className="col mt-2">오프라인 사용자</h5>
</div>
<ul className="mx-5">
<li>
CHERRY
</li>
<li>
JAEYEON
</li>
<li>
SEOYEON
</li>
<li>
JIWEON
</li>
<li>
BYOUNGYUN
</li>
</ul>
</div>
</div>
<div>
<div className="d-flex flex-row-reverse">
<button
type="button"
className="m-3 rounded"
data-bs-toggle="modal"
data-bs-target="#exitRoom"
style={{
height: '30px',
fontWeight: 'bold',
backgroundColor: '#E0CEE8',
color: 'black',
border: '1px #D64D61',
}}
>
초대
</button>
<div
className="modal fade"
id="exitRoom"
tabIndex="-1"
aria-labelledby="exitRoomLabel"
aria-hidden="true"
>
<div className="modal-dialog">
<div className="modal-content">
<div className="modal-header">
<button
type="button"
className="btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div className="modal-body d-flex justify-content-center">
어떤 방식으로 초대하시겠습니까?
</div>
<div className="row mb-3">
<div className="d-flex justify-content-evenly">
<button
type="submit"
className="col-2 p-1 btn btn-primary"
style={{ width: "120px" }}
>
카카오로 초대
</button>
<button
type="submit"
className="col-2 p-1 btn btn-primary"
data-bs-dismiss="modal"
style={{ width: "120px" }}
onClick={roomIdCopy}
>
방 Id 복사
</button>
</div>
</div>
</div>
</div>
</div>
</div> </div>
</div>
</div> </div>
</div>
</div> </div>
</div > </div>
) </div>
} </div>
</div>
);
};
export default LeftHamberger export default LeftHamberger;
\ No newline at end of file
client/src/components/SignUp.js
View file @ 6e0a46de
import axios from "axios";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
const INIT_USER = { const INIT_USER = {
name: "", name: "",
idNumber1: "", idNumber1: "",
idNumber2: "", idNumber2: "",
id: "", email: "",
password: "", password: "",
checkpw: "", checkpw: "",
phone: "", phone: "",
...@@ -22,7 +23,7 @@ const Signup = () => { ...@@ -22,7 +23,7 @@ const Signup = () => {
user.name && user.name &&
user.idNumber1 && user.idNumber1 &&
user.idNumber2 && user.idNumber2 &&
user.id && user.email &&
user.password && user.password &&
user.checkpw user.checkpw
) )
...@@ -37,10 +38,11 @@ const Signup = () => { ...@@ -37,10 +38,11 @@ const Signup = () => {
async function handleSubmit() { async function handleSubmit() {
try { try {
const data = await axios.post("https://localhost:8080/api/room/1/1",user)
// setLoading(true); // setLoading(true);
// setError(""); // setError("");
// const success = await login(user.email, user.password); // const success = await login(user.email, user.password);
console.log(user); console.log(data);
setSuccess(success); setSuccess(success);
} catch (error) { } catch (error) {
// catchErrors(error, setError); // catchErrors(error, setError);
...@@ -118,9 +120,9 @@ const Signup = () => { ...@@ -118,9 +120,9 @@ const Signup = () => {
<label className="p-1">아이디</label> <label className="p-1">아이디</label>
<input <input
className="form-control" className="form-control"
id="id" id="text"
type="text" type="text"
name="id" name="email"
placeholder="아이디를 입력하세요" placeholder="아이디를 입력하세요"
value={id} value={id}
onChange={handleChange} onChange={handleChange}
......
controllers/room.controller.js
View file @ 6e0a46de
import { Room } from "../models/index.js"; import { Room } from "../models/index.js";
import config from "../config/app.config.js";
const login = async (req, res) => { const test = async (req, res) => {
try { try {
console.log("login= ", req.body); console.log("room= ", req.body);
res.json("안녕"); res.json("안녕");
} catch (error) { } catch (error) {
console.log(error); console.log(error);
...@@ -12,5 +11,5 @@ const login = async (req, res) => { ...@@ -12,5 +11,5 @@ const login = async (req, res) => {
}; };
export default { export default {
login, test,
}; };
controllers/user.controller.js
View file @ 6e0a46de
import { User } from "../models/index.js"; import { User } from "../models/index.js";
import jwt from "jsonwebtoken";
import config from "../config/app.config.js"; import config from "../config/app.config.js";
import isLength from 'validator/lib/isLength.js' import isLength from 'validator/lib/isLength.js'
import bcrypt from "bcryptjs"; import bcrypt from "bcryptjs";
const test = async (req, res) => {
try {
console.log(req);
res.json("안녕");
} catch (error) {
console.log(error);
return res.status(500).send("test 중 에러");
}
};
const login = async (req, res) => { const login = async (req, res) => {
try { try {
console.log("login= ", req.body); console.log("login= ", req.body);
const { email, password } = req.body; const { email, password } = req.body;
const user = await User.scope("password").findOne({ where: email }); const user = await User.findOne({ where: { email: email } });
if (!user) if (!user)
return res.status(422).send(`${email} 사용자가 존재하지 않습니다.`); return res.status(422).send(`${email} 사용자가 존재하지 않습니다.`);
...@@ -33,6 +44,7 @@ const login = async (req, res) => { ...@@ -33,6 +44,7 @@ const login = async (req, res) => {
const signup = async (req, res) => { const signup = async (req, res) => {
try { try {
<<<<<<< HEAD
console.log('signup= ', req.body); console.log('signup= ', req.body);
const { name, password, id } = req.body; const { name, password, id } = req.body;
if (!isLength(name, {min: 3, max: 10})) { if (!isLength(name, {min: 3, max: 10})) {
...@@ -59,7 +71,23 @@ const signup = async (req, res) => { ...@@ -59,7 +71,23 @@ const signup = async (req, res) => {
return res.status(500).send("회원가입 중 에러") return res.status(500).send("회원가입 중 에러")
} }
} }
=======
console.log("sign up= ", req.body);
const { id, name, email, password, gender, phone } = req.body;
const user = User.create({ id, name, email, password, gender, phone });
} catch (error) {
console.log(error);
return res.status(500).send("회원가입 중 에러");
}
};
>>>>>>> origin/master
export default { export default {
test,
login, login,
<<<<<<< HEAD
signup signup
=======
signup,
>>>>>>> origin/master
}; };
index.js
View file @ 6e0a46de
...@@ -14,13 +14,13 @@ sequelize ...@@ -14,13 +14,13 @@ sequelize
.sync({ force: true }) .sync({ force: true })
.then(async () => { .then(async () => {
console.log(" DB 연결 성공"); console.log(" DB 연결 성공");
// await User.create({ await User.create({
// id: 0, id: 9999,
// name: "admin", name: "admin",
// email: "admin", email: "admin",
// password: "admin!", password: "admin!",
// gender: 0, gender: 0,
// }); });
app.listen(appConfig.port, () => { app.listen(appConfig.port, () => {
console.log(`Server is running on port ${appConfig.port}`); console.log(`Server is running on port ${appConfig.port}`);
......
models/index.js
View file @ 6e0a46de
...@@ -16,4 +16,6 @@ const sequelize = new Sequelize( ...@@ -16,4 +16,6 @@ const sequelize = new Sequelize(
const User = UserModel(sequelize); const User = UserModel(sequelize);
const Room = RoomModel(sequelize); const Room = RoomModel(sequelize);
User.hasMany(Room);
export { sequelize, User, Room }; export { sequelize, User, Room };
routes/room.route.js
View file @ 6e0a46de
...@@ -3,6 +3,6 @@ import roomCrtl from "../controllers/room.controller.js"; ...@@ -3,6 +3,6 @@ import roomCrtl from "../controllers/room.controller.js";
const router = express.Router(); const router = express.Router();
router.route("/").get(roomCrtl.login); router.route("/").post(roomCrtl.test);
export default router; export default router;
routes/user.route.js
View file @ 6e0a46de
...@@ -3,7 +3,8 @@ import userCtrl from "../controllers/user.controller.js"; ...@@ -3,7 +3,8 @@ import userCtrl from "../controllers/user.controller.js";
const router = express.Router(); const router = express.Router();
router.route("/").post(userCtrl.login); router.route("/login").post(userCtrl.login);
router.route("/signup").post(userCtrl.signup);
router.route("/").post(userCtrl.signup); router.route("/").post(userCtrl.signup);
export default router; export default router;
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