Skip to content

GitLab

Commit 9ec3dfc5 authored by Yoon, Daeki's avatar Yoon, Daeki 😅
Browse files

프로젝트 구조 변경 및 파일 이름 변경

parent cf7c5802
Hide whitespace changes
Inline Side-by-side
frontend/src/App.tsx
View file @ 9ec3dfc5
import React from "react";
import RootPage from "./Pages/RootPage";
import HomePage from "./Pages/HomePage";
import LoginPage from "./Pages/LoginPage";
import SignUpPage from "./Pages/SignUpPage";
import CreateSurveyFormPage from "./Pages/CreateSurveyFormPage";
import { BrowserRouter, Route, Routes } from "react-router-dom";
import "tailwindcss/tailwind.css";
import { Outlet } from "react-router-dom";
import { Header } from "./commons";
export const App = () => {
return (
<BrowserRouter>
<Routes>
<Route path="/" element={<RootPage />}>
<Route index element={<HomePage/>}/>
<Route path="login" element={<LoginPage />} />
<Route path="signup" element={<SignUpPage />} />
<Route path="create" element={<CreateSurveyFormPage/>} />
</Route>
</Routes>
</BrowserRouter>
);
};
const App = () => (
<div>
<Header />
<Outlet />
</div>
);
export default App;
frontend/src/Components/Header.tsx deleted 100644 → 0
View file @ cf7c5802
import React from "react";
import { Link } from "react-router-dom";
import "tailwindcss/tailwind.css";
const Header = () => (
<div className="bg-white border-b-2 border-b-themeColor px-2 sm:px-4 py-2.5">
<div className="container flex flex-wrap justify-between items-center mx-auto">
<Link to="/" className="font-bold text-2xl text-themeColor"> Simple Survey Form </Link>
<div className="md:flex items-center justify-end md:flex-1 lg:w-0">
<Link to="/login" className="whitespace-nowrap font-bold text-gray-600 hover:text-themeColor mx-1 py-2 px-3 rounded-md">Login</Link>
<Link to="/signup" className="whitespace-nowrap font-bold text-white hover:bg-blue-500 mx-1 py-2 px-3 bg-themeColor rounded-md ">Sign Up</Link>
</div>
</div>
</div>
);
export default Header;
\ No newline at end of file
frontend/src/Pages/CreateSurveyFormPage.tsx deleted 100644 → 0
View file @ cf7c5802
import React from "react";
import "tailwindcss/tailwind.css";
const CreateSurveyFormPage = () => (
<div>
설문조사를 직접 만들 수 있는 페이지
</div>
);
export default CreateSurveyFormPage;
\ No newline at end of file
frontend/src/Pages/HomePage.tsx deleted 100644 → 0
View file @ cf7c5802
import React from "react";
import "tailwindcss/tailwind.css";
type HomeProps = {
title?: string;
};
const HomePage = ({ title = "Simple Survey Form" }: HomeProps) => (
<div>
<div className="text-slate-300 text-center text-3xl text-black my-5">
가장 쉽게 설문지를 만드세요!
</div>
<div className="flex container justify-center my-6">
<div className="flex justify-center text-2xl font-bold h-14 w-28 border-blue-500 rounded-lg bg-gray-300">
<div className="flex">
<button className="text-black">
+
</button>
</div>
</div>
</div>
<div className="text-slate-300 text-center text-xl text-black">
Create now
</div>
</div>
);
export default HomePage;
\ No newline at end of file
frontend/src/Pages/LoginPage.tsx deleted 100644 → 0
View file @ cf7c5802
import React from "react";
import "tailwindcss/tailwind.css";
// type LoginProps = {
// };
const LoginPage = () => (
<div className="flex justify-center mt-3">
<div className="text-slate-300 text-xl font-bold">
<label className="block text-gray-700 text-sm font-bold mb-2 mt-3">
이메일
</label>
<input
className="shadow appearance-none border rounded py-2 px-3 text-gray-70"
id="email"
type="email"
placeholder="이메일을 입력하세요"
/>
<label className="block text-gray-700 text-sm font-bold mb-2 mt-3">
비밀번호
</label>
<input
className="shadow appearance-none border rounded py-2 px-3 text-gray-70"
id="username"
type="password"
placeholder="비밀번호를 입력하세요"
/>
<div className='text-center'>
<button className="bg-themeColor text-white border rounded w-100 py-2 px-3 mt-3">로그인</button>
</div>
</div>
</div>
);
export default LoginPage;
\ No newline at end of file
frontend/src/Pages/RootPage.tsx deleted 100644 → 0
View file @ cf7c5802
import React from "react";
import Header from "../Components/Header";
import "tailwindcss/tailwind.css";
import { Outlet } from "react-router-dom";
const RootPage = () => (
<div>
<Header />
<Outlet />
</div>
);
export default RootPage;
\ No newline at end of file
frontend/src/SurveyRouter.tsx 0 → 100644
View file @ 9ec3dfc5
import React from "react";
import { BrowserRouter, Route, Routes } from "react-router-dom";
import App from "./App";
import { Login, SignUp } from "./auth";
import { CreateSurveyForm } from "./commons";
import { Home } from "./home";
export const SurveyRouter = () => {
return (
<BrowserRouter>
<Routes>
<Route path="/" element={<App />}>
<Route index element={<Home />} />
<Route path="login" element={<Login />} />
<Route path="signup" element={<SignUp />} />
<Route path="create" element={<CreateSurveyForm />} />
</Route>
</Routes>
</BrowserRouter>
);
};
frontend/src/auth/Login.tsx 0 → 100644
View file @ 9ec3dfc5
import React from "react";
// type LoginProps = {
// };
export const Login = () => (
<div className="flex justify-center mt-3">
<div className="text-slate-300 text-xl font-bold">
<label className="block text-gray-700 text-sm font-bold mb-2 mt-3">
이메일
</label>
<input
className="shadow appearance-none border rounded py-2 px-3 text-gray-70"
id="email"
type="email"
placeholder="이메일을 입력하세요"
/>
<label className="block text-gray-700 text-sm font-bold mb-2 mt-3">
비밀번호
</label>
<input
className="shadow appearance-none border rounded py-2 px-3 text-gray-70"
id="username"
type="password"
placeholder="비밀번호를 입력하세요"
/>
<div className="text-center">
<button className="bg-themeColor text-white border rounded w-100 py-2 px-3 mt-3">
로그인
</button>
</div>
</div>
</div>
);
frontend/src/Pages/SignUpPage.tsx → frontend/src/auth/SignUp.tsx
View file @ 9ec3dfc5
import React from 'react'
import 'tailwindcss/tailwind.css'
import React from "react";
type SignUpProps = {}
type SignUpProps = {};
const SignUpPage = ({ }: SignUpProps) => (
export const SignUp = ({}: SignUpProps) => (
<div className="flex justify-center mt-3">
<div className="text-slate-300 text-xl font-bold">
<label className="block text-gray-700 text-sm font-bold mb-2 mt-3">
......@@ -34,11 +33,11 @@ const SignUpPage = ({ }: SignUpProps) => (
type="password"
placeholder="비밀번호를 입력하세요"
/>
<div className='text-center'>
<button className="bg-themeColor text-white border rounded w-100 py-2 px-3 mt-3">회원가입</button>
<div className="text-center">
<button className="bg-themeColor text-white border rounded w-100 py-2 px-3 mt-3">
회원가입
</button>
</div>
</div>
</div>
)
export default SignUpPage
);
frontend/src/auth/index.tsx 0 → 100644
View file @ 9ec3dfc5
export { Login } from "./Login";
export { SignUp } from "./SignUp";
frontend/src/commons/CreateSurveyForm.tsx 0 → 100644
View file @ 9ec3dfc5
import React from "react";
export const CreateSurveyForm = () => (
<div>설문조사를 직접 만들 수 있는 페이지</div>
);
frontend/src/commons/Header.tsx 0 → 100644
View file @ 9ec3dfc5
import React from "react";
import { Link } from "react-router-dom";
export const Header = () => (
<div className="bg-white border-b-2 border-b-themeColor px-2 sm:px-4 py-2.5">
<div className="container flex flex-wrap justify-between items-center mx-auto">
<Link to="/" className="font-bold text-2xl text-themeColor">
Simple Survey Form
</Link>
<div className="md:flex items-center justify-end md:flex-1 lg:w-0">
<Link
to="/login"
className="whitespace-nowrap font-bold text-gray-600 hover:text-themeColor mx-1 py-2 px-3 rounded-md"
>
Login
</Link>
<Link
to="/signup"
className="whitespace-nowrap font-bold text-white hover:bg-blue-500 mx-1 py-2 px-3 bg-themeColor rounded-md "
>
Sign Up
</Link>
</div>
</div>
</div>
);
frontend/src/commons/index.tsx 0 → 100644
View file @ 9ec3dfc5
export { CreateSurveyForm } from "./CreateSurveyForm";
export { Header } from "./Header";
frontend/src/home/Home.tsx 0 → 100644
View file @ 9ec3dfc5
import React from "react";
type HomeProps = {
title?: string;
};
export const Home = ({ title = "Simple Survey Form" }: HomeProps) => (
<div>
<div className="text-center text-3xl text-black my-5">
가장 쉽게 설문지를 만드세요!
</div>
<div className="flex container justify-center my-6">
<div className="flex justify-center text-2xl font-bold h-14 w-28 border-blue-500 rounded-lg bg-gray-300">
<div className="flex">
<button className="text-black">+</button>
</div>
</div>
</div>
<div className="text-center text-xl text-black">Create now</div>
</div>
);
frontend/src/home/index.tsx 0 → 100644
View file @ 9ec3dfc5
export { Home } from "./Home";
frontend/src/index.tsx
View file @ 9ec3dfc5
import React from "react";
import "tailwindcss/tailwind.css";
import { createRoot } from "react-dom/client";
import { App } from "./App";
import { SurveyRouter } from "./SurveyRouter";
const container = document.getElementById("root");
const root = createRoot(container!);
root.render(
<React.StrictMode>
<App />
<SurveyRouter />
</React.StrictMode>
);
frontend/webpack.dev.js
View file @ 9ec3dfc5
......@@ -6,5 +6,5 @@ const common = require("./webpack.common.js");
module.exports = merge(common, {
mode: "development",
devtool: "inline-source-map",
devServer: {},
devServer: { historyApiFallback: true },
});
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