Skip to content

Commit 1438906

Browse files
committed
Update supports ESLint, Prettier, stylelint
ESLint, Prettier, stylelint導入 導入にともないlint実施、コード整形実施
1 parent 3373d7d commit 1438906

39 files changed

+1703
-900
lines changed

.eslintrc.json

+42
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
{
2+
"env": {
3+
"es6": true,
4+
"node": true,
5+
"browser": true,
6+
"commonjs": true
7+
},
8+
"parser": "@typescript-eslint/parser",
9+
"parserOptions": {
10+
"ecmaVersion": 2018,
11+
"ecmaFeatures": {
12+
"jsx": true
13+
},
14+
"sourceType": "module"
15+
},
16+
"settings": {
17+
"react": {
18+
"version": "detect"
19+
}
20+
},
21+
"plugins": ["react-hooks", "react", "@typescript-eslint"],
22+
"extends": [
23+
"eslint:recommended",
24+
"plugin:@typescript-eslint/eslint-recommended",
25+
"plugin:@typescript-eslint/recommended",
26+
"plugin:react/recommended",
27+
"plugin:react-hooks/recommended",
28+
"prettier"
29+
],
30+
"rules": {
31+
"react/prop-types": "off",
32+
"@typescript-eslint/explicit-module-boundary-types": "off"
33+
},
34+
"overrides": [
35+
{
36+
"files": ["*.ts", "*.tsx"],
37+
"rules": {
38+
"@typescript-eslint/explicit-module-boundary-types": ["error"]
39+
}
40+
}
41+
]
42+
}

.prettierrc.json

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"singleQuote": true,
3+
"jsxBracketSameLine": true
4+
}

components/ArticleFooter.tsx

+11-13
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,22 @@
1-
import { Tweet } from 'react-static-tweets'
1+
import React, { FC } from 'react';
2+
import { Tweet } from 'react-static-tweets';
23
import { GitHubIcon } from '../components/GitHubIcon';
34

4-
export const ArticleFooter = ({
5-
tweets
6-
}: any) => {
5+
interface Props {
6+
tweets: { id: string; ast: unknown }[];
7+
}
8+
9+
export const ArticleFooter: FC<Props> = ({ tweets }) => {
710
return (
811
<div className="my-6 md:my-10 bg-white rounded-lg shadow py-10 text-base">
912
<div className="max-w-screen-lg m-auto px-5 iphone:px-10">
10-
11-
{tweets
12-
.map((tweet: any) => {
13-
return (
14-
<Tweet key={tweet.id} id={tweet.id} ast={tweet.ast} />
15-
)
16-
})
17-
}
13+
{tweets.map((tweet) => {
14+
return <Tweet key={tweet.id} id={tweet.id} ast={tweet.ast} />;
15+
})}
1816

1917
<div className="ml-5 my-7 flex items-center">
2018
{/* GitHubアイコン */}
21-
<GitHubIcon/>
19+
<GitHubIcon />
2220
</div>
2321
</div>
2422
</div>

components/Code.tsx

+4-5
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,18 @@
1-
import React, { FunctionComponent } from 'react';
1+
import React, { FC } from 'react';
22
import { okaidia } from 'react-syntax-highlighter/dist/cjs/styles/prism';
33
import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';
44

55
interface Props {
66
language: string;
77
value: string;
88
}
9-
const Code: FunctionComponent<Props> = ({ language, value }) => {
9+
const Code: FC<Props> = ({ language, value }) => {
1010
return (
1111
<SyntaxHighlighter
1212
language={(language === 'js' ? 'javascript' : language) || 'javascript'}
13-
style={okaidia}
14-
>
13+
style={okaidia}>
1514
{value}
1615
</SyntaxHighlighter>
1716
);
1817
};
19-
export default Code;
18+
export default Code;

components/Footer.tsx

+23-8
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,38 @@
1-
import React from 'react';
1+
import React, { FC } from 'react';
22
import Image from 'next/image';
3-
import '../settings.d.ts'
3+
import '../settings.d.ts';
44
import settings from '../settings.yml';
55

6-
export const Footer = ({
7-
title
8-
}: any) => {
6+
export const Footer: FC = () => {
97
const date = new Date();
108
const footer_year = date.getFullYear();
119
return (
1210
<footer className="py-2 mb-1 bg-white">
1311
<div className="flex items-center justify-center text-xs md:text-sm text-gray-700">
14-
<div>©{footer_year} {settings.general[0].name} / <span className="hidden iphone:inline">produced by </span></div>
12+
<div>
13+
©{footer_year} {settings.general[0].name} /{' '}
14+
<span className="hidden iphone:inline">produced by </span>
15+
</div>
1516
<div className="h-4">
1617
<div style={{ position: 'relative', width: '50px', height: '100%' }}>
17-
<a className="text-gray-800 hover:text-pink-800" href={settings.general[0].company_url}><Image src={settings.general[0].company_logo} layout='fill' objectFit="contain"/></a>
18+
<a
19+
className="text-gray-800 hover:text-pink-800"
20+
href={settings.general[0].company_url}>
21+
<Image
22+
src={settings.general[0].company_logo}
23+
layout="fill"
24+
objectFit="contain"
25+
/>
26+
</a>
1827
</div>
1928
</div>
20-
<div><a className="text-gray-800 hover:text-pink-800" href={settings.general[0].company_url}>{settings.general[0].company_name}</a></div>
29+
<div>
30+
<a
31+
className="text-gray-800 hover:text-pink-800"
32+
href={settings.general[0].company_url}>
33+
{settings.general[0].company_name}
34+
</a>
35+
</div>
2136
</div>
2237
</footer>
2338
);

components/GitHubIcon.tsx

+22-10
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,35 @@
1-
import React from 'react';
2-
import '../settings.d.ts'
1+
import React, { FC } from 'react';
2+
import '../settings.d.ts';
33
import settings from '../settings.yml';
4-
import * as gtag from '../lib/gtag'
5-
6-
export const GitHubIcon = () => {
4+
import * as gtag from '../lib/gtag';
75

6+
export const GitHubIcon: FC = () => {
87
const handleClick = () => {
98
gtag.event({
109
action: 'Click',
1110
category: 'Share',
1211
label: 'GitHub',
1312
value: '0',
14-
})
15-
}
13+
});
14+
};
1615

1716
return (
18-
<a href={settings.general[0].github} rel="nofollow noopener noreferrer" target="_blank" data-tip="弊社GitHubページへ" onClick={handleClick}>
19-
<svg className="github-svg w-7 h-7 text-gray-500" fill="#6B7280" width="1024" height="1024" viewBox="0 0 1024 1024">
20-
<path d="M8 0C3.58 0 0 3.58 0 8C0 11.54 2.29 14.53 5.47 15.59C5.87 15.66 6.02 15.42 6.02 15.21C6.02 15.02 6.01 14.39 6.01 13.72C4 14.09 3.48 13.23 3.32 12.78C3.23 12.55 2.84 11.84 2.5 11.65C2.22 11.5 1.82 11.13 2.49 11.12C3.12 11.11 3.57 11.7 3.72 11.94C4.44 13.15 5.59 12.81 6.05 12.6C6.12 12.08 6.33 11.73 6.56 11.53C4.78 11.33 2.92 10.64 2.92 7.58C2.92 6.71 3.23 5.99 3.74 5.43C3.66 5.23 3.38 4.41 3.82 3.31C3.82 3.31 4.49 3.1 6.02 4.13C6.66 3.95 7.34 3.86 8.02 3.86C8.7 3.86 9.38 3.95 10.02 4.13C11.55 3.09 12.22 3.31 12.22 3.31C12.66 4.41 12.38 5.23 12.3 5.43C12.81 5.99 13.12 6.7 13.12 7.58C13.12 10.65 11.25 11.33 9.47 11.53C9.76 11.78 10.01 12.26 10.01 13.01C10.01 14.08 10 14.94 10 15.21C10 15.42 10.15 15.67 10.55 15.59C13.71 14.53 16 11.53 16 8C16 3.58 12.42 0 8 0Z" transform="scale(64)"/>
17+
<a
18+
href={settings.general[0].github}
19+
rel="nofollow noopener noreferrer"
20+
target="_blank"
21+
data-tip="弊社GitHubページへ"
22+
onClick={handleClick}>
23+
<svg
24+
className="github-svg w-7 h-7 text-gray-500"
25+
fill="#6B7280"
26+
width="1024"
27+
height="1024"
28+
viewBox="0 0 1024 1024">
29+
<path
30+
d="M8 0C3.58 0 0 3.58 0 8C0 11.54 2.29 14.53 5.47 15.59C5.87 15.66 6.02 15.42 6.02 15.21C6.02 15.02 6.01 14.39 6.01 13.72C4 14.09 3.48 13.23 3.32 12.78C3.23 12.55 2.84 11.84 2.5 11.65C2.22 11.5 1.82 11.13 2.49 11.12C3.12 11.11 3.57 11.7 3.72 11.94C4.44 13.15 5.59 12.81 6.05 12.6C6.12 12.08 6.33 11.73 6.56 11.53C4.78 11.33 2.92 10.64 2.92 7.58C2.92 6.71 3.23 5.99 3.74 5.43C3.66 5.23 3.38 4.41 3.82 3.31C3.82 3.31 4.49 3.1 6.02 4.13C6.66 3.95 7.34 3.86 8.02 3.86C8.7 3.86 9.38 3.95 10.02 4.13C11.55 3.09 12.22 3.31 12.22 3.31C12.66 4.41 12.38 5.23 12.3 5.43C12.81 5.99 13.12 6.7 13.12 7.58C13.12 10.65 11.25 11.33 9.47 11.53C9.76 11.78 10.01 12.26 10.01 13.01C10.01 14.08 10 14.94 10 15.21C10 15.42 10.15 15.67 10.55 15.59C13.71 14.53 16 11.53 16 8C16 3.58 12.42 0 8 0Z"
31+
transform="scale(64)"
32+
/>
2133
</svg>
2234
</a>
2335
);

components/HatenaIcon.tsx

+36-17
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,47 @@
1-
import React from 'react';
2-
import * as gtag from '../lib/gtag'
1+
import React, { FC } from 'react';
2+
import * as gtag from '../lib/gtag';
33

4-
export const HatenaIcon = ({
5-
hatena_href,
6-
hatena_title
7-
}: any) => {
4+
interface Props {
5+
hatena_href: string;
6+
hatena_title: string;
7+
}
88

9+
export const HatenaIcon: FC<Props> = ({ hatena_href, hatena_title }) => {
910
const handleClick = () => {
1011
gtag.event({
1112
action: 'Click',
1213
category: 'Share',
1314
label: 'Hatena',
1415
value: '0',
15-
})
16-
}
16+
});
17+
};
1718

1819
return (
19-
<a href={hatena_href} target="_blank" data-hatena-bookmark-title={hatena_title} data-tip="このページをはてなブックマークに追加する" onClick={handleClick}>
20-
<svg className="hatena-svg w-7 h-7 text-gray-500" fill="#6B7280" x="0px" y="0px"
21-
width="1024px" height="1024px" viewBox="0 0 1024 1024">
22-
<path d="M450.95,472.227c9.849-5.964,14.944-15.621,14.944-30.576s-4.57-25.491-13.882-31.648c-9.259-6.094-27.422-9.14-54.5-9.14
23-
h-23.376v80.161h21.628C422.647,481.023,441.111,478.213,450.95,472.227z"/>
24-
<path d="M468.179,562.581c-9.666-6.674-27.947-10.02-54.317-10.02h-39.726v87.006h38.149c25.662,0,43.944-3.153,54.661-9.678
25-
l-0.171,0.193c10.899-6.501,16.166-15.471,16.166-32.335C482.94,580.862,477.845,569.252,468.179,562.581z"/>
26-
<path d="M902.656,121.856C870.57,89.088,831.658,72.704,785.92,72.704H238.08c-45.739,0.683-84.651,17.066-116.736,49.152
20+
<a
21+
href={hatena_href}
22+
target="_blank"
23+
data-hatena-bookmark-title={hatena_title}
24+
data-tip="このページをはてなブックマークに追加する"
25+
onClick={handleClick}
26+
rel="noreferrer">
27+
<svg
28+
className="hatena-svg w-7 h-7 text-gray-500"
29+
fill="#6B7280"
30+
x="0px"
31+
y="0px"
32+
width="1024px"
33+
height="1024px"
34+
viewBox="0 0 1024 1024">
35+
<path
36+
d="M450.95,472.227c9.849-5.964,14.944-15.621,14.944-30.576s-4.57-25.491-13.882-31.648c-9.259-6.094-27.422-9.14-54.5-9.14
37+
h-23.376v80.161h21.628C422.647,481.023,441.111,478.213,450.95,472.227z"
38+
/>
39+
<path
40+
d="M468.179,562.581c-9.666-6.674-27.947-10.02-54.317-10.02h-39.726v87.006h38.149c25.662,0,43.944-3.153,54.661-9.678
41+
l-0.171,0.193c10.899-6.501,16.166-15.471,16.166-32.335C482.94,580.862,477.845,569.252,468.179,562.581z"
42+
/>
43+
<path
44+
d="M902.656,121.856C870.57,89.088,831.658,72.704,785.92,72.704H238.08c-45.739,0.683-84.651,17.066-116.736,49.152
2745
c-32.085,32.085-48.128,70.656-48.128,115.712v548.864c0,44.374,16.043,82.944,48.128,115.712
2846
c32.085,32.77,70.998,49.152,116.736,49.152h547.84c45.738-0.683,84.65-17.065,116.736-49.152
2947
c32.085-32.085,48.128-70.654,48.128-115.712V237.568C950.784,193.195,934.741,154.624,902.656,121.856z M657.824,312.461h87.887
@@ -33,7 +51,8 @@ export const HatenaIcon = ({
3351
c0,22.68-5.621,40.424-17.208,53.964c-11.607,13.517-29.889,23.559-55.196,30.404c28.354,2.103,50.52,12.08,66.439,29.889
3452
c16.007,17.745,23.904,41.476,23.904,71.193C586.116,619.013,581.566,637.829,572.598,653.986z M701.768,711.983
3553
c-27.938,0-50.597-22.658-50.597-50.616c0-27.957,22.659-50.617,50.597-50.617c27.979,0,50.638,22.66,50.638,50.617
36-
C752.405,689.325,729.746,711.983,701.768,711.983z"/>
54+
C752.405,689.325,729.746,711.983,701.768,711.983z"
55+
/>
3756
</svg>
3857
</a>
3958
);

components/Header.tsx

+13-11
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,20 @@
1-
import React from 'react';
1+
import React, { FC } from 'react';
22
import Head from 'next/head';
33

4-
export const Header = ({
5-
title
6-
}: any) => {
4+
interface Props {
5+
title: string;
6+
}
7+
8+
export const Header: FC<Props> = ({ title }) => {
79
return (
810
<Head>
9-
<title>{title}</title>
10-
<link rel="icon" href="/favicon.ico" />
11-
<meta charSet="utf-8" />
12-
<meta name="viewport" content="width=device-width, initial-scale=1" />
13-
<link rel="manifest" href="/site.webmanifest" />
14-
<link rel="apple-touch-icon" href="/icon.png" />
15-
<meta name="theme-color" content="#2563eb" />
11+
<title>{title}</title>
12+
<link rel="icon" href="/favicon.ico" />
13+
<meta charSet="utf-8" />
14+
<meta name="viewport" content="width=device-width, initial-scale=1" />
15+
<link rel="manifest" href="/site.webmanifest" />
16+
<link rel="apple-touch-icon" href="/icon.png" />
17+
<meta name="theme-color" content="#2563eb" />
1618
</Head>
1719
);
1820
};

0 commit comments

Comments
 (0)