diff --git a/.depcheckrc b/.depcheckrc new file mode 100644 index 0000000..9a0dcc8 --- /dev/null +++ b/.depcheckrc @@ -0,0 +1,2 @@ +ignores: ["@types/node", "@types/react-dom", "autoprefixer", "postcss", "@commitlint/config-conventional", "prettier"] +skip-missing: false diff --git a/.github/workflows/lint-deps-check.yaml b/.github/workflows/lint-deps-check.yaml new file mode 100644 index 0000000..c214b94 --- /dev/null +++ b/.github/workflows/lint-deps-check.yaml @@ -0,0 +1,47 @@ +name: Linting and Dependency Check + +on: + push: + branches: + - main + pull_request: + branches: + - main + +permissions: + checks: write + contents: write + +jobs: + run-checks: + name: Run checks + runs-on: ubuntu-latest + strategy: + matrix: + node-version: [18, 20] + steps: + - name: Checkout Git repository + uses: actions/checkout@v3.5.3 + + - name: Setup pnpm + uses: pnpm/action-setup@v2.2.4 + with: + version: 8.6.2 + + - name: Setup Node.js + uses: actions/setup-node@v3.6.0 + with: + node-version: ${{ matrix.node-version }} + cache: pnpm + + - name: Install Node.js dependencies + run: pnpm install --frozen-lockfile + + - name: Run linters + uses: wearerequired/lint-action@v2.3.0 + with: + eslint: true + prettier: true + + - name: Run dependency check + run: npx depcheck diff --git a/README.md b/README.md index aa76d43..85e7f23 100644 --- a/README.md +++ b/README.md @@ -4,7 +4,7 @@
- +
diff --git a/app/(index)/layout.tsx b/app/(index)/layout.tsx new file mode 100644 index 0000000..3968f6c --- /dev/null +++ b/app/(index)/layout.tsx @@ -0,0 +1,33 @@ +import Link from "next/link"; + +import { cn } from "@/lib/utils"; +import { buttonVariants } from "@/components/ui/button"; + +interface MarketingLayoutProps { + children: React.ReactNode; +} + +export default async function MarketingLayout({ + children, +}: MarketingLayoutProps) { + return ( +
+
+
+ +
+
+
{children}
+
+ ); +} diff --git a/app/(index)/page.tsx b/app/(index)/page.tsx new file mode 100644 index 0000000..bdf1a1d --- /dev/null +++ b/app/(index)/page.tsx @@ -0,0 +1,43 @@ +import Link from "next/link"; + +import { siteConfig } from "@/config/site"; +import { cn } from "@/lib/utils"; +import { buttonVariants } from "@/components/ui/button"; + +export default function IndexPage() { + return ( + <> +
+
+ + View my LinkedIn profile + +

+ hellob.art +

+

+ In progress build of my portfolio using Next.js 13 server + components. +

+
+ + Get Started + + + GitHub + +
+
+
+ + ); +} diff --git a/app/favicon.ico b/app/favicon.ico deleted file mode 100644 index 718d6fe..0000000 Binary files a/app/favicon.ico and /dev/null differ diff --git a/app/globals.css b/app/globals.css deleted file mode 100644 index fd81e88..0000000 --- a/app/globals.css +++ /dev/null @@ -1,27 +0,0 @@ -@tailwind base; -@tailwind components; -@tailwind utilities; - -:root { - --foreground-rgb: 0, 0, 0; - --background-start-rgb: 214, 219, 220; - --background-end-rgb: 255, 255, 255; -} - -@media (prefers-color-scheme: dark) { - :root { - --foreground-rgb: 255, 255, 255; - --background-start-rgb: 0, 0, 0; - --background-end-rgb: 0, 0, 0; - } -} - -body { - color: rgb(var(--foreground-rgb)); - background: linear-gradient( - to bottom, - transparent, - rgb(var(--background-end-rgb)) - ) - rgb(var(--background-start-rgb)); -} diff --git a/app/layout.tsx b/app/layout.tsx index 71b3fbf..8636523 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -1,21 +1,79 @@ -import './globals.css' -import { Inter } from 'next/font/google' +import { Inter, Fjalla_One } from "next/font/google"; -const inter = Inter({ subsets: ['latin'] }) +import { ThemeProvider } from "@/components/theme-provider"; +import "tailwindcss/tailwind.css"; -export const metadata = { - title: 'Create Next App', - description: 'Generated by create next app', +import { Metadata } from "next"; + +export const metadata: Metadata = { + title: { + default: "hellob.art", + template: "%s | hellob.art", + }, + description: "a simple portfolio made by bart van der braak", + metadataBase: new URL("https://hellob.art"), + openGraph: { + title: "hellob.art", + description: "a simple portfolio made by bart van der braak", + url: "https://hellob.art", + siteName: "hellob.art", + locale: "en-US", + type: "website", + }, + robots: { + index: true, + follow: true, + googleBot: { + index: true, + follow: true, + "max-video-preview": -1, + "max-image-preview": "large", + "max-snippet": -1, + }, + }, + twitter: { + title: "hellob.art", + card: "summary_large_image", + }, + icons: { + shortcut: "/favicon.png", + }, +}; + +interface RootLayoutProps { + children: React.ReactNode; } -export default function RootLayout({ - children, -}: { - children: React.ReactNode -}) { +const inter = Inter({ + subsets: ["latin"], + variable: "--font-inter", +}); + +const fjallaOne = Fjalla_One({ + subsets: ["latin"], + weight: "400", + variable: "--font-fjalla-one", +}); + +interface RootLayoutProps { + children: React.ReactNode; +} + +export default async function RootLayout({ children }: RootLayoutProps) { return ( - - {children} - - ) + <> + + + + + {children} + + + + + ); } diff --git a/app/page.tsx b/app/page.tsx deleted file mode 100644 index 745df65..0000000 --- a/app/page.tsx +++ /dev/null @@ -1,113 +0,0 @@ -import Image from 'next/image' - -export default function Home() { - return ( -
-
-

- Get started by editing  - app/page.tsx -

-
- - By{' '} - Vercel Logo - -
-
- -
- Next.js Logo -
- -
- -

- Docs{' '} - - -> - -

-

- Find in-depth information about Next.js features and API. -

- - - -

- Learn{' '} - - -> - -

-

- Learn about Next.js in an interactive course with quizzes! -

- - - -

- Templates{' '} - - -> - -

-

- Explore the Next.js 13 playground. -

- - - -

- Deploy{' '} - - -> - -

-

- Instantly deploy your Next.js site to a shareable URL with Vercel. -

- -
-
- ) -} diff --git a/components/theme-provider.tsx b/components/theme-provider.tsx new file mode 100644 index 0000000..b4e8e4f --- /dev/null +++ b/components/theme-provider.tsx @@ -0,0 +1,9 @@ +"use client"; + +import * as React from "react"; +import { ThemeProvider as NextThemesProvider } from "next-themes"; +import { ThemeProviderProps } from "next-themes/dist/types"; + +export function ThemeProvider({ children, ...props }: ThemeProviderProps) { + return {children}; +} diff --git a/components/ui/button.tsx b/components/ui/button.tsx new file mode 100644 index 0000000..0ec0799 --- /dev/null +++ b/components/ui/button.tsx @@ -0,0 +1,51 @@ +import * as React from "react"; +import { VariantProps, cva } from "class-variance-authority"; + +import { cn } from "@/lib/utils"; + +const buttonVariants = cva( + "inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:opacity-50 disabled:pointer-events-none ring-offset-background", + { + variants: { + variant: { + default: "bg-primary text-primary-foreground hover:bg-primary/90", + destructive: + "bg-destructive text-destructive-foreground hover:bg-destructive/90", + outline: + "border border-input hover:bg-accent hover:text-accent-foreground", + secondary: + "bg-secondary text-secondary-foreground hover:bg-secondary/80", + ghost: "hover:bg-accent hover:text-accent-foreground", + link: "underline-offset-4 hover:underline text-primary", + }, + size: { + default: "h-10 py-2 px-4", + sm: "h-9 px-3 rounded-md", + lg: "h-11 px-8 rounded-md", + }, + }, + defaultVariants: { + variant: "default", + size: "default", + }, + } +); + +export interface ButtonProps + extends React.ButtonHTMLAttributes, + VariantProps {} + +const Button = React.forwardRef( + ({ className, variant, size, ...props }, ref) => { + return ( +