From a28a4b75feaa6d1aa6ae9b0385a44f80e62cafb3 Mon Sep 17 00:00:00 2001 From: kimkh05 Date: Wed, 3 Apr 2024 15:27:15 +0900 Subject: [PATCH] chore: file setting --- src/app/layout.tsx | 28 +++--- src/app/page.tsx | 113 ++-------------------- src/shared/apis/core/axios.ts | 2 +- src/shared/apis/core/index.ts | 2 +- src/shared/atoms/index.ts | 1 + src/shared/atoms/theme.ts | 8 ++ src/shared/hooks/index.ts | 1 + src/shared/hooks/useTheme.ts | 13 +++ src/shared/index.ts | 2 + src/shared/styles/globals.css | 161 ++++++++++++++++++++++++++++---- src/shared/ui/header/Header.tsx | 9 ++ src/shared/ui/header/index.ts | 1 + src/shared/ui/index.ts | 1 + src/views/home/Home.tsx | 9 ++ src/views/home/index.ts | 1 + src/views/index.ts | 1 + src/widgets/index.ts | 0 17 files changed, 212 insertions(+), 141 deletions(-) create mode 100644 src/shared/atoms/index.ts create mode 100644 src/shared/atoms/theme.ts create mode 100644 src/shared/hooks/useTheme.ts create mode 100644 src/shared/ui/header/Header.tsx create mode 100644 src/shared/ui/header/index.ts create mode 100644 src/shared/ui/index.ts create mode 100644 src/views/home/Home.tsx create mode 100644 src/views/home/index.ts create mode 100644 src/views/index.ts create mode 100644 src/widgets/index.ts diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 3314e47..6357c13 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,22 +1,22 @@ -import type { Metadata } from "next"; -import { Inter } from "next/font/google"; -import "./globals.css"; - -const inter = Inter({ subsets: ["latin"] }); +import type { Metadata } from 'next'; +import '@/shared/styles/globals.css'; +import type { ReactNode } from 'react'; export const metadata: Metadata = { - title: "Create Next App", - description: "Generated by create next app", + title: 'Create Next App', + description: 'Generated by create next app', }; -export default function RootLayout({ - children, -}: Readonly<{ - children: React.ReactNode; -}>) { +interface Props { + children: ReactNode; +} + +const RootLayout = ({ children }: Readonly) => { return ( - {children} + {children} ); -} +}; + +export default RootLayout; diff --git a/src/app/page.tsx b/src/app/page.tsx index 1edf3e4..f8c491c 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,108 +1,11 @@ -import Image from 'next/image'; +import { HomePage } from '@/views'; -export default function Home() { +const Home = () => { return ( -
-
-

- Get started by editing  - src/app/page.tsx -

-
- - By{' '} - Vercel Logo - -
-
- -
- Next.js Logo -
- -
- -

- Docs{' '} - - -> - -

-

- Find in-depth information about Next.js features and API. -

- - - -

- Learn{' '} - - -> - -

-

- Learn about Next.js in an interactive course with quizzes! -

- - - -

- Templates{' '} - - -> - -

-

- Explore starter templates for Next.js. -

- - - -

- Deploy{' '} - - -> - -

-

- Instantly deploy your Next.js site to a shareable URL with Vercel. -

- -
-
+ <> + + ); -} +}; + +export default Home; diff --git a/src/shared/apis/core/axios.ts b/src/shared/apis/core/axios.ts index c295801..71c6e9b 100644 --- a/src/shared/apis/core/axios.ts +++ b/src/shared/apis/core/axios.ts @@ -3,4 +3,4 @@ import axios from 'axios'; export const instance = axios.create({ baseURL: '', timeout: 5000, -}); \ No newline at end of file +}); diff --git a/src/shared/apis/core/index.ts b/src/shared/apis/core/index.ts index c2912b0..2466ac8 100644 --- a/src/shared/apis/core/index.ts +++ b/src/shared/apis/core/index.ts @@ -1 +1 @@ -export * from './axios'; \ No newline at end of file +export * from './axios'; diff --git a/src/shared/atoms/index.ts b/src/shared/atoms/index.ts new file mode 100644 index 0000000..7b1f54e --- /dev/null +++ b/src/shared/atoms/index.ts @@ -0,0 +1 @@ +export * from './theme'; diff --git a/src/shared/atoms/theme.ts b/src/shared/atoms/theme.ts new file mode 100644 index 0000000..42fa2c5 --- /dev/null +++ b/src/shared/atoms/theme.ts @@ -0,0 +1,8 @@ +import { atom } from 'recoil'; + +export type Theme = 'light' | 'dark'; + +export const themeAtom = atom({ + key: 'theme', + default: 'light', +}); diff --git a/src/shared/hooks/index.ts b/src/shared/hooks/index.ts index e69de29..f637b7a 100644 --- a/src/shared/hooks/index.ts +++ b/src/shared/hooks/index.ts @@ -0,0 +1 @@ +export { useTheme } from './useTheme'; diff --git a/src/shared/hooks/useTheme.ts b/src/shared/hooks/useTheme.ts new file mode 100644 index 0000000..a68a3f4 --- /dev/null +++ b/src/shared/hooks/useTheme.ts @@ -0,0 +1,13 @@ +import { useRecoilState } from 'recoil'; +import type { Theme } from '..'; +import { themeAtom } from '..'; + +export const useTheme = () => { + const [theme, setTheme] = useRecoilState(themeAtom); + + const handleToggleTheme = () => { + setTheme((t) => (t === 'light' ? 'dark' : 'light')); + }; + + return { theme, handleToggleTheme }; +}; diff --git a/src/shared/index.ts b/src/shared/index.ts index c6737e0..7fc1c15 100644 --- a/src/shared/index.ts +++ b/src/shared/index.ts @@ -2,3 +2,5 @@ export * from './apis'; export * from './assets'; export * from './hooks'; export * from './utils'; +export * from './ui'; +export * from './atoms'; diff --git a/src/shared/styles/globals.css b/src/shared/styles/globals.css index e6e74df..59b99d2 100644 --- a/src/shared/styles/globals.css +++ b/src/shared/styles/globals.css @@ -2,28 +2,149 @@ @tailwind components; @tailwind utilities; -:root { - --foreground-rgb: 0, 0, 0; - --background-start-rgb: 214, 219, 220; - --background-end-rgb: 255, 255, 255; +html, +body, +div, +span, +applet, +object, +iframe, +p, +blockquote, +pre, +a, +abbr, +acronym, +address, +big, +cite, +code, +del, +dfn, +em, +img, +ins, +kbd, +q, +s, +samp, +small, +strike, +strong, +sub, +sup, +tt, +var, +b, +u, +i, +center, +dl, +dt, +dd, +ol, +ul, +li, +fieldset, +form, +label, +legend, +table, +caption, +tbody, +tfoot, +thead, +tr, +th, +td, +article, +aside, +canvas, +details, +embed, +figure, +figcaption, +footer, +header, +hgroup, +menu, +nav, +output, +ruby, +section, +summary, +time, +mark, +audio, +video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; + box-sizing: border-box; } - -@media (prefers-color-scheme: dark) { - :root { - --foreground-rgb: 255, 255, 255; - --background-start-rgb: 0, 0, 0; - --background-end-rgb: 0, 0, 0; - } +sup { + vertical-align: super; + font-size: 13px; +} +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +menu, +nav, +section { + display: block; } - body { - color: rgb(var(--foreground-rgb)); - background: linear-gradient(to bottom, transparent, rgb(var(--background-end-rgb))) - rgb(var(--background-start-rgb)); + line-height: 1; } - -@layer utilities { - .text-balance { - text-wrap: balance; - } +select { + text-align-last: center; + text-align: center; + -ms-text-align-last: center; + -moz-text-align-last: center; +} +ol, +ul { + list-style: none; +} +blockquote, +q { + quotes: none; +} +blockquote:before, +blockquote:after, +q:before, +q:after { + content: ''; + content: none; +} +table { + border-collapse: collapse; + border-spacing: 0; +} +button { + border: 0; +} +input, +textarea { + border: 0; + padding: 0; + outline: 0; + box-sizing: border-box; + background-color: transparent; +} +a { + color: black; + text-decoration: none; +} +* { + box-sizing: border-box; } diff --git a/src/shared/ui/header/Header.tsx b/src/shared/ui/header/Header.tsx new file mode 100644 index 0000000..6018c79 --- /dev/null +++ b/src/shared/ui/header/Header.tsx @@ -0,0 +1,9 @@ +const Header = () => { + return ( +
+ Hi +
+ ); +}; + +export default Header; diff --git a/src/shared/ui/header/index.ts b/src/shared/ui/header/index.ts new file mode 100644 index 0000000..5653319 --- /dev/null +++ b/src/shared/ui/header/index.ts @@ -0,0 +1 @@ +export { default as Header } from './Header'; diff --git a/src/shared/ui/index.ts b/src/shared/ui/index.ts new file mode 100644 index 0000000..677ca79 --- /dev/null +++ b/src/shared/ui/index.ts @@ -0,0 +1 @@ +export * from './header'; diff --git a/src/views/home/Home.tsx b/src/views/home/Home.tsx new file mode 100644 index 0000000..2972a28 --- /dev/null +++ b/src/views/home/Home.tsx @@ -0,0 +1,9 @@ +const HomePage = () => { + return ( + <> + Test Page + + ); +}; + +export default HomePage; diff --git a/src/views/home/index.ts b/src/views/home/index.ts new file mode 100644 index 0000000..f4f7453 --- /dev/null +++ b/src/views/home/index.ts @@ -0,0 +1 @@ +export { default as HomePage } from './Home'; diff --git a/src/views/index.ts b/src/views/index.ts new file mode 100644 index 0000000..e20557b --- /dev/null +++ b/src/views/index.ts @@ -0,0 +1 @@ +export * from './home'; diff --git a/src/widgets/index.ts b/src/widgets/index.ts new file mode 100644 index 0000000..e69de29