add mailing system

This commit is contained in:
Tben 2022-01-06 09:05:14 +01:00
parent 22215f3e1b
commit 9ba975cc92
8 changed files with 291 additions and 148 deletions

2
.gitignore vendored
View File

@ -1,2 +1,4 @@
node_modules node_modules
.next .next
node_shell
.env

View File

@ -0,0 +1,31 @@
export default async function submitContactForm(e, setSuccess) {
e.preventDefault();
let name = e.target[0].value;
let email = e.target[1].value;
let message = e.target[2].value;
let body = {
name: name,
email: email,
message: message,
};
let res = await fetch("/api/contactForm", {
method: "post",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(body),
});
let data = await res.json();
console.log(data);
if (data.msg === "Success") {
setSuccess("Success");
} else {
setSuccess("Failed");
}
}

299
package-lock.json generated
View File

@ -5,10 +5,12 @@
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "personal_site",
"version": "1.0.0", "version": "1.0.0",
"license": "ISC", "license": "ISC",
"dependencies": { "dependencies": {
"next": "^12.0.4", "next": "^12.0.4",
"nodemailer": "^6.7.2",
"react": "^17.0.2", "react": "^17.0.2",
"react-dom": "^17.0.2" "react-dom": "^17.0.2"
} }
@ -711,19 +713,19 @@
"integrity": "sha512-jDJTpta+P4p1NZTFVLHJ/TLFVYVcOqv6l8xwOeBKNPMgY/zDYH/YH7SJbvrr/h1RcS9GzbPcLKGzpuK9cV56UA==" "integrity": "sha512-jDJTpta+P4p1NZTFVLHJ/TLFVYVcOqv6l8xwOeBKNPMgY/zDYH/YH7SJbvrr/h1RcS9GzbPcLKGzpuK9cV56UA=="
}, },
"node_modules/@next/env": { "node_modules/@next/env": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/env/-/env-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/env/-/env-12.0.7.tgz",
"integrity": "sha512-QtZ6X5c6Zqa7oWs5csEmZ7xy+gLdtRKKg02SOT5l0Ziea4P5IU8mSOCyNC4fZmXewcRVjpbY+yGqAAP7hJUfOA==" "integrity": "sha512-TNDqBV37wd95SiNdZsSUq8gnnrTwr+aN9wqy4Zxrxw4bC/jCHNsbK94DxjkG99VL30VCRXXDBTA1/Wa2jIpF9Q=="
}, },
"node_modules/@next/polyfill-module": { "node_modules/@next/polyfill-module": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/polyfill-module/-/polyfill-module-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/polyfill-module/-/polyfill-module-12.0.7.tgz",
"integrity": "sha512-mk9yCDNpfXINTJKFTZNgwYs7eqRFpc5D/49O/fKB59blihyKl1GY1sZ0l7a2bn5l1X/WuaZzcIfqnrwkneqeaQ==" "integrity": "sha512-sA8LAMMlmcspIZw/jeQuJTyA3uGrqOhTBaQE+G9u6DPohqrBFRkaz7RzzJeqXkUXw600occsIBknSjyVd1R67A=="
}, },
"node_modules/@next/react-dev-overlay": { "node_modules/@next/react-dev-overlay": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/react-dev-overlay/-/react-dev-overlay-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/react-dev-overlay/-/react-dev-overlay-12.0.7.tgz",
"integrity": "sha512-9O0lXyzv5goFSmDwq9Hp8JE+DcObvd+bTXvmGSSvYR91AlIoVlH8/PwATx8Rf5YEuqggn/XKR1hn2kBYcbcGnA==", "integrity": "sha512-dSQLgpZ5uzyittFtIHlJCLAbc0LlMFbRBSYuGsIlrtGyjYN+WMcnz8lK48VLxNPFGuB/hEzkWV4TW5Zu75+Fzg==",
"dependencies": { "dependencies": {
"@babel/code-frame": "7.12.11", "@babel/code-frame": "7.12.11",
"anser": "1.4.9", "anser": "1.4.9",
@ -813,9 +815,9 @@
} }
}, },
"node_modules/@next/react-refresh-utils": { "node_modules/@next/react-refresh-utils": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/react-refresh-utils/-/react-refresh-utils-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/react-refresh-utils/-/react-refresh-utils-12.0.7.tgz",
"integrity": "sha512-kNUDmpBaJ+8Lb8CtKNynRFF9oijCjUKKru6Ont+JKhti9//5dNFFIcuo607bJSH86un06OEK0TZUt5XWVlbkjw==", "integrity": "sha512-Pglj1t+7RxH0txEqVcD8ZxrJgqLDmKvQDqxKq3ZPRWxMv7LTl7FVT2Pnb36QFeBwCvMVl67jxsADKsW0idz8sA==",
"peerDependencies": { "peerDependencies": {
"react-refresh": "0.8.3", "react-refresh": "0.8.3",
"webpack": "^4 || ^5" "webpack": "^4 || ^5"
@ -827,9 +829,9 @@
} }
}, },
"node_modules/@next/swc-android-arm64": { "node_modules/@next/swc-android-arm64": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-android-arm64/-/swc-android-arm64-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-android-arm64/-/swc-android-arm64-12.0.7.tgz",
"integrity": "sha512-6mXumia8ZPcy7bYu9kjItfWxrE6SFaJyqQDaFy9G9WrU9x3M1R1Yok8B2X1mboM8itD0tq+t3R/ebQEkkmevUw==", "integrity": "sha512-yViT7EEc7JqxncRT+ZTeTsrAYXLlcefo0Y0eAfYmmalGD2605L4FWAVrJi4WnrSLji7l+veczw1WBmNeHICKKA==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
@ -842,9 +844,9 @@
} }
}, },
"node_modules/@next/swc-darwin-arm64": { "node_modules/@next/swc-darwin-arm64": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-12.0.7.tgz",
"integrity": "sha512-7WMen1qhF5JmjKD9S5IEgEoaPJOXyIZj/Nsqa8ZSWxdF5oogp3uYYbKb/rvMYoKzpIbjyoLH/OCM5lm5IFM4iw==", "integrity": "sha512-vhAyW2rDEUcQesRVaj0z1hSoz7QhDzzGd0V1/5/5i9YJOfOtyrPsVJ82tlf7BfXl6/Ep+eKNfWVIb5/Jv89EKg==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
@ -857,9 +859,9 @@
} }
}, },
"node_modules/@next/swc-darwin-x64": { "node_modules/@next/swc-darwin-x64": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-12.0.7.tgz",
"integrity": "sha512-PVgefMWjxP6CU1HQs39+Bfpjcue6qErJfvJ/+n2zimjLzyeQAmD6LM9f1lDSttW2LjKjasoxR5qkRNLVlqzlaA==", "integrity": "sha512-km+6Rx6TvbraoQ1f0MXa69ol/x0RxzucFGa2OgZaYJERas0spy0iwW8hpASsGcf597D8VRW1x+R2C7ZdjVBSTw==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
@ -872,9 +874,9 @@
} }
}, },
"node_modules/@next/swc-linux-arm-gnueabihf": { "node_modules/@next/swc-linux-arm-gnueabihf": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-linux-arm-gnueabihf/-/swc-linux-arm-gnueabihf-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-linux-arm-gnueabihf/-/swc-linux-arm-gnueabihf-12.0.7.tgz",
"integrity": "sha512-8xGQu3sJiIdriKiCux3jDJ9pwivELEg7z2zfW0CqmQMbKNB7qP9lc0pq6CxshtKyXRMczNWRMtQ3Cjwep+UvNg==", "integrity": "sha512-d0zWr877YqZ2cf/DQy6obouaR39r0FPebcXj2nws9AC99m68CO2xVpWv9jT7mFvpY+T40HJisLH80jSZ2iQ9sA==",
"cpu": [ "cpu": [
"arm" "arm"
], ],
@ -887,9 +889,9 @@
} }
}, },
"node_modules/@next/swc-linux-arm64-gnu": { "node_modules/@next/swc-linux-arm64-gnu": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-12.0.7.tgz",
"integrity": "sha512-HhEWcBkqGr3E7SYLtN9VnYUGamAWaLcXawHN33Em0WP7gzXrBqz0iIJNH7uEzHDS6980EqU/rrkLyhCHrYSZgQ==", "integrity": "sha512-fdobh5u6gG13Gd5LkHhJ+W8tF9hbaFolRW99FhzArMe5/nMKlLdBymOxvitE3K4gSFQxbXJA6TbU0Vv0e59Kww==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
@ -902,9 +904,9 @@
} }
}, },
"node_modules/@next/swc-linux-arm64-musl": { "node_modules/@next/swc-linux-arm64-musl": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-12.0.7.tgz",
"integrity": "sha512-oZyQ9wjtE7OX9RlnovP7izNx2AR/RzTuYWU4Ttim8ssABsipQSxSlfRaeb+Qi6jTc6k+lrPhjRfaZ+fGv/m2Ag==", "integrity": "sha512-vx0c5Q3oIScFNT/4jI9rCe0yPzKuCqWOkiO/OOV0ixSI2gLhbrwDIcdkm79fKVn3i8JOJunxE4zDoFeR/g8xqQ==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
@ -917,9 +919,9 @@
} }
}, },
"node_modules/@next/swc-linux-x64-gnu": { "node_modules/@next/swc-linux-x64-gnu": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-12.0.7.tgz",
"integrity": "sha512-aBuf78QzL93T59Lk9kEGfHcA+9SzYIH7dGon1nqVxtAd2iqicKYNVaVcb38VKeiIBXMSUHXTdu6Ee053ZCOmSw==", "integrity": "sha512-9ITyp6s6uGVKNx3C/GP7GrYycbcwTADG7TdIXzXUxOOZORrdB1GNg3w/EL3Am4VMPPEpO6v1RfKo2IKZpVKfTA==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
@ -932,9 +934,9 @@
} }
}, },
"node_modules/@next/swc-linux-x64-musl": { "node_modules/@next/swc-linux-x64-musl": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-12.0.7.tgz",
"integrity": "sha512-yDgqUqL4H8M3Y0hv30ZyL9UvjnK4iXmD4I6iJz+XIHSRdA/VUiyKKoL7okf9hxr0mSxBtagbZ5A3qEoW/VliUQ==", "integrity": "sha512-C+k+cygbIZXYfc+Hx2fNPUBEg7jzio+mniP5ywZevuTXW14zodIfQ3ZMoMJR8EpOVvYpjWFk2uAjiwqgx8vo/g==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
@ -947,9 +949,9 @@
} }
}, },
"node_modules/@next/swc-win32-arm64-msvc": { "node_modules/@next/swc-win32-arm64-msvc": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-12.0.7.tgz",
"integrity": "sha512-evDUrEYsUo+PMHsedaymfZO98VwV9wNFzuWVCyKgqg6SD1ZRpzbpqYQY7aINIuqZVdIWZElBE6EM+oxaj7PuWQ==", "integrity": "sha512-7jTRjOKkDVnb5s7VoHT7eX+eyT/5BQJ/ljP2G56riAgKGqPL63/V7FXemLhhLT67D+OjoP8DRA2E2ne6IPHk4w==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
@ -962,9 +964,9 @@
} }
}, },
"node_modules/@next/swc-win32-ia32-msvc": { "node_modules/@next/swc-win32-ia32-msvc": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-12.0.7.tgz",
"integrity": "sha512-Lbmz0xlo8vW4EDWyzCfy3nGfqt7skqwxaERwe+vDVTBZ56mvJ5dsdyjqK24sxu4FFkWR7SaU4eNlHwZR+A3kTg==", "integrity": "sha512-2u5pGDsk7H6gGxob2ATIojzlwKzgYsrijo7RRpXOiPePVqwPWg6/pmhaJzLdpfjaBgRg1NFmwSp/7Ump9X8Ijg==",
"cpu": [ "cpu": [
"ia32" "ia32"
], ],
@ -977,9 +979,9 @@
} }
}, },
"node_modules/@next/swc-win32-x64-msvc": { "node_modules/@next/swc-win32-x64-msvc": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-12.0.7.tgz",
"integrity": "sha512-f+7WNIJOno5QEelrmob+3vN5EZJb3KCkOrnvUsQ0+LCCD0dIPIhCjeHAh3BGj9msGu8ijnXvD7JxVxE5V26cnQ==", "integrity": "sha512-frEWtbf+q8Oz4e2UqKJrNssk6DZ6/NLCQXn5/ORWE9dPAfe9XS6aK5FRZ6DuEPmmKd5gOoRkKJFFz5nYd+TeyQ==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
@ -1792,9 +1794,9 @@
} }
}, },
"node_modules/graceful-fs": { "node_modules/graceful-fs": {
"version": "4.2.8", "version": "4.2.9",
"resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.8.tgz", "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.9.tgz",
"integrity": "sha512-qkIilPUYcNhJpd33n0GBXTB1MMPp14TxEsEs0pTrsSVucApsYzW5V+Q8Qxhik6KU3evy+qkAAowTByymK0avdg==" "integrity": "sha512-NtNxqUcXgpW2iMrfqSfR73Glt39K+BLwWsPs94yR63v45T0Wbej7eRmL5cWfwEgqXnmjQp3zaJTshdRW/qC2ZQ=="
}, },
"node_modules/has": { "node_modules/has": {
"version": "1.0.3", "version": "1.0.3",
@ -2404,17 +2406,17 @@
} }
}, },
"node_modules/next": { "node_modules/next": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/next/-/next-12.0.4.tgz", "resolved": "https://registry.npmjs.org/next/-/next-12.0.7.tgz",
"integrity": "sha512-1pvjcSZBm5OLoGmDhp4JwKwIE798WbqUNLuyU7w6a2jUkdWaxOYtkE/ROXQTi2pXHj7+6rm68AvhxROLX2NHQg==", "integrity": "sha512-sKO8GJJYfuk9c+q+zHSNumvff+wP7ufmOlwT6BuzwiYfFJ61VTTkfTcDLSJ+95ErQJiC54uS4Yg5JEE8H6jXRA==",
"dependencies": { "dependencies": {
"@babel/runtime": "7.15.4", "@babel/runtime": "7.15.4",
"@hapi/accept": "5.0.2", "@hapi/accept": "5.0.2",
"@napi-rs/triples": "1.0.3", "@napi-rs/triples": "1.0.3",
"@next/env": "12.0.4", "@next/env": "12.0.7",
"@next/polyfill-module": "12.0.4", "@next/polyfill-module": "12.0.7",
"@next/react-dev-overlay": "12.0.4", "@next/react-dev-overlay": "12.0.7",
"@next/react-refresh-utils": "12.0.4", "@next/react-refresh-utils": "12.0.7",
"acorn": "8.5.0", "acorn": "8.5.0",
"assert": "2.0.0", "assert": "2.0.0",
"browserify-zlib": "0.2.0", "browserify-zlib": "0.2.0",
@ -2456,7 +2458,7 @@
"use-subscription": "1.5.1", "use-subscription": "1.5.1",
"util": "0.12.4", "util": "0.12.4",
"vm-browserify": "1.1.2", "vm-browserify": "1.1.2",
"watchpack": "2.1.1" "watchpack": "2.3.0"
}, },
"bin": { "bin": {
"next": "dist/bin/next" "next": "dist/bin/next"
@ -2465,23 +2467,23 @@
"node": ">=12.22.0" "node": ">=12.22.0"
}, },
"optionalDependencies": { "optionalDependencies": {
"@next/swc-android-arm64": "12.0.4", "@next/swc-android-arm64": "12.0.7",
"@next/swc-darwin-arm64": "12.0.4", "@next/swc-darwin-arm64": "12.0.7",
"@next/swc-darwin-x64": "12.0.4", "@next/swc-darwin-x64": "12.0.7",
"@next/swc-linux-arm-gnueabihf": "12.0.4", "@next/swc-linux-arm-gnueabihf": "12.0.7",
"@next/swc-linux-arm64-gnu": "12.0.4", "@next/swc-linux-arm64-gnu": "12.0.7",
"@next/swc-linux-arm64-musl": "12.0.4", "@next/swc-linux-arm64-musl": "12.0.7",
"@next/swc-linux-x64-gnu": "12.0.4", "@next/swc-linux-x64-gnu": "12.0.7",
"@next/swc-linux-x64-musl": "12.0.4", "@next/swc-linux-x64-musl": "12.0.7",
"@next/swc-win32-arm64-msvc": "12.0.4", "@next/swc-win32-arm64-msvc": "12.0.7",
"@next/swc-win32-ia32-msvc": "12.0.4", "@next/swc-win32-ia32-msvc": "12.0.7",
"@next/swc-win32-x64-msvc": "12.0.4" "@next/swc-win32-x64-msvc": "12.0.7"
}, },
"peerDependencies": { "peerDependencies": {
"fibers": ">= 3.1.0", "fibers": ">= 3.1.0",
"node-sass": "^4.0.0 || ^5.0.0 || ^6.0.0", "node-sass": "^4.0.0 || ^5.0.0 || ^6.0.0",
"react": "^17.0.2 || ^18.0.0", "react": "^17.0.2 || ^18.0.0-0",
"react-dom": "^17.0.2 || ^18.0.0", "react-dom": "^17.0.2 || ^18.0.0-0",
"sass": "^1.3.0" "sass": "^1.3.0"
}, },
"peerDependenciesMeta": { "peerDependenciesMeta": {
@ -2517,6 +2519,14 @@
"resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.77.tgz", "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.77.tgz",
"integrity": "sha512-rB1DUFUNAN4Gn9keO2K1efO35IDK7yKHCdCaIMvFO7yUYmmZYeDjnGKle26G4rwj+LKRQpjyUUvMkPglwGCYNQ==" "integrity": "sha512-rB1DUFUNAN4Gn9keO2K1efO35IDK7yKHCdCaIMvFO7yUYmmZYeDjnGKle26G4rwj+LKRQpjyUUvMkPglwGCYNQ=="
}, },
"node_modules/nodemailer": {
"version": "6.7.2",
"resolved": "https://registry.npmjs.org/nodemailer/-/nodemailer-6.7.2.tgz",
"integrity": "sha512-Dz7zVwlef4k5R71fdmxwR8Q39fiboGbu3xgswkzGwczUfjp873rVxt1O46+Fh0j1ORnAC6L9+heI8uUpO6DT7Q==",
"engines": {
"node": ">=6.0.0"
}
},
"node_modules/normalize-path": { "node_modules/normalize-path": {
"version": "3.0.0", "version": "3.0.0",
"resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz", "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
@ -3265,9 +3275,9 @@
"integrity": "sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ==" "integrity": "sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ=="
}, },
"node_modules/watchpack": { "node_modules/watchpack": {
"version": "2.1.1", "version": "2.3.0",
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.1.1.tgz", "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.3.0.tgz",
"integrity": "sha512-Oo7LXCmc1eE1AjyuSBmtC3+Wy4HcV8PxWh2kP6fOl8yTlNS7r0K9l1ao2lrrUza7V39Y3D/BbJgY8VeSlc5JKw==", "integrity": "sha512-MnN0Q1OsvB/GGHETrFeZPQaOelWh/7O+EiFlj8sM9GPjtQkis7k01aAxrg/18kTfoIVcLL+haEVFlXDaSRwKRw==",
"dependencies": { "dependencies": {
"glob-to-regexp": "^0.4.1", "glob-to-regexp": "^0.4.1",
"graceful-fs": "^4.1.2" "graceful-fs": "^4.1.2"
@ -3902,19 +3912,19 @@
"integrity": "sha512-jDJTpta+P4p1NZTFVLHJ/TLFVYVcOqv6l8xwOeBKNPMgY/zDYH/YH7SJbvrr/h1RcS9GzbPcLKGzpuK9cV56UA==" "integrity": "sha512-jDJTpta+P4p1NZTFVLHJ/TLFVYVcOqv6l8xwOeBKNPMgY/zDYH/YH7SJbvrr/h1RcS9GzbPcLKGzpuK9cV56UA=="
}, },
"@next/env": { "@next/env": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/env/-/env-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/env/-/env-12.0.7.tgz",
"integrity": "sha512-QtZ6X5c6Zqa7oWs5csEmZ7xy+gLdtRKKg02SOT5l0Ziea4P5IU8mSOCyNC4fZmXewcRVjpbY+yGqAAP7hJUfOA==" "integrity": "sha512-TNDqBV37wd95SiNdZsSUq8gnnrTwr+aN9wqy4Zxrxw4bC/jCHNsbK94DxjkG99VL30VCRXXDBTA1/Wa2jIpF9Q=="
}, },
"@next/polyfill-module": { "@next/polyfill-module": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/polyfill-module/-/polyfill-module-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/polyfill-module/-/polyfill-module-12.0.7.tgz",
"integrity": "sha512-mk9yCDNpfXINTJKFTZNgwYs7eqRFpc5D/49O/fKB59blihyKl1GY1sZ0l7a2bn5l1X/WuaZzcIfqnrwkneqeaQ==" "integrity": "sha512-sA8LAMMlmcspIZw/jeQuJTyA3uGrqOhTBaQE+G9u6DPohqrBFRkaz7RzzJeqXkUXw600occsIBknSjyVd1R67A=="
}, },
"@next/react-dev-overlay": { "@next/react-dev-overlay": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/react-dev-overlay/-/react-dev-overlay-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/react-dev-overlay/-/react-dev-overlay-12.0.7.tgz",
"integrity": "sha512-9O0lXyzv5goFSmDwq9Hp8JE+DcObvd+bTXvmGSSvYR91AlIoVlH8/PwATx8Rf5YEuqggn/XKR1hn2kBYcbcGnA==", "integrity": "sha512-dSQLgpZ5uzyittFtIHlJCLAbc0LlMFbRBSYuGsIlrtGyjYN+WMcnz8lK48VLxNPFGuB/hEzkWV4TW5Zu75+Fzg==",
"requires": { "requires": {
"@babel/code-frame": "7.12.11", "@babel/code-frame": "7.12.11",
"anser": "1.4.9", "anser": "1.4.9",
@ -3975,75 +3985,75 @@
} }
}, },
"@next/react-refresh-utils": { "@next/react-refresh-utils": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/react-refresh-utils/-/react-refresh-utils-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/react-refresh-utils/-/react-refresh-utils-12.0.7.tgz",
"integrity": "sha512-kNUDmpBaJ+8Lb8CtKNynRFF9oijCjUKKru6Ont+JKhti9//5dNFFIcuo607bJSH86un06OEK0TZUt5XWVlbkjw==", "integrity": "sha512-Pglj1t+7RxH0txEqVcD8ZxrJgqLDmKvQDqxKq3ZPRWxMv7LTl7FVT2Pnb36QFeBwCvMVl67jxsADKsW0idz8sA==",
"requires": {} "requires": {}
}, },
"@next/swc-android-arm64": { "@next/swc-android-arm64": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-android-arm64/-/swc-android-arm64-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-android-arm64/-/swc-android-arm64-12.0.7.tgz",
"integrity": "sha512-6mXumia8ZPcy7bYu9kjItfWxrE6SFaJyqQDaFy9G9WrU9x3M1R1Yok8B2X1mboM8itD0tq+t3R/ebQEkkmevUw==", "integrity": "sha512-yViT7EEc7JqxncRT+ZTeTsrAYXLlcefo0Y0eAfYmmalGD2605L4FWAVrJi4WnrSLji7l+veczw1WBmNeHICKKA==",
"optional": true "optional": true
}, },
"@next/swc-darwin-arm64": { "@next/swc-darwin-arm64": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-12.0.7.tgz",
"integrity": "sha512-7WMen1qhF5JmjKD9S5IEgEoaPJOXyIZj/Nsqa8ZSWxdF5oogp3uYYbKb/rvMYoKzpIbjyoLH/OCM5lm5IFM4iw==", "integrity": "sha512-vhAyW2rDEUcQesRVaj0z1hSoz7QhDzzGd0V1/5/5i9YJOfOtyrPsVJ82tlf7BfXl6/Ep+eKNfWVIb5/Jv89EKg==",
"optional": true "optional": true
}, },
"@next/swc-darwin-x64": { "@next/swc-darwin-x64": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-12.0.7.tgz",
"integrity": "sha512-PVgefMWjxP6CU1HQs39+Bfpjcue6qErJfvJ/+n2zimjLzyeQAmD6LM9f1lDSttW2LjKjasoxR5qkRNLVlqzlaA==", "integrity": "sha512-km+6Rx6TvbraoQ1f0MXa69ol/x0RxzucFGa2OgZaYJERas0spy0iwW8hpASsGcf597D8VRW1x+R2C7ZdjVBSTw==",
"optional": true "optional": true
}, },
"@next/swc-linux-arm-gnueabihf": { "@next/swc-linux-arm-gnueabihf": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-linux-arm-gnueabihf/-/swc-linux-arm-gnueabihf-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-linux-arm-gnueabihf/-/swc-linux-arm-gnueabihf-12.0.7.tgz",
"integrity": "sha512-8xGQu3sJiIdriKiCux3jDJ9pwivELEg7z2zfW0CqmQMbKNB7qP9lc0pq6CxshtKyXRMczNWRMtQ3Cjwep+UvNg==", "integrity": "sha512-d0zWr877YqZ2cf/DQy6obouaR39r0FPebcXj2nws9AC99m68CO2xVpWv9jT7mFvpY+T40HJisLH80jSZ2iQ9sA==",
"optional": true "optional": true
}, },
"@next/swc-linux-arm64-gnu": { "@next/swc-linux-arm64-gnu": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-12.0.7.tgz",
"integrity": "sha512-HhEWcBkqGr3E7SYLtN9VnYUGamAWaLcXawHN33Em0WP7gzXrBqz0iIJNH7uEzHDS6980EqU/rrkLyhCHrYSZgQ==", "integrity": "sha512-fdobh5u6gG13Gd5LkHhJ+W8tF9hbaFolRW99FhzArMe5/nMKlLdBymOxvitE3K4gSFQxbXJA6TbU0Vv0e59Kww==",
"optional": true "optional": true
}, },
"@next/swc-linux-arm64-musl": { "@next/swc-linux-arm64-musl": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-12.0.7.tgz",
"integrity": "sha512-oZyQ9wjtE7OX9RlnovP7izNx2AR/RzTuYWU4Ttim8ssABsipQSxSlfRaeb+Qi6jTc6k+lrPhjRfaZ+fGv/m2Ag==", "integrity": "sha512-vx0c5Q3oIScFNT/4jI9rCe0yPzKuCqWOkiO/OOV0ixSI2gLhbrwDIcdkm79fKVn3i8JOJunxE4zDoFeR/g8xqQ==",
"optional": true "optional": true
}, },
"@next/swc-linux-x64-gnu": { "@next/swc-linux-x64-gnu": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-12.0.7.tgz",
"integrity": "sha512-aBuf78QzL93T59Lk9kEGfHcA+9SzYIH7dGon1nqVxtAd2iqicKYNVaVcb38VKeiIBXMSUHXTdu6Ee053ZCOmSw==", "integrity": "sha512-9ITyp6s6uGVKNx3C/GP7GrYycbcwTADG7TdIXzXUxOOZORrdB1GNg3w/EL3Am4VMPPEpO6v1RfKo2IKZpVKfTA==",
"optional": true "optional": true
}, },
"@next/swc-linux-x64-musl": { "@next/swc-linux-x64-musl": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-12.0.7.tgz",
"integrity": "sha512-yDgqUqL4H8M3Y0hv30ZyL9UvjnK4iXmD4I6iJz+XIHSRdA/VUiyKKoL7okf9hxr0mSxBtagbZ5A3qEoW/VliUQ==", "integrity": "sha512-C+k+cygbIZXYfc+Hx2fNPUBEg7jzio+mniP5ywZevuTXW14zodIfQ3ZMoMJR8EpOVvYpjWFk2uAjiwqgx8vo/g==",
"optional": true "optional": true
}, },
"@next/swc-win32-arm64-msvc": { "@next/swc-win32-arm64-msvc": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-12.0.7.tgz",
"integrity": "sha512-evDUrEYsUo+PMHsedaymfZO98VwV9wNFzuWVCyKgqg6SD1ZRpzbpqYQY7aINIuqZVdIWZElBE6EM+oxaj7PuWQ==", "integrity": "sha512-7jTRjOKkDVnb5s7VoHT7eX+eyT/5BQJ/ljP2G56riAgKGqPL63/V7FXemLhhLT67D+OjoP8DRA2E2ne6IPHk4w==",
"optional": true "optional": true
}, },
"@next/swc-win32-ia32-msvc": { "@next/swc-win32-ia32-msvc": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-12.0.7.tgz",
"integrity": "sha512-Lbmz0xlo8vW4EDWyzCfy3nGfqt7skqwxaERwe+vDVTBZ56mvJ5dsdyjqK24sxu4FFkWR7SaU4eNlHwZR+A3kTg==", "integrity": "sha512-2u5pGDsk7H6gGxob2ATIojzlwKzgYsrijo7RRpXOiPePVqwPWg6/pmhaJzLdpfjaBgRg1NFmwSp/7Ump9X8Ijg==",
"optional": true "optional": true
}, },
"@next/swc-win32-x64-msvc": { "@next/swc-win32-x64-msvc": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-12.0.4.tgz", "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-12.0.7.tgz",
"integrity": "sha512-f+7WNIJOno5QEelrmob+3vN5EZJb3KCkOrnvUsQ0+LCCD0dIPIhCjeHAh3BGj9msGu8ijnXvD7JxVxE5V26cnQ==", "integrity": "sha512-frEWtbf+q8Oz4e2UqKJrNssk6DZ6/NLCQXn5/ORWE9dPAfe9XS6aK5FRZ6DuEPmmKd5gOoRkKJFFz5nYd+TeyQ==",
"optional": true "optional": true
}, },
"@types/node": { "@types/node": {
@ -4692,9 +4702,9 @@
"peer": true "peer": true
}, },
"graceful-fs": { "graceful-fs": {
"version": "4.2.8", "version": "4.2.9",
"resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.8.tgz", "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.9.tgz",
"integrity": "sha512-qkIilPUYcNhJpd33n0GBXTB1MMPp14TxEsEs0pTrsSVucApsYzW5V+Q8Qxhik6KU3evy+qkAAowTByymK0avdg==" "integrity": "sha512-NtNxqUcXgpW2iMrfqSfR73Glt39K+BLwWsPs94yR63v45T0Wbej7eRmL5cWfwEgqXnmjQp3zaJTshdRW/qC2ZQ=="
}, },
"has": { "has": {
"version": "1.0.3", "version": "1.0.3",
@ -5110,28 +5120,28 @@
"integrity": "sha512-zJpuPDwOv8D2zq2WRoMe1HsfZthVewpel9CAvTfc/2mBD1uUT/agc5f7GHGWXlYkFvi1mVxe4IjvP2HNrop7nQ==" "integrity": "sha512-zJpuPDwOv8D2zq2WRoMe1HsfZthVewpel9CAvTfc/2mBD1uUT/agc5f7GHGWXlYkFvi1mVxe4IjvP2HNrop7nQ=="
}, },
"next": { "next": {
"version": "12.0.4", "version": "12.0.7",
"resolved": "https://registry.npmjs.org/next/-/next-12.0.4.tgz", "resolved": "https://registry.npmjs.org/next/-/next-12.0.7.tgz",
"integrity": "sha512-1pvjcSZBm5OLoGmDhp4JwKwIE798WbqUNLuyU7w6a2jUkdWaxOYtkE/ROXQTi2pXHj7+6rm68AvhxROLX2NHQg==", "integrity": "sha512-sKO8GJJYfuk9c+q+zHSNumvff+wP7ufmOlwT6BuzwiYfFJ61VTTkfTcDLSJ+95ErQJiC54uS4Yg5JEE8H6jXRA==",
"requires": { "requires": {
"@babel/runtime": "7.15.4", "@babel/runtime": "7.15.4",
"@hapi/accept": "5.0.2", "@hapi/accept": "5.0.2",
"@napi-rs/triples": "1.0.3", "@napi-rs/triples": "1.0.3",
"@next/env": "12.0.4", "@next/env": "12.0.7",
"@next/polyfill-module": "12.0.4", "@next/polyfill-module": "12.0.7",
"@next/react-dev-overlay": "12.0.4", "@next/react-dev-overlay": "12.0.7",
"@next/react-refresh-utils": "12.0.4", "@next/react-refresh-utils": "12.0.7",
"@next/swc-android-arm64": "12.0.4", "@next/swc-android-arm64": "12.0.7",
"@next/swc-darwin-arm64": "12.0.4", "@next/swc-darwin-arm64": "12.0.7",
"@next/swc-darwin-x64": "12.0.4", "@next/swc-darwin-x64": "12.0.7",
"@next/swc-linux-arm-gnueabihf": "12.0.4", "@next/swc-linux-arm-gnueabihf": "12.0.7",
"@next/swc-linux-arm64-gnu": "12.0.4", "@next/swc-linux-arm64-gnu": "12.0.7",
"@next/swc-linux-arm64-musl": "12.0.4", "@next/swc-linux-arm64-musl": "12.0.7",
"@next/swc-linux-x64-gnu": "12.0.4", "@next/swc-linux-x64-gnu": "12.0.7",
"@next/swc-linux-x64-musl": "12.0.4", "@next/swc-linux-x64-musl": "12.0.7",
"@next/swc-win32-arm64-msvc": "12.0.4", "@next/swc-win32-arm64-msvc": "12.0.7",
"@next/swc-win32-ia32-msvc": "12.0.4", "@next/swc-win32-ia32-msvc": "12.0.7",
"@next/swc-win32-x64-msvc": "12.0.4", "@next/swc-win32-x64-msvc": "12.0.7",
"acorn": "8.5.0", "acorn": "8.5.0",
"assert": "2.0.0", "assert": "2.0.0",
"browserify-zlib": "0.2.0", "browserify-zlib": "0.2.0",
@ -5173,7 +5183,7 @@
"use-subscription": "1.5.1", "use-subscription": "1.5.1",
"util": "0.12.4", "util": "0.12.4",
"vm-browserify": "1.1.2", "vm-browserify": "1.1.2",
"watchpack": "2.1.1" "watchpack": "2.3.0"
} }
}, },
"node-fetch": { "node-fetch": {
@ -5194,6 +5204,11 @@
"resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.77.tgz", "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.77.tgz",
"integrity": "sha512-rB1DUFUNAN4Gn9keO2K1efO35IDK7yKHCdCaIMvFO7yUYmmZYeDjnGKle26G4rwj+LKRQpjyUUvMkPglwGCYNQ==" "integrity": "sha512-rB1DUFUNAN4Gn9keO2K1efO35IDK7yKHCdCaIMvFO7yUYmmZYeDjnGKle26G4rwj+LKRQpjyUUvMkPglwGCYNQ=="
}, },
"nodemailer": {
"version": "6.7.2",
"resolved": "https://registry.npmjs.org/nodemailer/-/nodemailer-6.7.2.tgz",
"integrity": "sha512-Dz7zVwlef4k5R71fdmxwR8Q39fiboGbu3xgswkzGwczUfjp873rVxt1O46+Fh0j1ORnAC6L9+heI8uUpO6DT7Q=="
},
"normalize-path": { "normalize-path": {
"version": "3.0.0", "version": "3.0.0",
"resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz", "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
@ -5771,9 +5786,9 @@
"integrity": "sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ==" "integrity": "sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ=="
}, },
"watchpack": { "watchpack": {
"version": "2.1.1", "version": "2.3.0",
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.1.1.tgz", "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.3.0.tgz",
"integrity": "sha512-Oo7LXCmc1eE1AjyuSBmtC3+Wy4HcV8PxWh2kP6fOl8yTlNS7r0K9l1ao2lrrUza7V39Y3D/BbJgY8VeSlc5JKw==", "integrity": "sha512-MnN0Q1OsvB/GGHETrFeZPQaOelWh/7O+EiFlj8sM9GPjtQkis7k01aAxrg/18kTfoIVcLL+haEVFlXDaSRwKRw==",
"requires": { "requires": {
"glob-to-regexp": "^0.4.1", "glob-to-regexp": "^0.4.1",
"graceful-fs": "^4.1.2" "graceful-fs": "^4.1.2"

View File

@ -25,6 +25,7 @@
"homepage": "https://github.com/BenjaminToby/personal_site#readme", "homepage": "https://github.com/BenjaminToby/personal_site#readme",
"dependencies": { "dependencies": {
"next": "^12.0.4", "next": "^12.0.4",
"nodemailer": "^6.7.2",
"react": "^17.0.2", "react": "^17.0.2",
"react-dom": "^17.0.2" "react-dom": "^17.0.2"
} }

68
pages/api/contactForm.js Normal file
View File

@ -0,0 +1,68 @@
/**
*
*
* Imports
* ------------------------------------------------------------------------------
*
*/
const fs = require("fs");
const nodemailer = require("nodemailer");
/** ********************* Functions and Other API Imports */
// let transporter = nodemailer.createTransport({
// host: "smtp.dreamhost.com",
// port: 465,
// secure: true, // true for 465, false for other ports
// auth: {
// user: "info@tben.design",
// pass: "tobybenoti",
// },
// });
let transporter = nodemailer.createTransport({
host: "smtp.gmail.com",
port: 465,
secure: true,
auth: {
user: "benoti.san@gmail.com",
pass: "pzeacyigrdutlbbr",
},
});
/**
*
*
* API handler
* ------------------------------------------------------------------------------
* @param {Object} req - http incoming request
* @param {Object} res - http response
*
*/
export default async function handler(req, res) {
/** ********************* Get Page Data */
if (req.method === "POST") {
let name = req.body.name;
let email = req.body.email;
let message = req.body.message;
console.log("Message Sending ...");
try {
// send mail with defined transport object
let info = await transporter.sendMail({
from: email, // sender address
to: "benoti.san@gmail.com", // list of receivers
subject: "Tben Client Request", // Subject line
text: "Hello from tben",
html: `<h1>Message from ${name}</h1><p>${message}</p>`, // html body
});
console.log("Message sent: %s", info.messageId);
res.json({ msg: "Success", info: info });
} catch (error) {
console.log(error);
res.json({ msg: "Failed" });
}
}
}

View File

@ -1,8 +1,12 @@
import React from 'react' import React from 'react'
import TextShuffler from '../components/actions/TextShuffler' import TextShuffler from '../components/actions/TextShuffler'
import submitContactForm from '../functions/frontend/submitContactForm'
import GeneralLayout from '../layouts/general_layout/GeneralLayout' import GeneralLayout from '../layouts/general_layout/GeneralLayout'
const contact = () => { const contact = () => {
let [success, setSuccess] = React.useState(false);
return ( return (
<GeneralLayout> <GeneralLayout>
<h1><TextShuffler textInput="Great things await ..." /></h1> <h1><TextShuffler textInput="Great things await ..." /></h1>
@ -10,11 +14,13 @@ const contact = () => {
<TextShuffler textInput="Let's talk" /> <TextShuffler textInput="Let's talk" />
</span> </span>
<form autoComplete='true'> <form autoComplete='on' onSubmit={(e) => { submitContactForm(e, setSuccess) }}>
<input type="text" placeholder='Your Name' /> <input type="text" placeholder='Your Name' autoComplete='name' />
<input type="email" placeholder='Your Email Address' /> <input type="email" placeholder='Your Email Address' autoComplete='email' />
<textarea name="message" id="contact-form-message" cols="30" rows="10" placeholder='Message'></textarea> <textarea name="message" id="contact-form-message" cols="30" rows="10" placeholder='Message'></textarea>
<button type="submit">Submit</button> <button type="submit">Submit</button>
{success === "Success" && <div className='message-response'>Success!!! <button onClick={() => { window.location.reload() }}>Reload</button></div>}
{success === "Failed" && <div className='message-response failed'>Failed <button onClick={() => { window.location.reload() }}>Reload</button></div>}
</form> </form>
</GeneralLayout> </GeneralLayout>
) )

View File

@ -8,7 +8,7 @@ const index = () => {
<GeneralLayout> <GeneralLayout>
<h1><TextShuffler textInput="UI/UX designer, Full Stack Web Developer, Web/graphic/motion designer" /></h1> <h1><TextShuffler textInput="UI/UX designer, Full Stack Web Developer, Web/graphic/motion designer" /></h1>
<span className='hero-sub-text'> <span className='hero-sub-text'>
<TextShuffler textInput="Hi, I'm Ben, a highly talented fullstack web developer with extensive enxperience in web design, frontend and backend development." /> <TextShuffler textInput="Hi, I'm Benjamin Toby, a highly talented fullstack web developer with extensive enxperience in web design, frontend and backend development." />
</span> </span>
<div className="hero-ctas-section"> <div className="hero-ctas-section">
<a href='/documents/Benjamin_Toby_CV.pdf' download={true}>See my resume</a> <a href='/documents/Benjamin_Toby_CV.pdf' download={true}>See my resume</a>

View File

@ -29,7 +29,6 @@ body {
margin: 0px; margin: 0px;
padding: 40px; padding: 40px;
top: 0; top: 0;
display: flex;
justify-content: center; justify-content: center;
background-color: var(--dark-color); background-color: var(--dark-color);
color: white; color: white;
@ -250,6 +249,7 @@ form {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 20px; gap: 20px;
position: relative;
} }
input, input,
@ -262,6 +262,26 @@ textarea {
resize: none; resize: none;
} }
.message-response {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-color: var(--dark-color);
border: 2px solid #688e26;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: 24px;
gap: 10px;
}
.message-response.failed {
border: 2px solid #d42222;
}
/* ############################################################################################### /* ###############################################################################################
################################################################################################## ##################################################################################################
################################################################################################## ##################################################################################################