feat: base pages and news fetching with cron job

.env.example

@@ -0,0 +1,26 @@
+# Created by Vercel CLI
+NX_DAEMON=""
+POSTGRES_DATABASE=""
+POSTGRES_HOST=""
+POSTGRES_PASSWORD=""
+POSTGRES_PRISMA_URL=""
+POSTGRES_URL=""
+POSTGRES_URL_NON_POOLING=""
+POSTGRES_USER=""
+TURBO_REMOTE_ONLY=""
+TURBO_RUN_SUMMARY=""
+VERCEL="1"
+VERCEL_ENV="development"
+VERCEL_GIT_COMMIT_AUTHOR_LOGIN=""
+VERCEL_GIT_COMMIT_AUTHOR_NAME=""
+VERCEL_GIT_COMMIT_MESSAGE=""
+VERCEL_GIT_COMMIT_REF=""
+VERCEL_GIT_COMMIT_SHA=""
+VERCEL_GIT_PREVIOUS_SHA=""
+VERCEL_GIT_PROVIDER=""
+VERCEL_GIT_PULL_REQUEST_ID=""
+VERCEL_GIT_REPO_ID=""
+VERCEL_GIT_REPO_OWNER=""
+VERCEL_GIT_REPO_SLUG=""
+VERCEL_URL=""
+NEWS_LIMIT=""

.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": "next/core-web-vitals"
+}

.gitignore

@@ -1,130 +1,38 @@
-# Logs
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
-logs
+
-*.log
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
-lerna-debug.log*
-.pnpm-debug.log*
 
-# Diagnostic reports (https://nodejs.org/api/report.html)
+# local env files
-report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
+.env*.local
 
-# Runtime data
+# vercel
-pids
+.vercel
-*.pid
-*.seed
-*.pid.lock
 
-# Directory for instrumented libs generated by jscoverage/JSCover
+# typescript
-lib-cov
-
-# Coverage directory used by tools like istanbul
-coverage
-*.lcov
-
-# nyc test coverage
-.nyc_output
-
-# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
-.grunt
-
-# Bower dependency directory (https://bower.io/)
-bower_components
-
-# node-waf configuration
-.lock-wscript
-
-# Compiled binary addons (https://nodejs.org/api/addons.html)
-build/Release
-
-# Dependency directories
-node_modules/
-jspm_packages/
-
-# Snowpack dependency directory (https://snowpack.dev/)
-web_modules/
-
-# TypeScript cache
 *.tsbuildinfo
+next-env.d.ts
 
-# Optional npm cache directory
+.env
-.npm
-
-# Optional eslint cache
-.eslintcache
-
-# Optional stylelint cache
-.stylelintcache
-
-# Microbundle cache
-.rpt2_cache/
-.rts2_cache_cjs/
-.rts2_cache_es/
-.rts2_cache_umd/
-
-# Optional REPL history
-.node_repl_history
-
-# Output of 'npm pack'
-*.tgz
-
-# Yarn Integrity file
-.yarn-integrity
-
-# dotenv environment variable files
-.env
-.env.development.local
-.env.test.local
-.env.production.local
-.env.local
-
-# parcel-bundler cache (https://parceljs.org/)
-.cache
-.parcel-cache
-
-# Next.js build output
-.next
-out
-
-# Nuxt.js build / generate output
-.nuxt
-dist
-
-# Gatsby files
-.cache/
-# Comment in the public line in if your project uses Gatsby and not Next.js
-# https://nextjs.org/blog/next-9-1#public-directory-support
-# public
-
-# vuepress build output
-.vuepress/dist
-
-# vuepress v2.x temp and cache directory
-.temp
-.cache
-
-# Docusaurus cache and generated files
-.docusaurus
-
-# Serverless directories
-.serverless/
-
-# FuseBox cache
-.fusebox/
-
-# DynamoDB Local files
-.dynamodb/
-
-# TernJS port file
-.tern-port
-
-# Stores VSCode versions used for testing VSCode extensions
-.vscode-test
-
-# yarn v2
-.yarn/cache
-.yarn/unplugged
-.yarn/build-state.yml
-.yarn/install-state.gz
-.pnp.*

.vscode/settings.json

@@ -0,0 +1,4 @@
+{
+  "WillLuke.nextjs.addTypesOnSave": true,
+  "WillLuke.nextjs.hasPrompted": true
+}

README.md

@@ -1 +1,43 @@
-# nextjs-hackernews
+## To do
+
+Basics:
+
+- Email templates
+- Subscribe email
+- Unsubscribe email
+- Newsletter email cron job
+- Cookiebot
+- Google Analytics
+- SEO
+
+## Vercel basics
+
+Install vercel cli
+
+```bash
+yarn add -g vercel@latest
+```
+
+Link to vercel
+
+```bash
+yarn vercel:link
+```
+
+Pull env variables from vercel
+
+```bash
+yarn vercel:env
+```
+
+Push Prisma schema to vercel
+
+```bash
+yarn db:push
+```
+
+Generate Prisma client
+
+```bash
+yarn prisma:generate
+```

app/api/cron/route.ts

@@ -0,0 +1,68 @@
+import { NextResponse } from 'next/server';
+import { z } from 'zod';
+import prisma from '../../../prisma/prisma';
+import { NewsSchema } from '../../utils/types';
+import { singleNews, topNews } from '../../utils/urls';
+
+export async function GET(request: Request) {
+  if (
+    request.headers.get('Authorization') !== `Bearer ${process.env.CRON_SECRET}`
+  ) {
+    return new Response('Unauthorized', { status: 401 });
+  }
+
+  const response = await hackernewsApi();
+
+  return new NextResponse(JSON.stringify(response), {
+    status: 200,
+  });
+}
+
+async function hackernewsApi() {
+  const topstories: number[] = await fetch(topNews).then((res) => res.json());
+
+  console.log('topstories', topstories);
+
+  const newsPromises = topstories
+    .splice(0, Number(process.env.NEWS_LIMIT))
+    .map(async (id) => {
+      console.log('id', id);
+      const sourceNews: z.infer<typeof NewsSchema> = await fetch(
+        singleNews(id)
+      ).then((res) => res.json());
+
+      console.log('sourceNews', sourceNews);
+
+      return await prisma.news.upsert({
+        create: {
+          id,
+          title: sourceNews.title,
+          text: sourceNews.text,
+          type: sourceNews.type,
+          by: sourceNews.by,
+          time: sourceNews.time,
+          url: sourceNews.url,
+          score: sourceNews.score,
+        },
+        update: {
+          title: sourceNews.title,
+          text: sourceNews.text,
+          type: sourceNews.type,
+          by: sourceNews.by,
+          time: sourceNews.time,
+          url: sourceNews.url,
+          score: sourceNews.score,
+        },
+        where: {
+          id,
+        },
+        select: {
+          id: true,
+        },
+      });
+    });
+
+  const newsIds = await Promise.all(newsPromises);
+
+  return newsIds.map((news) => news.id);
+}

app/api/subscribe/route.ts

@@ -0,0 +1,32 @@
+import { z } from 'zod';
+import prisma from '../../../prisma/prisma';
+import { ResponseSchema, SubscribeFormSchema } from '../../utils/types';
+
+export const dynamic = 'force-dynamic'; // defaults to force-static
+export async function POST(request: Request) {
+  const body = await request.json();
+  const validation = SubscribeFormSchema.safeParse(body);
+  if (!validation.success) {
+    return new Response('Bad request', { status: 400 });
+  }
+
+  const { email, targetingAllowed } = validation.data;
+
+  await prisma.user.upsert({
+    create: {
+      email,
+      targetingAllowed,
+    },
+    update: {
+      targetingAllowed,
+    },
+    where: {
+      email,
+    },
+  });
+
+  const message: z.infer<typeof ResponseSchema> = {
+    message: `${email} subscribed!`,
+  };
+  return new Response(JSON.stringify(message), { status: 200 });
+}

app/api/unsubscribe/route.ts

@@ -0,0 +1,29 @@
+import { z } from 'zod';
+import prisma from '../../../prisma/prisma';
+import { ResponseSchema, UnsubscribeFormSchema } from '../../utils/types';
+
+export const dynamic = 'force-dynamic'; // defaults to force-static
+export async function POST(request: Request) {
+  const body = await request.json();
+  const validation = UnsubscribeFormSchema.safeParse(body);
+  if (!validation.success) {
+    return new Response('Bad request', { status: 400 });
+  }
+
+  const { email } = validation.data;
+
+  try {
+    await prisma.user.delete({
+      where: {
+        email,
+      },
+    });
+  } catch (err) {
+    console.log(err);
+  }
+
+  const message: z.infer<typeof ResponseSchema> = {
+    message: `${email} unsubscribe!`,
+  };
+  return new Response(JSON.stringify(message), { status: 200 });
+}

app/globals.css

@@ -0,0 +1,79 @@
+html,
+body {
+  padding: 0;
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
+    Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
+  background: #1e1e1e;
+  min-height: 100vh;
+  display: flex;
+  color: rgb(243, 241, 239);
+  justify-content: center;
+  align-items: center;
+}
+
+.block {
+  display: flex;
+  flex-direction: column;
+}
+
+.name {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}
+
+.container {
+  font-size: 1.3rem;
+  border-radius: 10px;
+  width: 85%;
+  padding: 50px;
+  box-shadow: 0 54px 55px rgb(78 78 78 / 25%), 0 -12px 30px rgb(78 78 78 / 25%),
+    0 4px 6px rgb(78 78 78 / 25%), 0 12px 13px rgb(78 78 78 / 25%),
+    0 -3px 5px rgb(78 78 78 / 25%);
+}
+
+.container input {
+  font-size: 1.2rem;
+  margin: 10px 0 10px 0px;
+  border-color: rgb(31, 28, 28);
+  padding: 10px;
+  border-radius: 5px;
+  background-color: #e8f0fe;
+}
+
+.container textarea {
+  margin: 10px 0 10px 0px;
+  padding: 5px;
+  border-color: rgb(31, 28, 28);
+  border-radius: 5px;
+  background-color: #e8f0fe;
+  font-size: 20px;
+}
+
+.container h1 {
+  text-align: center;
+  font-weight: 600;
+}
+
+.name div {
+  display: flex;
+  flex-direction: column;
+}
+
+.block button {
+  padding: 10px;
+  font-size: 20px;
+  width: 30%;
+  border: 3px solid black;
+  border-radius: 5px;
+}
+
+.button {
+  display: flex;
+  align-items: center;
+}
+
+textarea {
+  resize: none;
+}

app/layout.tsx

@@ -0,0 +1,22 @@
+import type { Metadata } from 'next'
+import { Inter } from 'next/font/google'
+import './globals.css'
+
+const inter = Inter({ subsets: ['latin'] })
+
+export const metadata: Metadata = {
+  title: 'Create Next App',
+  description: 'Generated by create next app',
+}
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  return (
+    <html lang="en">
+      <body className={inter.className}>{children}</body>
+    </html>
+  )
+}

app/page.tsx

@@ -0,0 +1,16 @@
+'use client';
+import { useRouter } from 'next/navigation';
+import { Button } from '../components/Button';
+import { VerticalLayout } from '../components/VerticalLayout';
+
+export default function Home() {
+  const router = useRouter();
+
+  return (
+    <VerticalLayout>
+      <h1>Home</h1>
+      <Button label="Subscribe" onClick={() => router.push('/subscribe')} />
+      <Button label="Unsubscribe" onClick={() => router.push('/unsubscribe')} />
+    </VerticalLayout>
+  );
+}

app/subscribe/page.tsx

@@ -0,0 +1,79 @@
+'use client';
+import { useRouter } from 'next/navigation';
+import React, { useState } from 'react';
+import { z } from 'zod';
+import { Button } from '../../components/Button';
+import { VerticalLayout } from '../../components/VerticalLayout';
+import { ResponseSchema } from './../utils/types';
+
+export default function Home() {
+  const router = useRouter();
+  const [isChecked, setIsChecked] = useState(false);
+
+  async function handleSubmit(e: React.FormEvent<HTMLFormElement>) {
+    e.preventDefault();
+    const data = new FormData(e.currentTarget);
+
+    try {
+      const response = await fetch('/api/subscribe', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({
+          email: data.get('email'),
+          targetingAllowed: isChecked,
+        }),
+      });
+
+      if (!response?.ok) {
+        throw new Error(`Invalid response: ${response.status}`);
+      }
+
+      const formResponse: z.infer<typeof ResponseSchema> =
+        await response.json();
+
+      router.push('/success');
+    } catch (err) {
+      console.log(err);
+      alert('Error');
+    }
+  }
+
+  function handleCheckboxChange() {
+    setIsChecked(!isChecked);
+  }
+
+  return (
+    <VerticalLayout>
+      <form className="container" onSubmit={handleSubmit}>
+        <h1>Subscribe to newsletter</h1>
+        <div className="email block">
+          <label htmlFor="frm-email">Email</label>
+          <input
+            placeholder="example@email.com"
+            id="email"
+            type="email"
+            name="email"
+            required
+          />
+        </div>
+        <div className="checkbox block">
+          <label htmlFor="frm-checkbox">Allow advertising</label>
+          <input
+            id="targetingAllowed"
+            type="checkbox"
+            name="targetingAllowed"
+            checked={isChecked}
+            onChange={handleCheckboxChange}
+          />
+        </div>
+        <div className="button block">
+          <button type="submit">Subscribe</button>
+        </div>
+      </form>
+      <Button label="Home" onClick={() => router.push('/')} />
+      <Button label="Unsubscribe" onClick={() => router.push('/unsubscribe')} />
+    </VerticalLayout>
+  );
+}

app/success/page.tsx

@@ -0,0 +1,14 @@
+import { useRouter } from 'next/router';
+import { Button } from '../../components/Button';
+import { VerticalLayout } from '../../components/VerticalLayout';
+
+export default function Home() {
+  const router = useRouter();
+
+  return (
+    <VerticalLayout>
+      <h1>Success!</h1>
+      <Button label="Home" onClick={() => router.push('/')} />
+    </VerticalLayout>
+  );
+}

app/unsubscribe/page.tsx

@@ -0,0 +1,63 @@
+'use client';
+import { useRouter } from 'next/navigation';
+import React from 'react';
+import { z } from 'zod';
+import { Button } from '../../components/Button';
+import { VerticalLayout } from '../../components/VerticalLayout';
+import { ResponseSchema } from './../utils/types';
+
+export default function Home() {
+  const router = useRouter();
+
+  async function handleSubmit(e: React.FormEvent<HTMLFormElement>) {
+    e.preventDefault();
+    const data = new FormData(e.currentTarget);
+
+    try {
+      const response = await fetch('/api/unsubscribe', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({
+          email: data.get('email'),
+        }),
+      });
+
+      if (!response?.ok) {
+        throw new Error(`Invalid response: ${response.status}`);
+      }
+
+      const formResponse: z.infer<typeof ResponseSchema> =
+        await response.json();
+
+      router.push('/success');
+    } catch (err) {
+      console.log(err);
+      alert('Error');
+    }
+  }
+
+  return (
+    <VerticalLayout>
+      <form className="container" onSubmit={handleSubmit}>
+        <h1>Unsubscribe newsletter</h1>
+        <div className="email block">
+          <label htmlFor="frm-email">Email</label>
+          <input
+            placeholder="example@email.com"
+            id="email"
+            type="email"
+            name="email"
+            required
+          />
+        </div>
+        <div className="button block">
+          <button type="submit">Unsubscribe</button>
+        </div>
+      </form>
+      <Button label="Home" onClick={() => router.push('/')} />
+      <Button label="Subscribe" onClick={() => router.push('/subscribe')} />
+    </VerticalLayout>
+  );
+}

app/utils/types.ts

@@ -0,0 +1,25 @@
+import { z } from 'zod';
+
+export const ResponseSchema = z.object({
+  message: z.string(),
+});
+
+export const SubscribeFormSchema = z.object({
+  email: z.string().email(),
+  targetingAllowed: z.boolean(),
+});
+
+export const UnsubscribeFormSchema = z.object({
+  email: z.string().email(),
+});
+
+export const NewsSchema = z.object({
+  id: z.number(),
+  title: z.string(),
+  text: z.string().optional(),
+  type: z.string(),
+  by: z.string(),
+  time: z.number(),
+  url: z.string().optional(),
+  score: z.number(),
+});

app/utils/urls.ts

@@ -0,0 +1,3 @@
+export const topNews = 'https://hacker-news.firebaseio.com/v0/topstories.json';
+export const singleNews = (id: number) =>
+  `https://hacker-news.firebaseio.com/v0/item/${id}.json`;

components/Button.tsx

@@ -0,0 +1,10 @@
+interface ButtonProps {
+  label: string;
+  onClick: () => void;
+}
+
+export const Button = ({ label, onClick }: ButtonProps) => (
+  <button onClick={onClick} key={1} className="overflow-hidden rounded-md">
+    <h1>{label}</h1>
+  </button>
+);

components/VerticalLayout.tsx

@@ -0,0 +1,14 @@
+export const VerticalLayout = ({ children }: { children: React.ReactNode }) => {
+  return (
+    <div
+      style={{
+        display: 'flex',
+        flexDirection: 'column',
+        alignItems: 'center',
+        gap: '16px',
+      }}
+    >
+      {children}
+    </div>
+  );
+};

next.config.js

@@ -0,0 +1,4 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {}
+
+module.exports = nextConfig

package.json

@@ -0,0 +1,35 @@
+{
+  "name": "next-newsletter",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev",
+    "build": "prisma generate && next build",
+    "start": "next start",
+    "lint": "next lint",
+    "typecheck": "tsc --noEmit",
+    "vercel:link": "vercel link",
+    "vercel:env": "vercel env pull .env",
+    "prisma:push": "npx prisma db push",
+    "prisma:generate": "npx prisma generate"
+  },
+  "dependencies": {
+    "@prisma/client": "^5.6.0",
+    "next": "14.0.3",
+    "react": "^18",
+    "react-dom": "^18",
+    "zod": "^3.22.4"
+  },
+  "devDependencies": {
+    "@types/node": "^20",
+    "@types/react": "^18",
+    "@types/react-dom": "^18",
+    "autoprefixer": "^10.0.1",
+    "eslint": "^8",
+    "eslint-config-next": "14.0.3",
+    "postcss": "^8",
+    "prisma": "^5.6.0",
+    "tailwindcss": "^3.3.0",
+    "typescript": "^5"
+  }
+}

postcss.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}

prisma/prisma.ts

@@ -0,0 +1,15 @@
+import { PrismaClient } from '@prisma/client';
+
+// PrismaClient is attached to the `global` object in development to prevent
+// exhausting your database connection limit.
+//
+// Learn more:
+// https://pris.ly/d/help/next-js-best-practices
+
+const globalForPrisma = global as unknown as { prisma: PrismaClient };
+
+export const prisma = globalForPrisma.prisma || new PrismaClient();
+
+if (process.env.NODE_ENV !== 'production') globalForPrisma.prisma = prisma;
+
+export default prisma;

prisma/schema.prisma

@@ -0,0 +1,30 @@
+generator client {
+  provider = "prisma-client-js"
+}
+
+datasource db {
+  provider = "postgresql"
+  url = env("POSTGRES_PRISMA_URL") // uses connection pooling
+  directUrl = env("POSTGRES_URL_NON_POOLING") // uses a direct connection
+}
+
+model User {
+  id            String       @default(cuid()) @id
+  email         String?   @unique
+  targetingAllowed Boolean @default(false)
+  createdAt     DateTime  @default(now()) @map(name: "created_at")
+  @@map(name: "users")
+}
+
+model News {
+  id  Float @unique @id
+  title String
+  text String?
+  type String
+  by String
+  time Float
+  url String?
+  score Float
+  createdAt DateTime @default(now()) @map(name: "created_at")
+  @@map(name: "news")
+}

public/next.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>

public/vercel.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 283 64"><path fill="black" d="M141 16c-11 0-19 7-19 18s9 18 20 18c7 0 13-3 16-7l-7-5c-2 3-6 4-9 4-5 0-9-3-10-7h28v-3c0-11-8-18-19-18zm-9 15c1-4 4-7 9-7s8 3 9 7h-18zm117-15c-11 0-19 7-19 18s9 18 20 18c6 0 12-3 16-7l-8-5c-2 3-5 4-8 4-5 0-9-3-11-7h28l1-3c0-11-8-18-19-18zm-10 15c2-4 5-7 10-7s8 3 9 7h-19zm-39 3c0 6 4 10 10 10 4 0 7-2 9-5l8 5c-3 5-9 8-17 8-11 0-19-7-19-18s8-18 19-18c8 0 14 3 17 8l-8 5c-2-3-5-5-9-5-6 0-10 4-10 10zm83-29v46h-9V5h9zM37 0l37 64H0L37 0zm92 5-27 48L74 5h10l18 30 17-30h10zm59 12v10l-3-1c-6 0-10 4-10 10v15h-9V17h9v9c0-5 6-9 13-9z"/></svg>

tailwind.config.ts

@@ -0,0 +1,20 @@
+import type { Config } from 'tailwindcss'
+
+const config: Config = {
+  content: [
+    './src/pages/**/*.{js,ts,jsx,tsx,mdx}',
+    './src/components/**/*.{js,ts,jsx,tsx,mdx}',
+    './src/app/**/*.{js,ts,jsx,tsx,mdx}',
+  ],
+  theme: {
+    extend: {
+      backgroundImage: {
+        'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))',
+        'gradient-conic':
+          'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))',
+      },
+    },
+  },
+  plugins: [],
+}
+export default config

tsconfig.json

@@ -0,0 +1,27 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve",
+    "incremental": true,
+    "plugins": [
+      {
+        "name": "next"
+      }
+    ],
+    "paths": {
+      "@/*": ["./app/*"]
+    }
+  },
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "exclude": ["node_modules"]
+}

vercel.json

@@ -0,0 +1,8 @@
+{
+  "crons": [
+    {
+      "path": "/api/cron",
+      "schedule": "0 6 * * *"
+    }
+  ]
+}