Skip to content

Commit

Permalink
Merge pull request #169 from io-kobayashiii/feature/#166_upgrade_nextjs
Browse files Browse the repository at this point in the history
Feature/#166 upgrade nextjs version to 13.4.6
  • Loading branch information
io-kobayashiii committed Jul 1, 2023
2 parents 719cee1 + e8cd234 commit 771bb62
Show file tree
Hide file tree
Showing 40 changed files with 874 additions and 677 deletions.
3 changes: 2 additions & 1 deletion next.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,5 +3,6 @@ const withBundleAnalyzer = require('@next/bundle-analyzer')({
});

module.exports = withBundleAnalyzer({
reactStrictMode: false,
reactStrictMode: !true,
output: 'export',
});
16 changes: 8 additions & 8 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,10 +5,10 @@
"scripts": {
"prepare": "husky install",
"dev": "next dev --port 3100",
"build": "next build && next export && next-sitemap --config sitemap.config.cjs",
"build": "next build && next-sitemap --config sitemap.config.cjs",
"analyze": "ANALYZE=true next build",
"analyze:windows": "cross-env ANALYZE=true next build",
"start": "next start",
"start": "serve out",
"lint": "next lint",
"format": "prettier --write src/**/*.{js,json,ts,tsx,css,scss}",
"watch-storybook": "concurrently \"yarn:watch:*\"",
Expand All @@ -23,11 +23,9 @@
"@coreui/icons": "^3.0.0",
"@coreui/icons-react": "^2.1.0",
"highlight.js": "^11.7.0",
"moment": "^2.29.4",
"next": "13.1.5",
"react": "18.2.0",
"react-dom": "18.2.0",
"react-moment": "^1.1.3"
"next": "^13.4.6",
"react": "^18.2.0",
"react-dom": "^18.2.0"
},
"devDependencies": {
"@babel/core": "^7.20.12",
Expand All @@ -52,14 +50,16 @@
"concurrently": "^7.6.0",
"cross-env": "^7.0.3",
"eslint": "8.32.0",
"eslint-config-next": "13.1.5",
"eslint-config-next": "^13.4.6",
"eslint-config-prettier": "^8.6.0",
"husky": "^8.0.3",
"lint-staged": "^13.1.0",
"next-sitemap": "^3.1.47",
"postcss": "^8.4.21",
"prettier": "^2.8.3",
"prettier-plugin-tailwindcss": "^0.3.0",
"sass": "^1.57.1",
"serve": "^14.2.0",
"storybook-addon-next": "^1.7.1",
"tailwindcss": "^3.2.4",
"typescript": "^4.9.4"
Expand Down
92 changes: 54 additions & 38 deletions public/globals.css
Original file line number Diff line number Diff line change
Expand Up @@ -534,6 +534,14 @@ video {
margin-top: 15px;
}

.mt-40 {
margin-top: 40px;
}

.mt-20 {
margin-top: 20px;
}

.mt-30 {
margin-top: 30px;
}
Expand All @@ -550,10 +558,6 @@ video {
margin-top: 16px;
}

.mt-40 {
margin-top: 40px;
}

.mb-15 {
margin-bottom: 15px;
}
Expand All @@ -574,6 +578,14 @@ video {
display: none;
}

.h-2 {
height: 2px;
}

.h-56 {
height: 56px;
}

.w-100p {
width: 100%;
}
Expand All @@ -582,6 +594,10 @@ video {
max-width: 992px;
}

.cursor-pointer {
cursor: pointer;
}

.resize {
resize: both;
}
Expand Down Expand Up @@ -614,8 +630,8 @@ video {
border-radius: 6px;
}

.border-b-2 {
border-bottom-width: 2px;
.border {
border-width: 1px;
}

.border-t-2 {
Expand All @@ -627,19 +643,14 @@ video {
border-color: rgb(229 231 235 / var(--tw-border-opacity));
}

.bg-gray-100 {
.bg-gray-800 {
--tw-bg-opacity: 1;
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
background-color: rgb(31 41 55 / var(--tw-bg-opacity));
}

.bg-white {
--tw-bg-opacity: 1;
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}

.bg-product-github {
.bg-gray-100 {
--tw-bg-opacity: 1;
background-color: rgb(23 21 21 / var(--tw-bg-opacity));
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
}

.p-15 {
Expand Down Expand Up @@ -673,24 +684,24 @@ video {
padding-bottom: 5px;
}

.pt-70 {
padding-top: 70px;
.pt-76 {
padding-top: 76px;
}

.pb-50 {
padding-bottom: 50px;
.pb-20 {
padding-bottom: 20px;
}

.pb-10 {
padding-bottom: 10px;
.pt-20 {
padding-top: 20px;
}

.pt-15 {
padding-top: 15px;
.pt-106 {
padding-top: 106px;
}

.pb-5 {
padding-bottom: 5px;
.pb-50 {
padding-bottom: 50px;
}

.text-center {
Expand All @@ -717,14 +728,14 @@ video {
font-size: 12px;
}

.text-32 {
font-size: 32px;
}

.text-20 {
font-size: 20px;
}

.text-11 {
font-size: 11px;
}

.font-bold {
font-weight: 700;
}
Expand All @@ -747,7 +758,8 @@ body {

body {
font-family: 'M PLUS 1p', sans-serif;
color: #3c3c3c;
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
}

a {
Expand Down Expand Up @@ -782,6 +794,10 @@ a {
margin-top: 30px;
}

.md\:mt-80 {
margin-top: 80px;
}

.md\:mt-50 {
margin-top: 50px;
}
Expand All @@ -794,10 +810,6 @@ a {
margin-top: 25px;
}

.md\:mt-80 {
margin-top: 80px;
}

.md\:block {
display: block;
}
Expand Down Expand Up @@ -882,17 +894,21 @@ a {
font-size: 14px;
}

.md\:text-18 {
font-size: 18px;
}

.md\:text-28 {
font-size: 28px;
}

.md\:text-18 {
font-size: 18px;
}

.md\:text-32 {
font-size: 32px;
}

.md\:text-12 {
font-size: 12px;
}
}

@media (min-width: 992px) {
Expand Down
15 changes: 15 additions & 0 deletions src/app/articles/[id]/layout.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
type Props = {
children: React.ReactNode;
};

export default async function RootLayout({ children }: Props) {
return (
<>
<main className="bg-gray-800 pt-106 pb-50 md:pt-180 md:pb-80">
<article className="mx-auto max-w-lg px-15 md:px-30">
{children}
</article>
</main>
</>
);
}
7 changes: 7 additions & 0 deletions src/app/articles/[id]/not-found.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
export default function NotFound() {
return (
<h1 className={`mt-16 text-20 font-bold sm:text-24 md:mt-22 md:text-28`}>
Not Found.
</h1>
);
}
66 changes: 66 additions & 0 deletions src/app/articles/[id]/page.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,66 @@
import ApiClient from '@/utils/ApiClient';
import { NeumorphismButton } from '@/components/NeumorphismButton';
import { ArticleBody } from '@/components/ArticleBody';
import { notFound } from 'next/navigation';
import { ApplyHooks } from '@/components/ApplyHooks/ApplyHooks';
import 'highlight.js/styles/base16/atelier-forest.css';
import { Metadata } from 'next';

export async function generateStaticParams() {
const articles = await ApiClient.articles();
if (!articles) return [];
return articles.contents?.map(({ id }) => ({ id })) ?? [];
}

type Props = {
params: {
id: string;
};
};

export async function generateMetadata({
params: { id },
}: Props): Promise<Metadata> {
const article = await ApiClient.article(id);

return {
title: article?.title ?? 'For',
description: article?.description,
};
}

export default async function Page({ params: { id } }: Props) {
const article = await ApiClient.article(id);
if (!article) notFound();
return (
<>
<p className="text-14 md:text-18">
{new Date(article.publishedAt)
.toLocaleDateString('ja-JP', {
timeZone: 'Asia/Tokyo',
})
.replaceAll('/', '.')}
</p>
<h1 className={`mt-16 text-20 font-bold sm:text-24 md:mt-22 md:text-28`}>
{article.title}
</h1>
<div className="m-minus-5 mt-15 flex flex-wrap md:mt-25">
{article.categories.map((category, index) => {
return (
<NeumorphismButton
key={index}
unevenness={'dents'}
shadowColor={'default'}
displayText={category.name}
className={
'pointer-events-none m-5 rounded-100vh py-5 px-15 text-12 md:py-8 md:px-12 md:text-14'
}
/>
);
})}
</div>
<ArticleBody articleBody={article.body ?? ''} />
<ApplyHooks />
</>
);
}
9 changes: 9 additions & 0 deletions src/app/categories/[slug]/not-found.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
export default function NotFound() {
return (
<main className="bg-gray-800 pt-76 pb-20 md:pt-180 md:pb-80">
<div className="mx-auto max-w-lg px-15 md:px-30">
<h1 className="text-24">Not found.</h1>
</div>
</main>
);
}
Loading

0 comments on commit 771bb62

Please sign in to comment.