오인제 / Tunnel

Go to a project
Toggle navigation Toggle navigation pinning
정의왕
5e1e9aff 2 parents 0988447e b99fd765

fix file_client

Inline Side-by-side
Showing 20 changed files with 358 additions and 100 deletions
tunnel_BE/server/node_modules
<<<<<<< HEAD
# Created by https://www.toptal.com/developers/gitignore/api/visualstudiocode
# Edit at https://www.toptal.com/developers/gitignore?templates=visualstudiocode
=======
# dependencies
tunnel_BE/server/node_modules
/.pnp
.pnp.js
>>>>>>> board
### VisualStudioCode ###
.vscode/*
......
# Default ignored files
/shelf/
/workspace.xml
# Editor-based HTTP Client requests
/httpRequests/
<?xml version="1.0" encoding="UTF-8"?>
<module type="WEB_MODULE" version="4">
<component name="NewModuleRootManager">
<content url="file://$MODULE_DIR$">
<excludeFolder url="file://$MODULE_DIR$/temp" />
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
<excludeFolder url="file://$MODULE_DIR$/tmp" />
</content>
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
</component>
</module>
\ No newline at end of file
<component name="InspectionProjectProfileManager">
<profile version="1.0">
<option name="myName" value="Project Default" />
<inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
</profile>
</component>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectModuleManager">
<modules>
<module fileurl="file://$PROJECT_DIR$/.idea/OSSW.iml" filepath="$PROJECT_DIR$/.idea/OSSW.iml" />
</modules>
</component>
</project>
\ No newline at end of file
......@@ -5,6 +5,7 @@ const auth = require("../obj/authorize");
const {User}=require('../models');
//로그아웃
router.post('/',(req,res)=>{
req.session.id = null;
......@@ -15,6 +16,4 @@ router.post('/',(req,res)=>{
console.log("Logout");
res.sendStatus(200);
})
module.exports = router;
\ No newline at end of file
module.exports = router;
\ No newline at end of file
......
......@@ -2,37 +2,12 @@ const express = require("express");
const bodyParser = require("body-parser");
const router = express.Router();
/////////////
const {User}=require('../models');
//////////
router.get('/',(req,res)=>{
res.send('회원가입 페이지');
});
//회원가입
router.post('/',(req,res)=>{
User.findOne({
where:{name: req.body.Id}
})
.then((result)=>{
//id가 중복되지 않는 경우
if(result === null || result === undefined){
User.create({
name: req.body.Id,
pw:req.body.Password,
personality:req.body.Personality,
status:false
})
console.log(req.body);
return res.sendStatus(200);
}
//id중복
else{
console.log("중복된 id");
return res.sendStatus(401);
}
})
return res.status(201).json({success: true})
});
//라우트 매개변수사용
......@@ -41,4 +16,7 @@ router.get("/:id",(req,res)=>{
console.log(req.params, req.query);
req.body;
});
module.exports = router;
\ No newline at end of file
......
......@@ -13,11 +13,14 @@ dotenv.config();
const indexRouter = require('./routes/index.js');
const loginRouter = require('./routes/login.js');
const registerRouter = require('./routes/register.js');
<<<<<<< HEAD
const mainRouter = require('./routes/main.js');
const logoutRouter = require('./routes/logout.js');
const authRouter = require('./routes/auth.js');
const userRouter = require('./routes/user.js');
const postRouter = require('./routes/post.js');
=======
>>>>>>> board
const app = express();
app.set('port', process.env.PORT || 3001);
......@@ -36,6 +39,10 @@ sequelize.sync({force: false})
app.use(morgan('dev'));
app.use(express.json()); //json형식으로 데이터 전달
app.use(express.urlencoded({extende: false})); // url형식으로 형식으로 데이터 전달
<<<<<<< HEAD
=======
//app.use(bodyParser().json);
>>>>>>> board
app.use(cookieParser(process.env.COOKIE_SECRET));
app.use(session({
resave: false,
......@@ -58,6 +65,11 @@ app.use('/api/logout',logoutRouter);//로그아웃
app.use('/api/user',userRouter);//유저정보 응답
app.use('/api/post',postRouter);//유저정보 응답
<<<<<<< HEAD
=======
//app.use('/',loginRouter); //로그인 페이지
app.use('/api/register',registerRouter); // 회원가입 페이지
>>>>>>> board
//에러처리 미들웨어
......@@ -65,7 +77,6 @@ app.use('/api/post',postRouter);//유저정보 응답
app.use((req,res,next)=>{
console.log("유저가 존재하지 않은 경로 접근");
res.status(404).send("NOT FOUND");
});
//포트를 연다.
......
......@@ -10924,6 +10924,67 @@
}
}
},
"node-html-parser": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/node-html-parser/-/node-html-parser-5.1.0.tgz",
"integrity": "sha512-l6C1Gf1o7YuxeMGa17PypEez/rj+ii3q4/NZG37nRmWSLDjHyB0WNrlE4h2UW92D0JSfUSfu+lOvxThttVe7Jw==",
"requires": {
"css-select": "^4.1.3",
"he": "1.2.0"
},
"dependencies": {
"css-select": {
"version": "4.1.3",
"resolved": "https://registry.npmjs.org/css-select/-/css-select-4.1.3.tgz",
"integrity": "sha512-gT3wBNd9Nj49rAbmtFHj1cljIAOLYSX1nZ8CB7TBO3INYckygm5B7LISU/szY//YmdiSLbJvDLOx9VnMVpMBxA==",
"requires": {
"boolbase": "^1.0.0",
"css-what": "^5.0.0",
"domhandler": "^4.2.0",
"domutils": "^2.6.0",
"nth-check": "^2.0.0"
}
},
"css-what": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/css-what/-/css-what-5.1.0.tgz",
"integrity": "sha512-arSMRWIIFY0hV8pIxZMEfmMI47Wj3R/aWpZDDxWYCPEiOMv6tfOrnpDtgxBYPEQD4V0Y/958+1TdC3iWTFcUPw=="
},
"dom-serializer": {
"version": "1.3.2",
"resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.3.2.tgz",
"integrity": "sha512-5c54Bk5Dw4qAxNOI1pFEizPSjVsx5+bpJKmL2kPn8JhBUq2q09tTCa3mjijun2NfK78NMouDYNMBkOrPZiS+ig==",
"requires": {
"domelementtype": "^2.0.1",
"domhandler": "^4.2.0",
"entities": "^2.0.0"
}
},
"domelementtype": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.2.0.tgz",
"integrity": "sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A=="
},
"domutils": {
"version": "2.8.0",
"resolved": "https://registry.npmjs.org/domutils/-/domutils-2.8.0.tgz",
"integrity": "sha512-w96Cjofp72M5IIhpjgobBimYEfoPjx1Vx0BSX9P30WBdZW2WIKU0T1Bd0kz2eNZ9ikjKgHbEyKx8BB6H1L3h3A==",
"requires": {
"dom-serializer": "^1.0.1",
"domelementtype": "^2.2.0",
"domhandler": "^4.2.0"
}
},
"nth-check": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.0.1.tgz",
"integrity": "sha512-it1vE95zF6dTT9lBsYbxvqh0Soy4SPowchj0UBGj/V6cTPnXXtQOPUbhZ6CmGzAD/rW22LQK6E96pcdJXk4A4w==",
"requires": {
"boolbase": "^1.0.0"
}
}
}
},
"node-int64": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/node-int64/-/node-int64-0.4.0.tgz",
......@@ -13193,6 +13254,52 @@
"resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.0.tgz",
"integrity": "sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA=="
},
"react-html-parser": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/react-html-parser/-/react-html-parser-2.0.2.tgz",
"integrity": "sha512-XeerLwCVjTs3njZcgCOeDUqLgNIt/t+6Jgi5/qPsO/krUWl76kWKXMeVs2LhY2gwM6X378DkhLjur0zUQdpz0g==",
"requires": {
"htmlparser2": "^3.9.0"
},
"dependencies": {
"domhandler": {
"version": "2.4.2",
"resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.2.tgz",
"integrity": "sha512-JiK04h0Ht5u/80fdLMCEmV4zkNh2BcoMFBmZ/91WtYZ8qVXSKjiw7fXMgFPnHcSZgOo3XdinHvmnDUeMf5R4wA==",
"requires": {
"domelementtype": "1"
}
},
"entities": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/entities/-/entities-1.1.2.tgz",
"integrity": "sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w=="
},
"htmlparser2": {
"version": "3.10.1",
"resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.10.1.tgz",
"integrity": "sha512-IgieNijUMbkDovyoKObU1DUhm1iwNYE/fuifEoEHfd1oZKZDaONBSkal7Y01shxsM49R4XaMdGez3WnF9UfiCQ==",
"requires": {
"domelementtype": "^1.3.1",
"domhandler": "^2.3.0",
"domutils": "^1.5.1",
"entities": "^1.1.1",
"inherits": "^2.0.1",
"readable-stream": "^3.1.1"
}
},
"readable-stream": {
"version": "3.6.0",
"resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz",
"integrity": "sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==",
"requires": {
"inherits": "^2.0.3",
"string_decoder": "^1.1.1",
"util-deprecate": "^1.0.1"
}
}
}
},
"react-is": {
"version": "16.13.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
......
......@@ -10,9 +10,11 @@
"@testing-library/user-event": "^12.8.3",
"axios": "^0.24.0",
"http-proxy-middleware": "^2.0.1",
"node-html-parser": "^5.1.0",
"node-sass": "^6.0.1",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-html-parser": "^2.0.2",
"react-redux": "^7.2.6",
"react-router-dom": "^6.0.2",
"react-scripts": "4.0.3",
......@@ -47,5 +49,6 @@
"last 1 firefox version",
"last 1 safari version"
]
}
},
"proxy": "http://localhost:3001"
}
......
<<<<<<< HEAD
import React, {useState} from 'react';
import '../style/Board.scss'
import {CKEditor} from "@ckeditor/ckeditor5-react";
......@@ -24,10 +25,30 @@ function Board() {
<div className="contents-container">
{viewContent.map(element =>
<div>
=======
import React, { useState} from 'react';
import '../style/Board.scss'
import ReactHtmlParser from 'react-html-parser';
import BoardModal from "../Modal/BoardModal";
function Board() {
const [viewContent,setViewContent] = useState([]);
const onViewContentHandler = (data) => {
setViewContent((viewContent.concat({...data})))
}
return (
<div className="Board">
<div className="write-button">
<BoardModal onViewContentHandler={onViewContentHandler}/>
</div>
{viewContent.map(element =>
<div class="ui segment">
>>>>>>> board
<h2>{element.title}</h2>
<div>
{ReactHtmlParser(element.content)}
</div>
<<<<<<< HEAD
</div>)
}
</div>
......@@ -75,6 +96,10 @@ function Board() {
</Button>
</div>
</div>
=======
</div>
)}
>>>>>>> board
</div>
);
......
......@@ -3,8 +3,13 @@ import "../style/LoginPage.scss";
import Axios from 'axios'
import { Icon, Input } from "semantic-ui-react"
import { useNavigate } from "react-router-dom";
<<<<<<< HEAD
function LoginPage() {
let navigate = useNavigate();
=======
function LoginPage(props) {
const navigate = useNavigate();
>>>>>>> board
const [Id, setId] = useState("");
const [Password, setPassword] = useState("");
const onIdHandler = (event) => {
......@@ -17,6 +22,7 @@ function LoginPage() {
event.preventDefault();
console.log("ID", Id);
console.log("Password", Password);
<<<<<<< HEAD
Axios.post('/api/login',{
Id,
Password,
......@@ -34,6 +40,9 @@ function LoginPage() {
alert("잘못된 비밀번호입니다.")
}
})
=======
>>>>>>> board
};
const goToRegister = () => {
navigate('/register');
......
......@@ -2,8 +2,8 @@ import {Button} from "semantic-ui-react"
import Axios from'axios'
import "../style/MainPage.scss";
import { useNavigate } from "react-router-dom";
import { CKEditor } from '@ckeditor/ckeditor5-react';
import ClassicEditor from '@ckeditor/ckeditor5-build-classic';
import Board from "../Board/Board"
import React from "react";
function MainPage(props) {
const navigate = useNavigate();
......@@ -20,7 +20,7 @@ function MainPage(props) {
<div id="Main">
<div className="Main-header">
<div className="title">
<h1>Tunnel</h1>
<h1>"말하기 어려운 고민 여기에 털어놓으세요 :)"</h1>
</div>
<div className="None-title">
<Button className="ui right floated button" onClick={()=>onLogout()}>
......@@ -29,55 +29,17 @@ function MainPage(props) {
</div>
</div>
<div className="Main-body">
<div className="contents-container">
<div className="write-button">
<Button className="ui animated button"
tabIndex="0">
<div className="visible content">새 고민 작성하기</div>
<div className="hidden content">
<i className="pencil alternate icon"></i>
</div>
</Button>
</div>
<div className="contents">
<div className="ui segment">
<CKEditor
editor={ClassicEditor}
data="<p>Hello from CKEditor 5!</p>"
onReady={editor => {
// You can store the "editor" and use when it is needed.
console.log('Editor is ready to use!', editor);
}}
onChange={(event, editor) => {
const data = editor.getData();
console.log({ event, editor, data });
}}
onBlur={(event, editor) => {
console.log('Blur.', editor);
}}
onFocus={(event, editor) => {
console.log('Focus.', editor);
}}
/>
</div>
<div className="ui segment">
<p>a</p>
</div>
<div className="ui segment">
<p>a</p>
</div>
</div>
</div>
<div className="user-container">
<Board/>
{/* <div className="user-container">
<div className="userInfo">
<h1>User ID</h1>
</div>
<div className="checkIssue-button">
<Button size="Big" className="ui animated button"
<Button className="ui animated button"
tabIndex="0">
<div className="visible content">도착한 글</div>
<div className="hidden content">
<i className="paper plane ic on"></i>
<i className="paper plane icon"></i>
</div>
</Button>
</div>
......@@ -94,7 +56,7 @@ function MainPage(props) {
</div>
</div>
</div>
</div>
</div> */}
</div>
</div>
);
......
import React, {useState} from 'react'
import { Button, Header, Image, Modal } from 'semantic-ui-react'
import {CKEditor} from "@ckeditor/ckeditor5-react";
import ClassicEditor from "@ckeditor/ckeditor5-build-classic";
function BoardModal({onViewContentHandler}) {
const handleClose = (event) => {
event.preventDefault();
setOpen(false);
}
const [open, setOpen] = useState(false)
const [BoardContent, setBoardContent] = useState({
title: '',
content:''
})
const getValue = e => {
const {name, value} = e.target;
setBoardContent({
...BoardContent,
[name]: value
})
console.log(BoardContent);
}
return (
<Modal
onClose={() => setOpen(false)}
onOpen={() => setOpen(true)}
open={open}
trigger={<Button className="ui animated button" tabIndex="0">
<div className="visible content">게시글 작성하기</div>
<div className="hidden content">
<i className="pencil alternate icon"></i>
</div>
</Button>}
>
<Modal.Header>고민이 있나요?</Modal.Header>
<Modal.Content content>
<Modal.Description>
<div className="form=wrapper">
<input className="title-input"
type='text'
placeholder='제목'
onChange={getValue}
name = 'title'
/>
<CKEditor
editor={ClassicEditor}
data=""
onReady={editor => {
// You can store the "editor" and use when it is needed.
console.log('Editor is ready to use!', editor);
}}
onChange={(event, editor) => {
const data = editor.getData();
console.log({ event, editor, data });
setBoardContent({
...BoardContent,
content: data,
})
console.log(BoardContent);
}}
onBlur={(event, editor) => {
console.log('Blur.', editor);
}}
onFocus={(event, editor) => {
console.log('Focus.', editor);
}}
/>
</div>
</Modal.Description>
</Modal.Content>
<Modal.Actions>
<div onClick={handleClose}>
<Button color='black'>
작성 취소
</Button>
<Button
content="글 작성하기"
labelPosition='right'
icon='checkmark'
onClick={()=> onViewContentHandler(BoardContent)}
positive
/>
</div>
</Modal.Actions>
</Modal>
)
}
export default BoardModal
\ No newline at end of file
.contents-container{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 10px 0 30px 0;
}
.title-input{
width: 500px;
height: 40px;
margin: 10px;
}
.write-button{
height: 70px;
display: flex;
justify-content: center;
align-items: center;
}
.contents{
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
border-radius: 30px;
border: 2px solid #333;
}
\ No newline at end of file
.title-input{
width: 500px;
height: 40px;
margin: 10px;
}
.write-button{
height: 70px;
display: flex;
justify-content: center;
align-items: center;
}
\ No newline at end of file
#Main{
margin-top: 30px;
background-color: beige;
display: flex;
flex-direction: column;
.Main-header{
display: flex;
flex-direction: row;
height: 70px;
.title{
display: flex;
justify-content: center;
align-items: center;
width: 90%;
height: 60px;
.h1{
font-family:Arial, Helvetica, sans-serif;
font-size: 60px;
font-weight: bold;
}
}
.None-title{
display: flex;
justify-content: center;
align-items: center;
width: 10%;
.ui button{
height: 40px;
......@@ -26,36 +31,21 @@
display: flex;
flex-direction: row;
height: 100vh;
.contents-container{
border: 3px solid black;
.Board{
text-align: center;
display: flex;
justify-content: flex-start;
flex-direction: column;
width: 75%;
width: 100%;
height: 100%;
border: 2px solid black;
.write-button{
height: 70px;
display: flex;
justify-content: center;
align-items: center;
}
.contents{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.Grid{
display: flex;
justify-content: center;
align-items: center;
}
}
}
.user-container{
display: flex;
flex-direction: column;
width: 25%;
border: 2px solid black;
padding: 10px 0 30px 0;
.userInfo{
display: flex;
justify-content: center;
......
......@@ -3,12 +3,17 @@ import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import 'semantic-ui-css/semantic.min.css'
<<<<<<< HEAD
ReactDOM.render(
<App />,
document.getElementById('root')
=======
ReactDOM.render(
<App />,
document.getElementById('root')
>>>>>>> board
);
// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
\ No newline at end of file
......
const { createProxyMiddleware } = require('http-proxy-middleware');
module.exports = function(app) {
app.use(
<<<<<<< HEAD
createProxyMiddleware('/api',{
=======
createProxyMiddleware('/api',{
>>>>>>> board
target: 'http://localhost:3001',
changeOrigin: true,
})
......