feat: 🎸 editorconfig + prettier + git-cz + next-seo

.editorconfig

@@ -0,0 +1,12 @@
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

.eslintignore

@@ -0,0 +1,5 @@
+node_modules
+.next
+yarn.lock
+public
+build

.eslintrc

@@ -1,3 +1,7 @@
 {
-  "extends": ["next", "next/core-web-vitals"]
+  "extends": ["next", "next/core-web-vitals", "plugin:prettier/recommended"],
+  "plugins": ["prettier"],
+  "rules": {
+    "prettier/prettier": "error"
+  }
 }

.prettierrc

@@ -0,0 +1,4 @@
+{
+  "singleQuote": true,
+  "semi": false
+}

.versionrc.json

@@ -0,0 +1,56 @@
+{
+  "types": [
+    {
+      "type": "chore",
+      "section": "ビルドプロセスまたは補助ツールの変更",
+      "hidden": false
+    },
+    {
+      "type": "feat",
+      "section": "機能の追加",
+      "hidden": false
+    },
+    {
+      "type": "fix",
+      "section": "バグ修正",
+      "hidden": false
+    },
+    {
+      "type": "docs",
+      "section": "ドキュメントの変更",
+      "hidden": false
+    },
+    {
+      "type": "style",
+      "section": "コードスタイルの変更",
+      "hidden": false
+    },
+    {
+      "type": "refactor",
+      "section": "リファクタリング",
+      "hidden": false
+    },
+    {
+      "type": "perf",
+      "section": "パフォーマンスの向上",
+      "hidden": false
+    },
+    {
+      "type": "ci",
+      "section": "CI関連",
+      "hidden": false
+    },
+    {
+      "type": "config",
+      "section": "設定ファイルの更新",
+      "hidden": false
+    },
+    {
+      "type": "package",
+      "section": "依存関係の更新",
+      "hidden": false
+    }
+  ],
+
+  "releaseCommitMessageFormat": "release: 🔖 v{{currentTag}}"
+}

changelog.config.js

@@ -0,0 +1,94 @@
+module.exports = {
+  // Emojiを非表示にするか
+  disableEmoji: false,
+
+  // types一覧
+  // 入れる値は、typesのvalueプロパティで指定した値
+  list: [
+    'feat',
+    'fix',
+    'chore',
+    'docs',
+    'refactor',
+    'style',
+    'ci',
+    'perf',
+    'config',
+    'package',
+  ],
+
+  // コミットメッセージの最大文字数
+  maxMessageLength: 64,
+
+  // コミットメッセージの最小文字数
+  minMessageLength: 3,
+
+  // 質問の種類
+  questions: [
+    'type',
+    'scope',
+    'subject',
+    'body',
+    'breaking',
+    'issues',
+    'lerna',
+  ],
+
+  // scopesの種類
+  scopes: [],
+
+  // typesの種類を設定する
+  types: {
+    chore: {
+      description: 'ビルドプロセスまたは補助ツールの変更',
+      emoji: '🤖',
+      value: 'chore',
+    },
+    ci: {
+      description: 'CI関連の変更',
+      emoji: '🎡',
+      value: 'ci',
+    },
+    docs: {
+      description: 'ドキュメントの変更のみ',
+      emoji: '✏️',
+      value: 'docs',
+    },
+    feat: {
+      description: '新機能の追加や更新',
+      emoji: '🎸',
+      value: 'feat',
+    },
+    fix: {
+      description: 'バグ修正',
+      emoji: '🐛',
+      value: 'fix',
+    },
+    perf: {
+      description: 'パフォーマンスを向上させるコード変更',
+      emoji: '⚡️',
+      value: 'perf',
+    },
+    refactor: {
+      description: 'リファクタリング',
+      emoji: '💡',
+      value: 'refactor',
+    },
+    style: {
+      description:
+        'マークアップ、ホワイトスペース、フォーマット、セミコロンなどの修正',
+      emoji: '💄',
+      value: 'style',
+    },
+    config: {
+      description: '設定ファイルの追加・修正',
+      emoji: '⚙️',
+      value: 'config',
+    },
+    package: {
+      description: 'パッケージの追加・更新・削除',
+      emoji: '📦',
+      value: 'package',
+    },
+  },
+}

components/Layout.tsx

@@ -0,0 +1,9 @@
+import React from 'react'
+
+type Props = {
+  children?: React.ReactNode
+}
+
+export const Layout: React.FC<Props> = ({ children }) => {
+  return <div>{children}</div>
+}

next-env.d.ts

@@ -1,2 +1,3 @@
-/// <reference types="next" />
-/// <reference types="next/types/global" />
+/// <reference types="next" />
+/// <reference types="next/types/global" />
+/// <reference types="next/image-types/global" />

next-seo.config.js

@@ -0,0 +1,12 @@
+const config = {
+  openGraph: {
+    type: 'website',
+    locale: 'ja',
+    site_name: 'Wantedly',
+  },
+  twitter: {
+    cardType: 'summary_large_image',
+  },
+}
+
+export default config

next.config.js

@@ -1,3 +1,5 @@
-module.exports = {
+const config = {
   reactStrictMode: true,
 }
+
+module.exports = config

package.json

@@ -3,20 +3,27 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "dev": "next dev",
-    "build": "next build",
-    "start": "next start",
-    "lint": "next lint"
+    "start": "next dev",
+    "lint": "next lint",
+    "format": "prettier . --write --ignore-path .eslintignore",
+    "release:patch": "standard-version --release-as patch",
+    "release:minor": "standard-version --release-as minor",
+    "release:major": "standard-version --release-as major"
   },
   "dependencies": {
     "next": "11.0.1",
+    "next-seo": "^4.26.0",
     "react": "17.0.2",
     "react-dom": "17.0.2"
   },
   "devDependencies": {
     "@types/react": "17.0.11",
     "eslint": "7.29.0",
     "eslint-config-next": "11.0.1",
+    "eslint-config-prettier": "^8.3.0",
+    "eslint-plugin-prettier": "^3.4.0",
+    "prettier": "^2.3.1",
+    "standard-version": "^9.3.0",
     "typescript": "4.3.4"
   }
 }

pages/_app.tsx

@@ -1,7 +1,17 @@
-import '../styles/globals.css'
 import type { AppProps } from 'next/app'
+import Head from 'next/head'
+import { DefaultSeo } from 'next-seo'
+import SEO from '../next-seo.config'
 
-function MyApp({ Component, pageProps }: AppProps) {
-  return <Component {...pageProps} />
+const App = ({ Component, pageProps }: AppProps) => {
+  return (
+    <>
+      <Head>
+        <meta name="viewport" content="initial-scale=1.0, width=device-width" />
+      </Head>
+      <DefaultSeo {...SEO} />
+      <Component {...pageProps} />
+    </>
+  )
 }
-export default MyApp
+export default App

pages/index.tsx

@@ -1,69 +1,16 @@
-import Head from 'next/head'
-import Image from 'next/image'
-import styles from '../styles/Home.module.css'
+import React from 'react'
+import { Layout } from '../components/Layout'
+import { NextSeo } from 'next-seo'
 
-export default function Home() {
+const Home: React.FC = () => {
   return (
-    <div className={styles.container}>
-      <Head>
-        <title>Create Next App</title>
-        <meta name="description" content="Generated by create next app" />
-        <link rel="icon" href="/favicon.ico" />
-      </Head>
-
-      <main className={styles.main}>
-        <h1 className={styles.title}>
-          Welcome to <a href="https://nextjs.org">Next.js!</a>
-        </h1>
-
-        <p className={styles.description}>
-          Get started by editing{' '}
-          <code className={styles.code}>pages/index.js</code>
-        </p>
-
-        <div className={styles.grid}>
-          <a href="https://nextjs.org/docs" className={styles.card}>
-            <h2>Documentation &rarr;</h2>
-            <p>Find in-depth information about Next.js features and API.</p>
-          </a>
-
-          <a href="https://nextjs.org/learn" className={styles.card}>
-            <h2>Learn &rarr;</h2>
-            <p>Learn about Next.js in an interactive course with quizzes!</p>
-          </a>
-
-          <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
-            className={styles.card}
-          >
-            <h2>Examples &rarr;</h2>
-            <p>Discover and deploy boilerplate example Next.js projects.</p>
-          </a>
-
-          <a
-            href="https://vercel.com/new?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
-            className={styles.card}
-          >
-            <h2>Deploy &rarr;</h2>
-            <p>
-              Instantly deploy your Next.js site to a public URL with Vercel.
-            </p>
-          </a>
-        </div>
-      </main>
-
-      <footer className={styles.footer}>
-        <a
-          href="https://vercel.com?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Powered by{' '}
-          <span className={styles.logo}>
-            <Image src="/vercel.svg" alt="Vercel Logo" width={72} height={16} />
-          </span>
-        </a>
-      </footer>
-    </div>
+    <Layout>
+      <NextSeo
+        title="Wantedly"
+        description="Wantedly Frontend Internship 選考課題"
+      />
+    </Layout>
   )
 }
+
+export default Home