Skip to content

Commit

Permalink
App router migration (#195)
Browse files Browse the repository at this point in the history
* chore: install next.js 14

* change eslintrc file name

* feat: create StyledComponentRegistry

* chore: update tsconfig path

* chore: remove eslint config import

* chore(WIP): move to app router

* chore: move folder

* chore: update layout

* update layout

* [WIP] migrating

* fix error on postdetail

* switch Post Detail to app router

* switch About to app router

* switch PS service to app router

* style: change style

* remove unused files

* rename

* upgrade packages

* w
  • Loading branch information
loopy-dev authored Dec 21, 2023
1 parent 713b00a commit 60f25e1
Show file tree
Hide file tree
Showing 60 changed files with 3,701 additions and 2,477 deletions.
120 changes: 0 additions & 120 deletions .eslintrc

This file was deleted.

93 changes: 93 additions & 0 deletions .eslintrc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,93 @@
module.exports = {
env: {
browser: true,
node: true,
es6: true,
},
parser: '@typescript-eslint/parser',
parserOptions: {
ecmaFeatures: {
jsx: true,
},
tsconfigRootDir: './',
project: ['./tsconfig.json'],
},
extends: [
'next/core-web-vitals',
'eslint:recommended',
'plugin:@typescript-eslint/recommended',
'prettier',
],
plugins: ['@typescript-eslint', 'import', 'react', 'react-hooks'],
rules: {
'@typescript-eslint/array-type': ['error', { default: 'array-simple' }],
'@typescript-eslint/consistent-type-exports': [
'error',
{ fixMixedExportsWithInlineTypeSpecifier: false },
],
'@typescript-eslint/consistent-type-imports': [
'error',
{ prefer: 'type-imports' },
],
'@typescript-eslint/naming-convention': [
'error',
{
format: ['camelCase', 'PascalCase', 'UPPER_CASE'],
selector: 'variable',
},
{
format: ['camelCase', 'PascalCase'],
selector: 'function',
},
{
format: ['PascalCase'],
selector: 'typeLike',
},
],
'@typescript-eslint/no-explicit-any': 'off',
'@typescript-eslint/no-unused-vars': ['warn', { ignoreRestSiblings: true }],
'@typescript-eslint/no-use-before-define': 'off',
'no-console': ['warn', { allow: ['warn', 'error'] }],
radix: 'error',
'react/function-component-definition': [
'error',
{
namedComponents: 'arrow-function',
},
],
'react/jsx-props-no-spreading': 'off',
'react/jsx-max-props-per-line': [
'error',
{ maximum: 1, when: 'multiline' },
],
'react/jsx-no-useless-fragment': 'warn',
'react/jsx-sort-props': [
'error',
{
callbacksLast: true,
shorthandFirst: true,
multiline: 'last',
reservedFirst: true,
},
],
'react/no-unknown-property': ['error', { ignore: ['css'] }],
'react/prop-types': 'off',
'react/react-in-jsx-scope': 'off',
'react/require-default-props': 'off',
'react/self-closing-comp': 'error',
'spaced-comment': 'warn',
},
overrides: [
{
files: ['**/*.stories.*'],
rules: {
'import/no-anonymous-default-export': 'off',
},
},
],
settings: {
react: {
version: 'detect',
},
},
};
2 changes: 1 addition & 1 deletion .prettierrc → .prettierrc.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
{
module.exports = {
"singleQuote": true,
"semi": true,
"useTabs": false,
Expand Down
12 changes: 0 additions & 12 deletions next.config.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
/* eslint-disable @typescript-eslint/no-var-requires */
/** @type {import('next').NextConfig} */
const path = require('path');

const withBundleAnalyzer = require('@next/bundle-analyzer')({
enabled: process.env.ANALYZE === 'true',
Expand Down Expand Up @@ -32,17 +31,6 @@ const nextConfig = {
},
],
});

config.resolve = {
alias: {
'~': path.resolve(__dirname, 'src'),
'~components': path.resolve(__dirname, 'src/components'),
'~hooks': path.resolve(__dirname, 'src/hooks'),
'~models': path.resolve(__dirname, 'src/models'),
},
...config.resolve,
};

return config;
},
};
Expand Down
21 changes: 11 additions & 10 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,8 @@
"gist-react": "^1.0.1",
"js-base64": "^3.7.5",
"lottie-react": "^2.4.0",
"next": "^13.4.3",
"nanoid": "^5.0.4",
"next": "^14.0.4",
"octokit": "^2.0.14",
"react": "^18.2.0",
"react-dom": "^18.2.0",
Expand All @@ -39,7 +40,7 @@
"remark-parse-frontmatter": "^1.0.3",
"remark-stringify": "^10.0.2",
"slick-carousel": "^1.8.1",
"styled-components": "^5.3.8",
"styled-components": "^6.1.1",
"unified": "^10.1.2",
"uuid": "^9.0.0"
},
Expand All @@ -51,8 +52,8 @@
"@storybook/addon-links": "7.0.18",
"@storybook/addon-styling": "^1.3.0",
"@storybook/blocks": "7.0.18",
"@storybook/nextjs": "7.0.7",
"@storybook/react": "^7.0.7",
"@storybook/nextjs": "^7.6.6",
"@storybook/react": "^7.6.6",
"@storybook/testing-library": "^0.1.0",
"@svgr/webpack": "^6.5.1",
"@types/jest": "^29.5.1",
Expand All @@ -64,27 +65,27 @@
"@types/react-syntax-highlighter": "^15.5.6",
"@types/styled-components": "^5.1.26",
"@types/uuid": "^9.0.1",
"@typescript-eslint/eslint-plugin": "^5.48.2",
"@typescript-eslint/parser": "^5.48.2",
"@typescript-eslint/eslint-plugin": "^6.15.0",
"@typescript-eslint/parser": "^6.15.0",
"autoprefixer": "^10.4.13",
"babel-loader": "^8.3.0",
"cross-env": "^7.0.3",
"eslint": "8.32.0",
"eslint": "^8.56.0",
"eslint-config-next": "13.1.3",
"eslint-config-prettier": "^8.6.0",
"eslint-plugin-storybook": "^0.6.12",
"jest": "^29.5.0",
"jest-environment-jsdom": "^29.5.0",
"postcss": "^8.4.21",
"prettier": "^2.8.3",
"prettier": "^3.1.1",
"sass": "^1.57.1",
"storybook": "7.0.18",
"storybook": "^7.6.6",
"stylelint": "^15.6.0",
"stylelint-config-recommended-scss": "^11.0.0",
"stylelint-order": "^6.0.3",
"stylelint-scss": "^5.0.0",
"tailwindcss": "^3.2.4",
"typescript": "^5.0.4"
"typescript": "^5.3.3"
},
"eslintConfig": {
"extends": [
Expand Down
40 changes: 40 additions & 0 deletions src/app/(pages)/about/layout.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
import React from 'react';
import Head from 'next/head';
import GlobalLayout from '~components/layouts/GlobalLayout';
import { DEFAULT_PAGE_TITLE } from '~lib/constants';
import type { Metadata } from 'next';

const metadata: Metadata = {
title: `About Me - ${DEFAULT_PAGE_TITLE}`,
description: '프론트엔드 개발자 벤을 소개합니다.',
};

interface Props {
children?: React.ReactNode;
}

const Layout = (props: Props) => {
const { children } = props;

return (
<GlobalLayout>
<Head>
<title>About Me - {DEFAULT_PAGE_TITLE}</title>
<meta
key="title"
content={typeof metadata.title === 'string' ? metadata.title : ''}
property="og:title"
/>
<meta
key="description"
content={metadata.description ?? ''}
name="description"
property="og:description"
/>
</Head>
{children}
</GlobalLayout>
);
};

export default Layout;
27 changes: 27 additions & 0 deletions src/app/(pages)/about/page.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
import Link from 'next/link';
import ReduxProviderRegistry from '~lib/registry/redux';
import NotificationBar from '~components/NotificationBar';
import Resume from '~components/Resume';

const Page = () => {
return (
<ReduxProviderRegistry>
<NotificationBar>
<p>
Currently looking for a job.{' '}
<Link
href="mailto:[email protected]"
style={{ fontWeight: 'bold', textDecoration: 'underline' }}
>
Email
</Link>{' '}
me if you want to know more about me.
</p>
</NotificationBar>
{/** first part of main page, introduction */}
<Resume />
</ReduxProviderRegistry>
);
};

export default Page;
Loading

0 comments on commit 60f25e1

Please sign in to comment.