Feat: Main page 구현

.eslintrc.json

@@ -0,0 +1,16 @@
+{
+  "extends": "next/core-web-vitals",
+  "env": {
+    "es2024": true
+  },
+  "parserOptions": {
+    "ecmaVersion": "latest",
+    "sourceType": "module"
+  },
+  "plugins": [
+    "unicorn"
+  ],
+  "rules": {
+    "unicorn/better-regex": "error"
+  }
+}

.github/workflows/review-assign-action.yml

@@ -0,0 +1,50 @@
+name: Review Assign
+
+on:
+  pull_request:
+    types: [opened, ready_for_review]
+
+jobs:
+  assign:
+    permissions:
+      actions: write
+      checks: write
+      contents: write
+      deployments: write
+      discussions: write
+      issues: write
+      id-token: read
+      packages: write
+      pages: write
+      pull-requests: write
+      repository-projects: write
+      security-events: write
+      statuses: write
+    runs-on: ubuntu-latest
+    steps:
+      - if: github.base_ref == 'main' # base branch name is 'master'
+        run: echo REVIEWERS=inseong-so >> $GITHUB_ENV
+      - if: startsWith(github.base_ref, 'team1')
+        run: echo REVIEWERS=headring, KimHunJin, hyjoong her0707 >> $GITHUB_ENV
+      - if: startsWith(github.base_ref, 'team2')
+        run: echo REVIEWERS=Bsfla, SeolJaeHyeok, choisy9619, kyung-jun >> $GITHUB_ENV
+      - if: startsWith(github.base_ref, 'team3')
+        run: echo REVIEWERS=sgsg9447, kingyong9169, 2dowon, jqkk >> $GITHUB_ENV
+      - if: startsWith(github.base_ref, 'team4')
+        run: echo REVIEWERS=kimseongchan-kr, cham0287, hyeon9782 >> $GITHUB_ENV
+      - if: startsWith(github.base_ref, 'team5')
+        run: echo REVIEWERS=2-NOW, hyew-kim, geeonie >> $GITHUB_ENV
+      - if: startsWith(github.base_ref, 'team6')
+        run: echo REVIEWERS=areumsheep, ludacirs, innocarpe >> $GITHUB_ENV
+      - if: startsWith(github.base_ref, 'team7')
+        run: echo REVIEWERS=endmoseung, steven-yn, ding-co, mandarin-sep >> $GITHUB_ENV
+      - if: startsWith(github.base_ref, 'team8')
+        run: echo REVIEWERS=HOJOON07, jiji-hoon96, 71summernight, seung-wan >> $GITHUB_ENV
+      - if: startsWith(github.base_ref, 'team9')
+        run: echo REVIEWERS=Siihyun, hhhminme, 0uizi0, brgndyy >> $GITHUB_ENV
+      - if: startsWith(github.base_ref, 'team10')
+        run: echo REVIEWERS=Leejha, steadily-worked >> $GITHUB_ENV
+      - uses: hkusu/review-assign-action@v1
+        with:
+          assignees: ${{ github.actor }}
+          reviewers: ${{ env.REVIEWERS }}

.gitignore

@@ -128,3 +128,6 @@ dist
 .yarn/build-state.yml
 .yarn/install-state.gz
 .pnp.*
+
+# editor setting file
+.idea

.prettierrc.json

@@ -0,0 +1,11 @@
+{
+  "singleQuote": true,
+  "semi": true,
+  "useTabs": false,
+  "tabWidth": 2,
+  "trailingComma": "all",
+  "printWidth": 100,
+  "bracketSpacing": true,
+  "arrowParens": "always",
+  "endOfLine": "auto"
+}

README.md

@@ -1,4 +1,4 @@
-# ![RealWorld Example App](./assets/logo.png)
+# ![RealWorld Example App](src/app/logo.png)
 
 > ### [YOUR_FRAMEWORK] codebase containing real world examples (CRUD, auth, advanced patterns, etc) that adheres to the [RealWorld](https://github.com/gothinkster/realworld) spec and API.
 

next-env.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="next" />
+/// <reference types="next/image-types/global" />
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/basic-features/typescript for more information.

next.config.js

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

package.json

@@ -13,10 +13,25 @@
     "react",
     "pagers"
   ],
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "next lint"
+  },
+  "dependencies": {
+    "next": "13.4.19",
+    "react": "18.2.0",
+    "react-dom": "18.2.0"
+  },
+  "engines": {
+    "node": ">= 18.0.0",
+    "yarn": ">=1.10.0"
+  },
   "author": {
-    "name": "InSeong-So",
-    "email": "goflvhxj2547@gmail.com",
-    "url": "https://github.com/inseong-so"
+    "name": "HyewonKim",
+    "email": "gpdnjs861@naver.com",
+    "url": "https://github.com/hyew-kim"
   },
   "devEngines": {
     "node": "16.x || 18.x || 19.x || 20.x"
@@ -25,5 +40,15 @@
   "bugs": {
     "url": "https://github.com/pagers-org/react-world/issues"
   },
-  "homepage": "https://github.com/pagers-org/react-world#readme"
+  "homepage": "https://github.com/pagers-org/react-world#readme",
+  "devDependencies": {
+    "typescript": "5.2.2",
+    "@types/node": "20.5.9",
+    "@types/react": "18.2.21",
+    "@types/react-dom": "18.2.7",
+    "eslint": "8.48.0",
+    "eslint-config-next": "13.4.19",
+    "eslint-plugin-unicorn": "^48.0.1",
+    "prettier": "^3.0.2"
+  }
 }

src/app/layout.tsx

@@ -0,0 +1,17 @@
+import type { Metadata } from 'next';
+import { Inter } from 'next/font/google';
+
+const inter = Inter({ subsets: ['latin'] });
+
+export const metadata: Metadata = {
+  title: 'RealWorld',
+  description: 'RealWorld - Generated by NextJS',
+};
+
+export default function RootLayout({ children }: { children: React.ReactNode }) {
+  return (
+    <html lang="en">
+      <body className={inter.className}>{children}</body>
+    </html>
+  );
+}

src/app/login/page.tsx

@@ -0,0 +1,3 @@
+export default function LoginPage() {
+  return <main>LOGIN</main>;
+}

src/app/page.tsx

@@ -0,0 +1,138 @@
+import '@/styles/main.css';
+import Nav from '@/component/Nav';
+import Footer from '@/component/Footer';
+export default function Home() {
+  return (
+    <>
+      <Nav />
+      <main className="home-page">
+        <div className="banner">
+          <div className="container">
+            <h1 className="logo-font">conduit</h1>
+            <p>A place to share your knowledge.</p>
+          </div>
+        </div>
+
+        <div className="container page">
+          <div className="row">
+            <div className="col-md-9">
+              <div className="feed-toggle">
+                <ul className="nav nav-pills outline-active">
+                  <li className="nav-item">
+                    <a className="nav-link" href="">
+                      Your Feed
+                    </a>
+                  </li>
+                  <li className="nav-item">
+                    <a className="nav-link active" href="">
+                      Global Feed
+                    </a>
+                  </li>
+                </ul>
+              </div>
+
+              <div className="article-preview">
+                <div className="article-meta">
+                  <a href="/profile/eric-simons">
+                    <img src="http://i.imgur.com/Qr71crq.jpg" />
+                  </a>
+                  <div className="info">
+                    <a href="/profile/eric-simons" className="author">
+                      Eric Simons
+                    </a>
+                    <span className="date">January 20th</span>
+                  </div>
+                  <button className="btn btn-outline-primary btn-sm pull-xs-right">
+                    <i className="ion-heart"></i> 29
+                  </button>
+                </div>
+                <a href="/article/how-to-build-webapps-that-scale" className="preview-link">
+                  <h1>How to build webapps that scale</h1>
+                  <p>This is the description for the post.</p>
+                  <span>Read more...</span>
+                  <ul className="tag-list">
+                    <li className="tag-default tag-pill tag-outline">realworld</li>
+                    <li className="tag-default tag-pill tag-outline">implementations</li>
+                  </ul>
+                </a>
+              </div>
+
+              <div className="article-preview">
+                <div className="article-meta">
+                  <a href="/profile/albert-pai">
+                    <img src="http://i.imgur.com/N4VcUeJ.jpg" />
+                  </a>
+                  <div className="info">
+                    <a href="/profile/albert-pai" className="author">
+                      Albert Pai
+                    </a>
+                    <span className="date">January 20th</span>
+                  </div>
+                  <button className="btn btn-outline-primary btn-sm pull-xs-right">
+                    <i className="ion-heart"></i> 32
+                  </button>
+                </div>
+                <a href="/article/the-song-you" className="preview-link">
+                  <h1>The song you won&apos;t ever stop singing. No matter how hard you try.</h1>
+                  <p>This is the description for the post.</p>
+                  <span>Read more...</span>
+                  <ul className="tag-list">
+                    <li className="tag-default tag-pill tag-outline">realworld</li>
+                    <li className="tag-default tag-pill tag-outline">implementations</li>
+                  </ul>
+                </a>
+              </div>
+
+              <ul className="pagination">
+                <li className="page-item active">
+                  <a className="page-link" href="">
+                    1
+                  </a>
+                </li>
+                <li className="page-item">
+                  <a className="page-link" href="">
+                    2
+                  </a>
+                </li>
+              </ul>
+            </div>
+
+            <div className="col-md-3">
+              <div className="sidebar">
+                <p>Popular Tags</p>
+
+                <div className="tag-list">
+                  <a href="" className="tag-pill tag-default">
+                    programming
+                  </a>
+                  <a href="" className="tag-pill tag-default">
+                    javascript
+                  </a>
+                  <a href="" className="tag-pill tag-default">
+                    emberjs
+                  </a>
+                  <a href="" className="tag-pill tag-default">
+                    angularjs
+                  </a>
+                  <a href="" className="tag-pill tag-default">
+                    react
+                  </a>
+                  <a href="" className="tag-pill tag-default">
+                    mean
+                  </a>
+                  <a href="" className="tag-pill tag-default">
+                    node
+                  </a>
+                  <a href="" className="tag-pill tag-default">
+                    rails
+                  </a>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/register/page.tsx

@@ -0,0 +1,3 @@
+export default function RegisterPage() {
+  return <main>REGISTER</main>;
+}

src/component/Footer.tsx

@@ -0,0 +1,15 @@
+export default function Footer() {
+  return (
+    <footer>
+      <div className="container">
+        <a href="/" className="logo-font">
+          conduit
+        </a>
+        <span className="attribution">
+          An interactive learning project from <a href="https://thinkster.io">Thinkster</a>. Code
+          &amp; design licensed under MIT.
+        </span>
+      </div>
+    </footer>
+  );
+}

src/component/Nav.tsx

@@ -0,0 +1,30 @@
+import Link from 'next/link';
+
+export default function Nav() {
+  return (
+    <nav className="navbar navbar-light">
+      <div className="container">
+        <a className="navbar-brand" href="/">
+          conduit
+        </a>
+        <ul className="nav navbar-nav pull-xs-right">
+          <li className="nav-item">
+            <Link className="nav-link active" href="/">
+              Home
+            </Link>
+          </li>
+          <li className="nav-item">
+            <Link className="nav-link" href="/login">
+              Sign in
+            </Link>
+          </li>
+          <li className="nav-item">
+            <Link className="nav-link" href="/register">
+              Sign up
+            </Link>
+          </li>
+        </ul>
+      </div>
+    </nav>
+  );
+}