Skip to content

GitLab

Commit 0ce1f449 authored by Yoon, Daeki's avatar Yoon, Daeki 😅
Browse files

Merge branch 'develop' into main-dev

parents a2cd7201 94bd52bc
Hide whitespace changes
Inline Side-by-side
frontend/src/App.tsx
View file @ 0ce1f449
......@@ -12,7 +12,6 @@ export const App = () => {
<Routes>
<Route path="login" element={<Login />} />
<Route path="signup" element={<Signup />} />
<Route path="/" element={<Header />}>
<Route index element={<Body />} />
<Route path="board" element={<Board />} />
......
frontend/src/Pages/picpagination.tsx
View file @ 0ce1f449
import React from "react";
type num = {
total: number,
// total: number,
page: number,
setPage: Function
}
export default function Pagination ({total, page, setPage} : num) {
const numPages = Math.ceil(total / 15);
// export function PaginationLeft ({total, page, setPage} : num) {
// const numPages = Math.ceil(total / 15);
export function PaginationLeft ({ page, setPage} : num) {
const numPages = 3
return (
<div>
<button onClick={() => setPage(page - 1)} disabled={page === 1}>
&lt;
</button>
{Array(numPages)
{/* {Array(numPages)
.fill(1)
.map((_, i) => (
<button key={i + 1} onClick={() => setPage(i + 1)}>
{i + 1}
</button>
))}
))} */}
</div>
);
};
// export function PaginationRight ({total, page, setPage} : num) {
// const numPages = Math.ceil(total / 15);
export function PaginationRight ({ page, setPage} : num) {
const numPages = 3;
return (
<div>
<button onClick={() => setPage(page + 1)} disabled={page === numPages}>
&gt;
</button>
......
frontend/src/apis/index.ts
View file @ 0ce1f449
import axios from "axios";
export * as authApi from "./auth.api";
export * as postApi from "./post.api";
frontend/src/apis/post.api.ts 0 → 100644
View file @ 0ce1f449
import axios from "axios";
import baseUrl from "./baseUrl";
import { PostingType } from "../types";
export const posting = async (post: PostingType) => {
const { data } = await axios.post(`${baseUrl}/posts/`, post);
return data;
};
frontend/src/auth/auth.helper.tsx 0 → 100644
View file @ 0ce1f449
import { authApi } from "../apis";
import { IUser } from "../types";
const LOCAL_USER_INFO = "survey-user-info";
/**
* 1. 백엔드 로그인을 호출하여 로그인 정보를 얻습니다.
* 2. 로컬 저장소에 저장합니다.
* 3. 사용자 정보를 반환합니다.
* @param email 이메일
* @param password 비밀번호
* @returns 사용자 정보
*/
export const handleLogin = async (email: string, password: string) => {
const user: IUser = await authApi.login(email, password);
// 로컬 저장소에는 로그인 여부만 저장
localStorage.setItem(
LOCAL_USER_INFO,
JSON.stringify({
isLoggedIn: user.isLoggedIn,
})
);
return user;
};
/**
* 로컬 저장소의 정보를 삭제합니다.
* 백엔드 로그아웃을 호출하여 쿠키를 제거합니다.
*/
export const handleLogout = async () => {
console.log("handle logout called");
localStorage.removeItem(LOCAL_USER_INFO);
try {
await authApi.logout();
} catch (error) {
console.log("logout 중에 에러 발생:", error);
}
};
/**
* 1. 로컬 저장소에 저장된 사용자 로그인 정보를 반환합니다.
* 2. 로컬 저장소에 정보가 없으면 { isLoggedIn: false }를 반환합니다.
* @returns 로컬 저장소에 저장된 사용자 정보
*/
export const getLocalUser = () => {
console.log("get local user called");
const userInfo = localStorage.getItem(LOCAL_USER_INFO);
const user: IUser = { isLoggedIn: false };
if (!userInfo) {
return user;
}
const userData = JSON.parse(userInfo);
if (userData.isLoggedIn) {
user.isLoggedIn = true;
} else {
user.isLoggedIn = false;
}
return user;
};
frontend/src/auth/login.tsx
View file @ 0ce1f449
import { Link } from "react-router-dom";
import React, { useState, FormEventHandler } from "react";
import { Link, useNavigate } from "react-router-dom";
import React, { useState, useEffect, FormEvent } from "react";
import { LoginUser } from "../types";
import { catchErrors } from "../helpers";
import { useAuth } from "./auth.context";
interface login {
id: string;
password: string;
}
export default function Login() {
const [user, setUser] = useState<LoginUser>({
email: "",
password: "",
});
const [loading, setLoading] = useState(false);
const [error, setError] = useState("");
const [disabled, setDisabled] = useState(false);
const [success, setSuccess] = useState(false);
const navigate = useNavigate();
const { login } = useAuth();
// const fake = { id: "asdf", password: "qwer" };
useEffect(() => {
setDisabled(!(user.email && user.password));
}, [user]);
function Logindata() {
const [id, setId] = useState("");
const [password, setPassword] = useState("");
function handleChange(event: React.ChangeEvent<HTMLInputElement>) {
const { name, value } = event.currentTarget;
setUser({ ...user, [name]: value });
}
function login() {
fetch(`http://localhost:3000/api/auth/login`, {
method: "POST",
async function handleSubmit(event: FormEvent) {
event.preventDefault();
try {
setError("");
console.log("user data", user);
body: JSON.stringify({
email: `${id}`,
password: `${password}`,
}),
}).then((response) => {
console.log(response.json());
});
// setLoading(true);
await login(user.email, user.password, () => {
navigate("/", { replace: true });
});
// console.log("서버연결됬나요", res);
// console.log("로그인");
// setSuccess(true);
// setError("");
} catch (error) {
console.log("에러발생");
// setError("이메일 혹은 비밀번호를 다시 입력해주세요.");
catchErrors(error, setError);
} finally {
setLoading(false);
}
}
return (
<div className="flex flex-col md:w-2/3 md:gap-2">
<input
className="placeholder:text-slate-300
bg-white border border-slate-500 rounded-2xl
py-2 pl-9 pr-3
<div className="flex flex-col items-center my-10">
<div className="bg-white w-1/2 md:w-1/3 my-8 text-center text-2xl">
<Link to="/">Travel Report</Link>
</div>
<div className="flex flex-col w-full md:w-1/3 p-8 md:p-4 md:p-0">
<form onSubmit={handleSubmit}>
<div className="flex flex-col md:flex-row border-2 border-black rounded-xl p-8 md:p-12 gap-y-4 md:gap-x-6">
<div className="flex flex-col md:w-2/3 md:gap-2 ">
<input
className="placeholder:text-slate-300
bg-white border border-slate-500 md:rounded-2xl
my-2 py-3 md:py-2 pl-9 pr-3
focus:border-black
"
placeholder="Id"
type="text"
name="Id"
onChange={(e) => setId(e.target.value)}
/>
<input
className="placeholder:italic placeholder:text-slate-300
bg-white border border-slate-500 rounded-2xl
py-2 pl-9 pr-3
placeholder="이메일"
type="email"
name="email"
onChange={handleChange}
/>
<input
className="placeholder:italic placeholder:text-slate-300
bg-white border border-slate-500 md:rounded-2xl
py-3 md:py-2 pl-9 pr-3
focus:border-black
"
placeholder="Password"
type="password"
name="Password"
onChange={(e) => setPassword(e.target.value)}
/>
<button
type="submit"
className="md:w-1/3 bg-sky-600 hover:bg-sky-700 rounded-xl"
onClick={login}
>
<Link to={"/"}>login</Link>
</button>
</div>
);
}
export default function Login() {
return (
<div>
{/* <form onSubmit={loginsubmit}> */}
<div className="flex flex-row grid-rows-2">
<div className=" p-12 w-1/2 h-1/2 md:w-40 md:h-40 bg-red-400 place-self-center rounded-2xl">
<Link to="/">Travel Report</Link>
</div>
<div className=" flex-row w-auto h-60 md:w-1/2 bg-white border-2 border-black grid place-items-center rounded-xl place-self-center">
<div className="flex flex-col w-full md:flex-row md:p-20 md:gap-10">
<Logindata />
</div>
<div className="flex-row grid grid-cols-3">
<button className="bg-white bottom-0 right-0">
<Link to="/signup">회원가입</Link>
placeholder="Password"
type="password"
name="password"
onChange={handleChange}
/>
</div>
<button
disabled={disabled}
type="submit"
className="my-4 md:my-0 md:w-1/3 bg-sky-600 hover:bg-sky-700 rounded-xl text-xl py-4"
>
login
</button>
</div>
</form>
<div className="flex justify-around m-4">
<button className="bg-white ">
<Link to="/signup">회원가입</Link>
</button>
<div className="grid grid-cols-2 divide-x-2">
<div></div>
<div></div>
<button className="bg-white inset-x-0">
<Link to="/forgot">비밀번호 찾기</Link>
</button>
</div>
<button className="bg-white">
<Link to="/forgot">비밀번호 찾기</Link>
</button>
</div>
</div>
{/* </form> */}
</div> // Login Page
</div>
);
}
frontend/src/board/board.tsx
View file @ 0ce1f449
......@@ -14,6 +14,7 @@ interface Posts {
export const fakes = [
{
id: "a",
username: "lsb",
title: "여행가고싶다...",
date: "2022-06-30",
counts: 0,
......@@ -22,6 +23,7 @@ export const fakes = [
},
{
id: "b",
username: "lsb",
title: "바다!바다!바다!",
date: "2022-08-01",
counts: 0,
......@@ -30,6 +32,7 @@ export const fakes = [
},
{
id: "c",
username: "lsb",
title: "Jeju-island",
date: "2022-9-10",
counts: 0,
......@@ -38,6 +41,7 @@ export const fakes = [
},
{
id: "d",
username: "lsb",
title: "마! 부싼 가봤나!",
date: "2022-9-22",
counts: 0,
......@@ -46,26 +50,29 @@ export const fakes = [
},
{
id: "e",
username: "lsb",
title: "Daegu",
date: "2022-10-1",
counts: 0,
theme: "surfing",
city: "seoul",
theme: "ski",
city: "Daegu",
},
{
id: "f",
username: "lsb",
title: "강원도 감자는 맛있다.",
date: "2022-12-12",
counts: 0,
theme: "surfing",
city: "seoul",
theme: "camping",
city: "강원도",
},
{
id: "g",
username: "lsb",
title: "부산남자의 서울여행",
date: "2022-12-25",
counts: 0,
theme: "surfing",
theme: "activity",
city: "seoul",
},
];
......
frontend/src/home/body.tsx
View file @ 0ce1f449
......@@ -3,7 +3,7 @@ import { Outlet, useSearchParams } from "react-router-dom";
import Theme from "./theme";
import Citylist from "../Pages/citylist";
import { getPicure } from "../Pages/pic";
import Pagination from "../Pages/picpagination";
import { PaginationLeft ,PaginationRight} from "../Pages/picpagination";
const initSearchParams = { theme: "", city: "" };
......@@ -12,7 +12,7 @@ export default function Body() {
const [searchParams, setSearchParams] = useSearchParams(initSearchParams);
const [page, setPage] = useState(1);
const offset = (page - 1) * limit;
const [selected, setSelected] = useState(1);
let getPics = getPicure();
useEffect(() => {
......@@ -48,29 +48,55 @@ export default function Body() {
);
});
const pre = () =>{
setSelected(selected -1)
};
const next = () =>{
setSelected(selected + 1)
};
return (
<div className="flex flex-col px-1 py-1">
<Theme handleClick={themeHandleClick} />
<div className="flex flex-col md:flex-row py-10 ">
<Citylist handleClick={cityHandleClick} />
<div className="flex-row md:mr-10 md:basis-4/5 grid grid-rows-3 grid-cols-5">
{Idpics.slice(offset, offset + limit).map((pic, index: number) => (
<div
className="m-1 shrink-0 bg-gray-200 rounded overflow-hidden shadow-md"
key={index}
>
<img
src={pic.url}
className="w-full h-10 md:h-20 object-center"
/>
<p className="text-center text-xs">{pic.name}</p>
<div className="w-50">
<Citylist handleClick={cityHandleClick} />
</div>
<div className="flex flex-col">
<div>
<button onClick={pre} disabled={selected === 1}>&lt;{selected}</button>
<button onClick={next} disabled={selected === 3}>&gt;</button>
</div>
<div >
<div className=" md:mr-10 md:basis-4/5 overflow-hidden">
<div className=" flex flex-row transition duration-500 relative" style={{"transform": 'translate(-' + (selected-1)*100 + '%)'}}>
<img className = "border-2"src="https://t1.daumcdn.net/cfile/tistory/9947E0365C31C1BF0E"/>
<img className = "border-2"src="https://t1.daumcdn.net/cfile/tistory/9947E0365C31C1BF0E"/>
<img className = "border-2"src="https://t1.daumcdn.net/cfile/tistory/9947E0365C31C1BF0E"/>
</div>
</div>
))}
<Pagination total={Idpics.length} page={page} setPage={setPage} />
</div>
</div>
</div>
<Outlet />
</div>
// Body Page
);
}
{/* <div className=" md:mr-10 md:basis-4/5 grid grid-rows-3 grid-cols-5"></div> */}
{/* {Idpics.slice(offset, offset + limit).map((pic, index: number) => (
<div
className="m-1 shrink-0 bg-gray-200 rounded overflow-hidden shadow-md"
key={index}
>
<img
src={pic.url}
className="w-full h-10 md:h-20 object-center"
/>
<p className="text-center text-xs">{pic.name}</p>
</div>
))} */}
{/* <PaginationLeft total={Idpics.length} page={page} setPage={setPage} /> */}
{/* <PaginationRight total={Idpics.length} page={page} setPage={setPage} /> */}
\ No newline at end of file
frontend/src/home/header.tsx
View file @ 0ce1f449
import React from "react";
import {Link, Outlet} from "react-router-dom";
import React, { useState } from "react";
import { Link, Outlet } from "react-router-dom";
import { useAuth } from "../auth/auth.context";
import "tailwindcss/tailwind.css";
export default function Header() {
return (
<div className="flex flex-col ">
<div className="flex flex-row px-5 py-20 md:place-content-between">
<button className="px-5 py-2">
<Link to="/" className="hover:bg-gray-200 focus:text-purple-500">Travel Report</Link>
const { logout } = useAuth();
return (
<div className="flex flex-col ">
<div className="flex flex-row px-5 py-20 md:place-content-between">
<button className="px-5 py-2">
<Link to="/" className="hover:bg-gray-200 focus:text-purple-500">
Travel Report
</Link>
</button>
<div className="flex flex-row-reverse">
<div className="px-5 py-2 bg-teal-400 rounded">
{localStorage.getItem("survey-user-info") ? (
<button
onClick={() => {
logout();
}}
>
Logout
</button>
) : (
<button>
<Link to="/login">Login</Link>
</button>
)}
</div>
<button className="px-5 py-2 bg-purple-400 rounded">
<Link
to="/board"
className="hover:bg-purple-300 focus:text-purple-500 "
>
Board
</Link>
</button>
<div className="flex flex-row-reverse">
<button className="px-5 py-2 bg-teal-400 rounded">
<Link to="/login" className="hover:bg-teal-100 focus:text-purple-500 ">Login</Link>
</button>
<button className="px-5 py-2 bg-purple-400 rounded">
<Link to="/board" className="hover:bg-purple-300 focus:text-purple-500 ">Board</Link>
</button>
<div>
<label>
{/* <span className="sr-only">Search</span> */}
<span className="absolute inset-y-0 left-0 flex items-center pl-2">
<svg className="h-5 w-5 fill-slate-300" viewBox="0 0 20 20"></svg>
</span>
<input className="placeholder:italic placeholder:text-slate-400 block bg-white w-full border border-slate-300 rounded-md py-2 pl-9 pr-3 shadow-sm focus:outline-none focus:border-sky-500 focus:ring-sky-500 focus:ring-1 sm:text-sm" placeholder="Search for anything..." type="text" name="search" />
</label>
</div>
<div>
<label>
{/* <span className="sr-only">Search</span> */}
<span className="absolute inset-y-0 left-0 flex items-center pl-2">
<svg
className="h-5 w-5 fill-slate-300"
viewBox="0 0 20 20"
></svg>
</span>
<input
className="placeholder:italic placeholder:text-slate-400 block bg-white w-full border border-slate-300 rounded-md py-2 pl-9 pr-3 shadow-sm focus:outline-none focus:border-sky-500 focus:ring-sky-500 focus:ring-1 sm:text-sm"
placeholder="Search for anything..."
type="text"
name="search"
/>
</label>
</div>
</div>
<Outlet/>
</div>
);
}
\ No newline at end of file
<Outlet />
</div>
);
}
frontend/src/index.tsx
View file @ 0ce1f449
import React from "react";
import { createRoot } from "react-dom/client";
import { App } from "./App";
import { AuthProvider } from "./auth/auth.context";
const container = document.getElementById("root");
const root = createRoot(container!);
root.render(
<React.StrictMode>
<App />
<AuthProvider>
<App />
</AuthProvider>
</React.StrictMode>
);
frontend/src/post/posting.tsx
View file @ 0ce1f449
import React, { useState } from "react";
import React, { FormEvent, useState } from "react";
import isLength from "validator/lib/isLength";
import equals from "validator/lib/equals";
import { catchErrors } from "../helpers";
import { PostingType } from "../types";
import { postApi } from "../apis";
function Title() {
const [title, setTitle] = useState<string>("질문종류");
export default function Posting() {
const [city, setCity] = useState<string>("질문종류");
const [theme, setTheme] = useState<string>("질문종류");
const [title, setTitle] = useState<string>("");
const [text, setText] = useState<string>("");
function TitleChange(e: { target: { value: React.SetStateAction<string> } }) {
setTitle(e.target.value);
}
}
const [user, setUser] = useState<PostingType>({
title: "",
text: "",
theme: "",
city: "",
username: "",
});
function Body() {
const [body, setBody] = useState<string>("질문종류");
const [loading, setLoading] = useState(false);
const [error, setError] = useState("");
const [disabled, setDisabled] = useState(false);
const [success, setSuccess] = useState(false);
function BodyChange(e: { target: { value: React.SetStateAction<string> } }) {
setBody(e.target.value);
async function handlePostSubmit(event: FormEvent) {
event.preventDefault(); // prevent onSubmit -> rerendering
try {
setError("");
console.log("user data", user);
if (postingFormMatch()) {
setLoading(true);
const res = await postApi.posting(user);
console.log("서버연결됬나요", res);
console.log("user save");
setSuccess(true);
setError("");
}
} catch (error) {
console.log("에러발생");
catchErrors(error, setError);
} finally {
setLoading(false);
}
}
}
function SelectCity() {
const [selectCity, setSelectCity] = useState<string>("질문종류");
function CityChange(e: { target: { value: React.SetStateAction<string> } }) {
setSelectCity(e.target.value);
function postingFormMatch() {
if (!isLength(user.title ?? "", { min: 1 })) {
setError("제목을 입력해 주세요.");
return false;
} else if (!isLength(user.text ?? "", { min: 1 })) {
setError("내용을 입력해 주세요.");
return false;
} else if (equals(city, "질문종류")) {
setError("테마를 선택해 주세요.");
return false;
} else if (equals(theme, "질문종류")) {
setError("도시를 선택해 주세요.");
return false;
} else {
return true;
}
}
return (
<select
id="Questions"
className="border border-3 border-black w-1/12"
onChange={CityChange}
defaultValue="질문종류"
>
<option value="질문종류">도시</option>
<option value="Seoul">서울</option>
<option value="Busan">부산</option>
<option value="Incheon">인천</option>
<option value="Daegoo">대구</option>
<option value="Kwangjoo">광주</option>
<option value="Daejeon">대전</option>
<option value="Woolsan">울산</option>
<option value="Sejong">세종</option>
<option value="Dokdo">독도</option>
<option value="Jeju">제주</option>
</select>
);
}
function SelectTheme() {
const [selectTheme, setSelectTheme] = useState<string>("질문종류");
const titleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {
const title = event.currentTarget.value;
const newUser = { ...user, title: title };
console.log(event.currentTarget.value);
setTitle(event.currentTarget.value);
setUser(newUser);
};
function ThemeChange(e: { target: { value: React.SetStateAction<string> } }) {
setSelectTheme(e.target.value);
}
return (
<select
id="Questions"
className="border border-3 border-black w-1/12"
onChange={ThemeChange}
defaultValue="질문종류"
>
<option value="질문종류">테마</option>
<option value="cycling">사이클링</option>
<option value="surfing">서핑</option>
<option value="activity">액티비티</option>
<option value="camping">캠핑</option>
<option value="sking">스키</option>
<option value="boat">보트</option>
<option value="desert">사막</option>
<option value="golf">골프</option>
<option value="cave">동굴</option>
<option value="history">문화재</option>
<option value="zoo">동물원</option>
<option value="cycling">사이클링</option>
<option value="cycling">{selectTheme}</option>
</select>
);
}
// 눌렀다는 데이터가 어딘가에 있어야 한다. Map 객체를 이용해서 기타등등
const textChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {
const text = event.currentTarget.value;
const newUser = { ...user, text: text };
console.log(event.currentTarget.value);
setText(event.currentTarget.value);
setUser(newUser);
};
// function postup() {
// axios.post("localhost:3000/api/post/up", {
// id: "a",
// title: title,
// body: body,
// date: `${() => new Date()}`,
// theme: selectTheme,
// city: selectCity,
// });
// }
const cityChange = (event: React.ChangeEvent<HTMLSelectElement>) => {
const city = event.currentTarget.value;
const newUser = { ...user, city: city };
console.log(event.currentTarget.value);
setCity(event.currentTarget.value);
setUser(newUser);
};
const themeChange = (event: React.ChangeEvent<HTMLSelectElement>) => {
const theme = event.currentTarget.value;
const newUser = { ...user, theme: theme };
console.log(event.currentTarget.value);
setTheme(event.currentTarget.value);
setUser(newUser);
};
export default function Posting() {
return (
<div className="flex flex-col border-3">
<form className="w-full items-center">
<form onSubmit={handlePostSubmit} className="w-full items-center">
<div className="flex flex-row relative">
<p className="basis-1/12 gap-x-8">Id</p>
<p className="basis-8/12 invisible">empty</p>
<SelectCity />
<SelectTheme />
<select
name="city"
id="Questions"
className="border border-3 border-black w-1/12"
onChange={cityChange}
defaultValue="질문종류"
>
<option value="질문종류">도시</option>
<option value="Seoul">서울</option>
<option value="Busan">부산</option>
<option value="Incheon">인천</option>
<option value="Daegoo">대구</option>
<option value="Kwangjoo">광주</option>
<option value="Daejeon">대전</option>
<option value="Woolsan">울산</option>
<option value="Sejong">세종</option>
<option value="Dokdo">독도</option>
<option value="Jeju">제주</option>
</select>
<select
name="theme"
id="Questions"
className="border border-3 border-black w-1/12"
onChange={themeChange}
defaultValue="질문종류"
>
<option value="질문종류">테마</option>
<option value="cycling">사이클링</option>
<option value="surfing">서핑</option>
<option value="activity">액티비티</option>
<option value="camping">캠핑</option>
<option value="sking">스키</option>
<option value="boat">보트</option>
<option value="desert">사막</option>
<option value="golf">골프</option>
<option value="cave">동굴</option>
<option value="history">문화재</option>
<option value="zoo">동물원</option>
<option value="cycling">사이클링</option>
</select>
<button
type="submit"
......@@ -107,13 +152,19 @@ export default function Posting() {
<div className="flex border-4">
<textarea
onChange={Title}
name="title"
onChange={titleChange}
placeholder="title"
className="w-full h-8"
></textarea>
</div>
<div onChange={Body} className="flex border-2">
<textarea placeholder="body" className="w-full h-96"></textarea>
<div className="flex border-2">
<textarea
onChange={textChange}
name="text"
placeholder="text"
className="w-full h-96"
></textarea>
</div>
</form>
</div>
......
frontend/src/types/index.tsx
View file @ 0ce1f449
......@@ -4,14 +4,23 @@ export interface IUser {
_id?: string;
}
export interface PostType {
id: string;
title: string;
body?: string;
date: string;
export interface LoginUser {
email: string;
password: string;
}
export interface PostType extends PostingType {
date?: string;
counts: number;
theme?: string;
city?: string;
id?: string;
}
export interface PostingType {
title: string;
text?: string;
theme: string;
city: string;
username: string;
}
export interface SignupUser {
......
src/controllers/post.controller.ts
View file @ 0ce1f449
import { NextFunction, Request, Response } from "express";
import isLength from "validator/lib/isLength";
import equals from "validator/lib/equals";
import { asyncWrap } from "../helpers";
import jwt, { JwtPayload } from "jsonwebtoken";
import { jwtCofig, envConfig, cookieConfig } from "../config";
import { postDb } from "../db";
export const posting = asyncWrap(async (req, res) => {
const { title, text, theme, city, username } = req.body;
console.log("body", req.body);
// 1) title 빈 문자열인지 확인
if (!isLength(title ?? "", { min: 1 })) {
return res.status(422).send("제목을 한 글자 이상 입력해주세요");
}
// 2) body 빈 문자열인지 확인
if (!isLength(text ?? "", { min: 1 })) {
return res.status(422).send("제목을 한 글자 이상 입력해주세요");
}
// 3) theme dropdown default-value "테마"일 경우 에러
if (equals(theme, "질문종류")) {
return res.status(422).send("테마를 입력해 주세요");
}
// 4) city dropdown default-value "도시"일 경우 에러
if (equals(city, "질문종류")) {
return res.status(422).send("도시를 선택해 주세요");
}
// 5) username 확인 필요 없음
// 6)
const newPosting = await postDb.createPosting({
title,
text,
theme,
city,
username,
});
return res.json(newPosting);
});
export const post = asyncWrap(async (req, res) => {
const { title, theme, city, username, date, counts } = req.body;
export const posting = asyncWrap(async (req, res) => {
const { title, body, date, theme, city } = req.body;
// 1) title 빈 문자열인지 확인
const titleString = postDb.checkTitleNull(title, );
if (!titleString) {
return res.status(422).send(`${title} 제목을 입력해 주세요`);
}
// 2) body 빈 문자열인지 확인
const bodyString = postDb.checkBodyNull(body, );
if (!bodyString) {
return res.status(422).send(`${body} 여행 후기를 입력해 주세요`);
}
// 3) submit 이벤트 발생시 date값 입력
const dateGet = postDb.getSubmitDate(date, );
// 4) theme dropdown default-value일 경우 에러
const themeSelect = postDb.selectTheme(theme, );
if (!themeSelect) {
return res.status(422).send(`${theme} 테마를 선택해 주세요`)
}
// 5) cuty dropdown default-value일 경우 에러
const citySelect = postDb.selectCity(city, );
if (!citySelect) {
return res.status(422).send(`${city} 도시를 선택해 주세요`)
}
// 6) 토큰 생성
const token = jwt.sign({ }, jwtCofig.secret, {
expiresIn: jwtCofig.expires,
});
// 7) 쿠키에 토큰 저장
res.cookie(cookieConfig.name, token, {
maxAge: cookieConfig.maxAge,
path: "/",
httpOnly: envConfig.mode === "production",
secure: envConfig.mode === "production",
});
// 8) 사용자 반환
res.json({});
console.log("body", req.body);
// 1) DB postings에서 title, theme, city, username, date 불러오기
// 2) 불러온 데이터 + counts posts에 저장
// 3) DB posts에서 데이터 불러서 frontend로 보내기
});
src/db/post.db.ts
View file @ 0ce1f449
import { PostType, Post } from "../models";
import { Posting, PostingType } from "../models";
import { Post, PostType } from "../models";
export const createPosting = async (posting: PostingType) => {
const newPosting = await Posting.create({
title: posting.title,
text: posting.text,
theme: posting.theme,
city: posting.city,
username: posting.username,
});
return newPosting;
};
export const createPost = async (post: PostType) => {
const newPost = await Post.create(post);
return newPost;
const newPost = await Post.create({
title: post.title,
theme: post.theme,
city: post.city,
date: post.date,
counts: post.counts,
});
};
export const checkTitleNull = async (
title : string,
) => {
}
export const checkBodyNull = async (
body : string,
) => {
}
export const getSubmitDate = async (
date : string,
) => {
}
export const selectTheme = async (
theme : string,
) => {
let user;
if( theme != "테마" ) {
}
}
export const selectCity = async (
city : string,
) => {
let user;
if ( city != "도시" ) {
}
}
src/models/index.ts
View file @ 0ce1f449
export { default as User, IUser } from "./user.model";
export { default as Posting, PostingType } from "./posting.model";
export { default as Post, PostType } from "./post.model";
src/models/post.model.ts
View file @ 0ce1f449
import { model, Schema } from "mongoose";
import { model, Schema, Types } from "mongoose";
import { PostingType } from "./posting.model";
export interface PostType {
id: string;
title: string;
date: Date;
body : string;
counts?: number;
theme: string;
city: string;
}
const schema = new Schema<PostType>({
id : {type: String},
title : { type: String },
date : {type: Date},
body : {type : String},
counts : {type: Number},
theme : {type: String},
city : {type: String},
export interface PostType extends PostingType {
date?: string;
counts: number;
id?: string;
}
const postSchema = new Schema<PostType>({
title: { type: String },
theme: { type: String },
city: { type: String },
username: { type: String },
date: { type: String },
counts: { type: Number },
});
export default model<PostType>("Post", schema);
export default model<PostType>("Post", postSchema);
src/models/posting.model.ts 0 → 100644
View file @ 0ce1f449
import { model, Schema } from "mongoose";
export interface PostingType {
title: string;
text?: string;
theme: string;
city: string;
username?: string;
}
const postingSchema = new Schema<PostingType>({
title: {
type: String,
required: true,
},
text: {
type: String,
required: true,
},
theme: {
type: String,
},
city: {
type: String,
},
username: {
type: String,
},
});
export default model<PostingType>("Posting", postingSchema);
src/routes/index.ts
View file @ 0ce1f449
......@@ -7,7 +7,7 @@ const router = express.Router();
router.use("/users", userRouter);
router.use("/auth", authRouter);
router.use("/posts", postRouter); //router.route
router.use("/posts", postRouter);
//posting함수 -> mongodb에 posts json형식으로 저장
export default router;
src/routes/post.route.ts
View file @ 0ce1f449
......@@ -3,6 +3,6 @@ import { postCtrl } from "../controllers";
const router = express.Router();
router.route("/posting").post(postCtrl.posting);
router.route("/").post(postCtrl.posting);
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