Skip to content

Commit 48aa00d

Browse files
nooobcodernooobcoder
authored
Merge pull request #5 from nooobcoder/planetscale-tutorial
2 parents 20b2b23 + a8c29d6 commit 48aa00d

File tree

18 files changed

+4279
-0
lines changed

18 files changed

+4279
-0
lines changed

‎planetscale-prisma-tutorial/.eslintrc.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"extends": "next/core-web-vitals"
3+
}

‎planetscale-prisma-tutorial/.gitignore

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
package-lock.json
6+
/.pnp
7+
.pnp.js
8+
9+
# testing
10+
/coverage
11+
12+
# next.js
13+
/.next/
14+
/out/
15+
16+
# production
17+
/build
18+
19+
# misc
20+
.DS_Store
21+
*.pem
22+
23+
# debug
24+
npm-debug.log*
25+
yarn-debug.log*
26+
yarn-error.log*
27+
.pnpm-debug.log*
28+
29+
# local env files
30+
.env*.local
31+
32+
# vercel
33+
.vercel
34+
35+
/dist
36+
/src/*.d.ts

‎planetscale-prisma-tutorial/README.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
Run a local proxy of the pscale database
2+
3+
```bash
4+
pscale connect DB-NAME BRANCH-NAME --port 3309
5+
```

‎planetscale-prisma-tutorial/hoppscotch-docker-compose.yaml

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
version: "3.7"
2+
3+
services:
4+
web:
5+
image: hoppscotch/hoppscotch
6+
volumes:
7+
- "./hoppscotch/.hoppscotch:/app/.hoppscotch"
8+
- "./hoppscotch/assets:/app/assets"
9+
- "./hoppscotch/directives:/app/directives"
10+
- "./hoppscotch/layouts:/app/layouts"
11+
- "./hoppscotch/middleware:/app/middleware"
12+
- "./hoppscotch/pages:/app/pages"
13+
- "./hoppscotch/plugins:/app/plugins"
14+
- "./hoppscotch/static:/app/static"
15+
- "./hoppscotch/store:/app/store"
16+
- "./hoppscotch/components:/app/components"
17+
- "./hoppscotch/helpers:/app/helpers"
18+
ports:
19+
- "7777:3000"
20+
environment:
21+
HOST: 127.0.0.1
22+
command: "npm run dev"

‎planetscale-prisma-tutorial/next.config.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
/** @type {import('next').NextConfig} */
2+
const nextConfig = {
3+
reactStrictMode: true,
4+
}
5+
6+
module.exports = nextConfig

‎planetscale-prisma-tutorial/package.json

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
{
2+
"name": "planetscale-prisma-tutorial",
3+
"version": "0.1.0",
4+
"private": true,
5+
"scripts": {
6+
"dev": "run-p dev:*",
7+
"dev:nextjs": "PORT=4848 next dev",
8+
"dev:studio": "prisma studio --port 5555",
9+
"dev:db-proxy": "pscale connect test-database draft --port 3309",
10+
"build": "PORT=4848 next build",
11+
"start": "next start",
12+
"lint": "next lint"
13+
},
14+
"dependencies": {
15+
"next": "12.1.6",
16+
"prisma": "^3.15.1",
17+
"react": "18.1.0",
18+
"react-dom": "18.1.0"
19+
},
20+
"devDependencies": {
21+
"eslint": "8.17.0",
22+
"eslint-config-next": "12.1.6",
23+
"planetscale": "^2.1.0"
24+
}
25+
}

‎planetscale-prisma-tutorial/pages/_app.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import '../styles/globals.css'
2+
3+
function MyApp({ Component, pageProps }) {
4+
return <Component {...pageProps} />
5+
}
6+
7+
export default MyApp

‎planetscale-prisma-tutorial/pages/api/hello.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
2+
3+
export default function handler(req, res) {
4+
res.status(200).json({ name: 'John Doe' })
5+
}

‎planetscale-prisma-tutorial/pages/api/inquiry.js

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
import { PrismaClient } from '@prisma/client';
2+
3+
const prisma = new PrismaClient();
4+
5+
6+
export default async function handler(req, res) {
7+
if (req.method === 'POST') {
8+
return await createInquiry(req, res);
9+
}
10+
else {
11+
return res.status(405).json({ message: 'Method not allowed', success: false });
12+
}
13+
}
14+
15+
async function createInquiry(req, res) {
16+
const body = req.body;
17+
try {
18+
const newEntry = await prisma.inquiry.create({
19+
data: {
20+
name: body.firstName,
21+
email: body.email,
22+
subject: body.subject,
23+
message: body.message
24+
}
25+
});
26+
return res.status(200).json(newEntry, { success: true });
27+
} catch (error) {
28+
console.error("Request error", error);
29+
res.status(500).json({ error: "Error creating question", success: false });
30+
}
31+
}

‎planetscale-prisma-tutorial/pages/index.js

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
import styles from '../styles/Home.module.css';
2+
import React, { useState } from "react"
3+
4+
export default function Home() {
5+
const [firstName, setFirstName] = useState("");
6+
const [email, setEmail] = useState("");
7+
const [subject, setSubject] = useState("");
8+
const [message, setMessage] = useState("");
9+
10+
const handleSubmit = async (e) => {
11+
e.preventDefault();
12+
const body = { firstName, email, subject, message }
13+
try {
14+
const response = await fetch("/api/inquiry", {
15+
method: "POST",
16+
headers: { "Content-Type": "application/json" },
17+
body: JSON.stringify(body),
18+
});
19+
if (response.status !== 200) {
20+
console.log("something went wrong");
21+
//set an error banner here
22+
} else {
23+
resetForm();
24+
console.log("form submitted successfully !!!")
25+
//set a success banner here
26+
}
27+
//check response, if success is false, dont take them to success page
28+
} catch (error) {
29+
console.log("there was an error submitting", error);
30+
}
31+
}
32+
33+
const resetForm = () => {
34+
setFirstName("");
35+
setEmail("");
36+
setSubject("");
37+
setMessage("");
38+
}
39+
40+
return (
41+
<div className={styles.container}>
42+
<form action="#" method="POST" onSubmit={(e) => handleSubmit(e)}>
43+
<input
44+
type="text"
45+
name="first-name"
46+
id="first-name"
47+
autoComplete="given-name"
48+
onChange={(e) => setFirstName(e.target.value)}
49+
value={firstName}
50+
className="bg-zinc-300 py-3 px-4 block w-full shadow-sm text-gray-200-900 focus:ring-indigo-400 focus:border-indigo-400 border-warm-gray-300 rounded-md"
51+
/>
52+
</form>
53+
</div >
54+
)
55+
}

0 commit comments

Comments
 (0)