Skip to content

Commit d2c77fb

Browse files
mkubdevmkubdev
committed
feat: bumping nextjs from 12 to 13, migrating js to typescript, and use appDir instead of src/
1 parent cac52a3 commit d2c77fb

File tree

112 files changed

+7826
-7033
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

112 files changed

+7826
-7033
lines changed

‎.editorconfig

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
# editorconfig.org
2+
root = true
3+
4+
[*]
5+
charset = utf-8
6+
end_of_line = lf
7+
indent_size = 2
8+
indent_style = space
9+
insert_final_newline = true
10+
trim_trailing_whitespace = true

‎.eslintignore

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
dist/*
2+
.cache
3+
public
4+
node_modules
5+
*.esm.js

‎.eslintrc.json

Lines changed: 27 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,30 @@
11
{
2-
"extends": "next/core-web-vitals",
2+
"$schema": "https://json.schemastore.org/eslintrc",
3+
"root": true,
4+
"extends": [
5+
"next/core-web-vitals",
6+
"prettier",
7+
"plugin:tailwindcss/recommended"
8+
],
9+
"plugins": ["tailwindcss"],
310
"rules": {
4-
"@next/next/no-img-element": "off"
5-
}
11+
"@next/next/no-html-link-for-pages": "off",
12+
"react/jsx-key": "off",
13+
"tailwindcss/no-custom-classname": "off"
14+
},
15+
"settings": {
16+
"tailwindcss": {
17+
"callees": ["cn"],
18+
"config": "./tailwind.config.js"
19+
},
20+
"next": {
21+
"rootDir": ["./"]
22+
}
23+
},
24+
"overrides": [
25+
{
26+
"files": ["*.ts", "*.tsx"],
27+
"parser": "@typescript-eslint/parser"
28+
}
29+
]
630
}

‎.gitignore

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,17 @@
11
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
22

33
# dependencies
4-
/node_modules
5-
/.pnp
4+
node_modules
5+
.pnp
66
.pnp.js
77

88
# testing
9-
/coverage
9+
coverage
1010

1111
# next.js
12-
/.next/
13-
/out/
14-
15-
# production
16-
/build
12+
.next/
13+
out/
14+
build
1715

1816
# misc
1917
.DS_Store
@@ -23,12 +21,16 @@
2321
npm-debug.log*
2422
yarn-debug.log*
2523
yarn-error.log*
24+
.pnpm-debug.log*
2625

2726
# local env files
2827
.env.local
2928
.env.development.local
3029
.env.test.local
3130
.env.production.local
3231

33-
# vercel
34-
.vercel
32+
# turbo
33+
.turbo
34+
35+
.contentlayer
36+
.env

‎.prettierignore

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
cache
2+
.cache
3+
package.json
4+
package-lock.json
5+
public
6+
CHANGELOG.md
7+
.yarn
8+
dist
9+
node_modules
10+
.next
11+
build
12+
.contentlayer

‎.vscode/settings.json

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"typescript.tsdk": "../../node_modules/.pnpm/[email protected]/node_modules/typescript/lib",
3+
"typescript.enablePromptUseWorkspaceTsdk": true
4+
}

‎README.md

Lines changed: 15 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,23 @@
1-
<!-- markdownlint-disable-next-line -->
2-
<img alt="WebXDAO banner" src="https://user-images.githubusercontent.com/72812470/189705065-58fe76da-080b-4798-94fe-2400af2bbfa8.png"/>
1+
# next-template
32

4-
---
5-
[![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/WebXDAO/WebXDAO.github.io/blob/master/LICENSE)
3+
A Next.js 13 template for building apps with Radix UI and Tailwind CSS.
64

7-
The content in this repository is temporary, we are making new web design for WebX DAO. If you want to help, please message us on [Discord](https://discord.gg/TSRwqx4K2v)
5+
## Usage
86

9-
---
10-
11-
## 🚀 Getting Started
12-
13-
> Make sure to read our [contributing guidelines](https://github.com/WebXDAO/WebXDAO.github.io/blob/main/CONTRIBUTING.md)
14-
15-
### 1\. Skip all of the steps below by using Gitpod, which would automatically do all of that for you
16-
17-
[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/WebXDAO/WebXDAO.github.io)
18-
19-
### 2\. Clone this Repository
20-
21-
```
22-
git clone https://github.com/WebXDAO/WebXDAO.github.io.git
7+
```bash
8+
npx create-next-app -e https://github.com/shadcn/next-template
239
```
2410

25-
### 3\. Navigate to the directory
11+
## Features
2612

27-
```
28-
cd WebXDAO.github.io
29-
```
30-
31-
### 4\. Install dependencies
32-
33-
```
34-
npm install
35-
```
36-
37-
### 5\. Run Nextjs
38-
39-
```
40-
npm run dev
41-
```
13+
- Radix UI Primitives
14+
- Tailwind CSS
15+
- Fonts with `next/font`
16+
- Icons from [Lucide](https://lucide.dev)
17+
- Dark mode with `next-themes`
18+
- Automatic import sorting with `@ianvs/prettier-plugin-sort-imports`
19+
- Tailwind CSS class sorting, merging and linting.
4220

43-
## ⚡ Our valuable Contributors
21+
## License
4422

45-
<p align="center"><a href="https://github.com/WebXDAO/WebXDAO.github.io/graphs/contributors">
46-
<img src="https://contributors-img.web.app/image?repo=WebXDAO/WebXDAO.github.io" />
47-
</a></p>
23+
Licensed under the [MIT license](https://github.com/shadcn/ui/blob/main/LICENSE.md).

‎app/blogs/page.tsx

Lines changed: 86 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,86 @@
1+
import Head from "next/head";
2+
// import { Blogs } from '../components/Global'
3+
4+
5+
async function getData() {
6+
const res = await fetch('https://dev.to/api/articles?username=webxdao');
7+
// The return value is *not* serialized
8+
// You can return Date, Map, Set, etc.
9+
10+
// Recommendation: handle errors
11+
if (!res.ok) {
12+
// This will activate the closest `error.js` Error Boundary
13+
throw new Error('Failed to fetch data');
14+
}
15+
16+
return res.json();
17+
}
18+
19+
export default async function BlogPage({
20+
params: { data },
21+
}:{
22+
params: { data: [] };
23+
}) {
24+
// Initiate dev.to API request
25+
const blogData = getData();
26+
27+
// Wait for the promises to resolve
28+
const [dataT] = await Promise.all([blogData]);
29+
30+
return (
31+
<>
32+
<Head>
33+
<title>Blog | WebXDAO</title>
34+
</Head>
35+
<section className="py-8">
36+
<div className="container max-w-5xl mx-auto">
37+
<h1 className="w-full my-2 text-4xl font-bold leading-tight text-center text-white">
38+
Blogs
39+
</h1>
40+
</div>
41+
42+
<section>
43+
<div className="relative flex flex-wrap items-center justify-center grid-cols-1 mx-0 z-2 my-7">
44+
45+
{dataT.map((curElem: any) => {
46+
return (
47+
<div
48+
className="relative flex items-center m-7 bg-white shadow-2xl grid-items group z-2 w-min h-min bg-opacity-5 rounded-2xl justify-conten backdrop-filter backdrop-blur-md"
49+
key={curElem.id}
50+
>
51+
<div className="relative w-[17.5rem] sm:w-[15.5rem] md:w-[19rem] lg:w-[27rem] h-80 flex justify-center items-center flex-col opacity-70 hover:opacity-100">
52+
<div className="relative w-4/5 truncate duration-500 border-8 border-solid rounded-2xl border-black/25 group-hover:-translate-y-6">
53+
<img
54+
src={curElem.cover_image}
55+
alt="blog image"
56+
className="relative top-0 left-0 object-cover w-full h-full"
57+
/>
58+
</div>
59+
<div className="relative flex-wrap items-center justify-center mx-0 my-0 text-center">
60+
<h3 className="group-hover:-translate-y-6 duration-500 text-white uppercase font-medium text-sm text-center tracking-wider mt-5 mr-2.5 ml-2.5 mb-2.5 leading-4">
61+
<b>{curElem.title}</b>
62+
<br></br>
63+
<br></br>
64+
<span className="text-xs font-light lowercase">{curElem.description}</span>
65+
<br></br>
66+
<br></br>
67+
<a
68+
href={curElem.url}
69+
target="_blank"
70+
rel="noopener noreferrer"
71+
className="inline-block rounded-md border border-transparent bg-green-500 py-3 px-8 text-center font-medium text-white"
72+
>
73+
<b>Read More</b>
74+
</a>
75+
</h3>
76+
</div>
77+
</div>
78+
</div>
79+
);
80+
})}
81+
</div>
82+
</section>
83+
</section>
84+
</>
85+
);
86+
};

‎app/layout.tsx

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
import "@/styles/globals.css"
2+
import { Metadata } from "next"
3+
4+
import { siteConfig } from "@/config/site"
5+
import { fontSans } from "@/lib/fonts"
6+
import { cn } from "@/lib/utils"
7+
import { SiteHeader } from "@/components/site-header"
8+
import { TailwindIndicator } from "@/components/tailwind-indicator"
9+
import { ThemeProvider } from "@/components/theme-provider"
10+
11+
export const metadata: Metadata = {
12+
title: {
13+
default: siteConfig.name,
14+
template: `%s - ${siteConfig.name}`,
15+
},
16+
description: siteConfig.description,
17+
themeColor: [
18+
{ media: "(prefers-color-scheme: light)", color: "white" },
19+
{ media: "(prefers-color-scheme: dark)", color: "black" },
20+
],
21+
icons: {
22+
icon: "/favicon.ico",
23+
shortcut: "/favicon-16x16.png",
24+
apple: "/apple-touch-icon.png",
25+
},
26+
}
27+
28+
interface RootLayoutProps {
29+
children: React.ReactNode
30+
}
31+
32+
export default function RootLayout({ children }: RootLayoutProps) {
33+
return (
34+
<>
35+
<html lang="en" suppressHydrationWarning>
36+
<head />
37+
<body
38+
className={cn(
39+
"min-h-screen bg-background font-sans antialiased",
40+
fontSans.variable
41+
)}
42+
>
43+
<ThemeProvider attribute="class" defaultTheme="system" enableSystem>
44+
<div className="relative flex min-h-screen flex-col">
45+
<SiteHeader />
46+
<div className="flex-1">{children}</div>
47+
</div>
48+
<TailwindIndicator />
49+
</ThemeProvider>
50+
</body>
51+
</html>
52+
</>
53+
)
54+
}

0 commit comments

Comments
 (0)