first

.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": ["next/babel","next/core-web-vitals"]
+}

.gitignore

@@ -0,0 +1,36 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

components/Layout/Main.jsx

@@ -0,0 +1,35 @@
+import React from 'react'
+
+const Main = () => {
+  return (
+    <div>
+      <div className="bg-[url('/images/10.jpg')] bg-cover opacity-80">
+          <div className="flex justify-center items-center min-h-screen text-xl font-extrabold ...">
+            <span className="text-center text-transparent opacity-100 bg-clip-text bg-text-center bg-gradient-to-r from-pink-200 to-gray-200">
+              오늘 하루 어땠나요?<br/>털어놓기 힘든 고민 때문에 힘겨웠나요?<br/><br/>그렇다면 당신의 고민을 글로 적어보세요.<br/>혼자 애쓰지 않아도 괜찮아요.<br/>들어줄게요 당신이 괜찮아질 때까지.<br/><br/>뜻밖의 위로가 기다리고 있을 지도 몰라요.
+            </span>
+          </div>
+
+      {/* <div class="lg:w-full w-full bg-blue-0">
+       <div class="xxx_imgWrap flex flex-col my-auto items-center mx-3">
+          <div class="flex h-screen">
+             <div class="m-auto">
+                <img src="/images/1.jpg" width="140">
+             </div>
+          </div>
+       </div>
+       </div> */}
+      </div>
+
+        {/* 문구 그라데이션 */}
+      // {/* <div class="bg-gradient-to-r from-purple-900 to-pink-900"> */}
+      // {/* <div className="bg-fixed bg-pink-300 bg-center bg-repeat bg-cover"
+      // style={{backgroundImage: url(./images/1.jpg)}}">
+      //   style={{marginRight: spacing + 'em'}}
+      // </div> */}
+
+    // </div>
+  )
+}
+
+export default Main

components/Layout/Navbar.jsx

@@ -0,0 +1,113 @@
+import Link from 'next/link'
+import React from 'react'
+
+const Navbar = () => {
+  return (
+    <nav className="bg-violet-900">
+      <div className="px-2 mx-auto max-w-7xl sm:px-6 lg:px-8" />
+      <div className="relative flex items-center justify-between h-16">
+        <div className="absolute inset-y-0 left-0 flex items-center sm:hidden">
+          {/* <!-- Mobile menu button--> */}
+          <button type="button" className="inline-flex items-center justify-center p-2 text-gray-400 rounded-md hover:bg-gray-700 hover:text-white focus:outline-none focus:ring-2 focus:ring-inset focus:ring-white" aria-controls="mobile-menu" aria-expanded="false">
+            <span className="sr-only">Open main menu</span>
+            {/* <!--
+            Icon when menu is closed.
+
+            Heroicon name: outline/bars-3
+
+            Menu open: "hidden", Menu closed: "block"
+          --> */}
+            <svg className="block w-6 h-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" strokeWidth="1.5" stroke="currentColor" aria-hidden="true">
+              <path strokeLinecap="round" strokeLinejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" />
+            </svg>
+            {/* <!--
+            Icon when menu is open.
+
+            Heroicon name: outline/x-mark
+
+            Menu open: "block", Menu closed: "hidden"
+            --> */}
+            <svg className="hidden w-6 h-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" strokeWidth="1.5" stroke="currentColor" aria-hidden="true">
+              <path strokeLinecap="round" strokeLinejoin="round" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
+        </div>
+        <div className="flex items-center justify-center flex-1 sm:items-stretch sm:justify-start">
+          <div className="flex items-center flex-shrink-0">
+            <Link href="http://localhost:3000/" className="inline-flex items-center justify-center px-4 py-2 ml-3 mr-3 text-base font-extrabold text-gray-300 border border-transparent rounded-full shadow-sm whitespace-nowrap bg-violet-600 hover:bg-pink-300 hover:text-gray-600">
+                아띠의 고민 상담소
+            </Link>
+          </div>
+          <div className="hidden sm:ml-6 sm:block">
+            <div className="flex space-x-4">
+              {/* <!-- Current: "bg-gray-900 text-white", Default: "text-gray-300 hover:bg-gray-700 hover:text-white" --> */}
+              <Link href="/Board" className="px-3 py-2 text-sm font-semibold text-gray-300 rounded-md hover:bg-pink-300 hover:text-white hover:font-extrabold">직업</Link>
+
+              <Link href="/Board" className="px-3 py-2 text-sm font-semibold text-gray-300 rounded-md hover:bg-pink-300 hover:text-white hover:font-extrabold">대인관계</Link>
+
+              <Link href="/Board" className="px-3 py-2 text-sm font-semibold text-gray-300 rounded-md hover:bg-pink-300 hover:text-white hover:font-extrabold">가족</Link>
+
+              <Link href="/Board" className="px-3 py-2 text-sm font-semibold text-gray-300 rounded-md hover:bg-pink-300 hover:text-white hover:font-extrabold">연애</Link>
+
+              <Link href="/Board" className="px-3 py-2 text-sm font-semibold text-gray-300 rounded-md hover:bg-pink-300 hover:text-white hover:font-extrabold">잡담</Link>
+            </div>
+          </div>
+        </div>
+        <div className="absolute inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto sm:ml-6 sm:pr-0">
+
+            <span className="sr-only">View notifications</span>
+            {/* <!-- Heroicon name: outline/bell --> */}
+
+
+
+          {/* <!-- Profile dropdown --> */}
+          <div className="relative ml-3">
+
+
+            {/* <!--
+            Dropdown menu, show/hide based on menu state.
+
+            Entering: "transition ease-out duration-100"
+              From: "transform opacity-0 scale-95"
+              To: "transform opacity-100 scale-100"
+            Leaving: "transition ease-in duration-75"
+              From: "transform opacity-100 scale-100"
+              To: "transform opacity-0 scale-95"
+          --> */}
+            <div className="items-center justify-end hidden md:flex md:flex-1 lg:w-0">
+            <Link href="/auth/SignIn" className="block px-3 py-2 text-base font-bold text-gray-300 rounded-md hover:bg-pink-300 hover:text-white">
+              Login
+            </Link>
+            <Link href="/auth/SignUp" className="inline-flex items-center justify-center px-4 py-2 ml-3 mr-3 text-base font-bold text-gray-300 border border-transparent rounded-md shadow-sm whitespace-nowrap bg-violet-500 hover:bg-indigo-700 hover:text-white">
+              Join
+            </Link>
+          </div>
+          </div>
+        </div>
+      </div>
+
+
+   {/* <!-- Mobile menu, show/hide based on menu state. 모바일모드. 반응형으로 줄어들었을 때 사용 -->  */}
+  <div className="sm:hidden" id="mobile-menu">
+    <div className="px-2 pt-2 pb-3 space-y-1">
+       {/* <!-- Current: "bg-gray-900 text-white", Default: "text-gray-300 hover:bg-gray-700 hover:text-white" --> */}
+      <Link href="/Board" className="block px-3 py-2 font-bold text-center text-gray-300 rounded-md hover:bg-pink-300 hover:text-white hover:font-extrabold">직업</Link>
+
+      <Link href="/Board" className="block px-3 py-2 font-bold text-center text-gray-300 rounded-md hover:bg-pink-300 hover:text-white hover:font-extrabold">대인관계</Link>
+
+      <Link href="/Board" className="block px-3 py-2 font-bold text-center text-gray-300 rounded-md hover:bg-pink-300 hover:text-white hover:font-extrabold">가족</Link>
+
+      <Link href="/Board" className="block px-3 py-2 font-bold text-center text-gray-300 rounded-md hover:bg-pink-300 hover:text-white hover:font-extrabold">연애</Link>
+
+      <Link href="/Board" className="block px-3 py-2 font-bold text-center text-gray-300 rounded-md hover:bg-pink-300 hover:text-white hover:font-extrabold">잡담</Link>
+
+      <Link href="/auth/SignIn" className="block px-3 py-2 font-bold text-center text-gray-300 rounded-md hover:bg-pink-300 hover:text-white hover:font-extrabold">Login</Link>
+
+      <Link href="/auth/SignUp" className="block px-3 py-2 font-bold text-center text-gray-300 rounded-md hover:bg-pink-300 hover:text-white hover:font-extrabold">Join</Link>
+    </div>
+  </div>
+</nav >
+  )
+}
+
+export default Navbar

next.config.js

@@ -0,0 +1,6 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  reactStrictMode: true,
+}
+
+module.exports = nextConfig