93 lines
No EOL
2.3 KiB
Markdown
93 lines
No EOL
2.3 KiB
Markdown
Advanced
|
|
|
|
- server actions
|
|
able to use forms in server component
|
|
https://inv.in.projectsegfau.lt/watch?v=Yc2MJYwLqzs
|
|
- sending form data
|
|
https://nextjs.org/docs/pages/building-your-application/data-fetching/forms-and-mutations
|
|
https://www.youtube.com/watch?v=AbLAxs-7yl0
|
|
for `application/x-www-form-urlencoded`
|
|
just use
|
|
```jsx
|
|
<form action="/route/api" method="POST">
|
|
<input type="text" name="city">
|
|
</form>
|
|
|
|
const onSubmit = async (e) => {
|
|
e.preventDefault();
|
|
|
|
const formData = new FormData(e.currentTarget);
|
|
|
|
const response = await fetch("/addschool/api", {
|
|
method: "POST",
|
|
body: formData,
|
|
});
|
|
};
|
|
|
|
```
|
|
this will just Formdata which is not multipart but of urlencoded and field will be `city`
|
|
|
|
for multipart form data
|
|
|
|
```html
|
|
<form onSubmit={onSubmit}>
|
|
<input type="text" name="city">
|
|
</form>
|
|
```
|
|
|
|
- receiving form data
|
|
```js
|
|
import { redirect } from "next/navigation";
|
|
import fs from "fs";
|
|
|
|
export async function POST(request) {
|
|
// console.log("request: ", request.body);
|
|
|
|
const formData = await request.formData();
|
|
|
|
console.log(formData);
|
|
|
|
const number = formData.get("contactNumber");
|
|
|
|
const file = formData.get("imageAttachment");
|
|
|
|
const fileBuffer = Buffer.from(await file.arrayBuffer());
|
|
|
|
console.log("fileBuffer: ", fileBuffer);
|
|
|
|
fs.writeFileSync(file.name, fileBuffer);
|
|
|
|
console.log("number ", number);
|
|
|
|
redirect("/addschool");
|
|
}
|
|
|
|
|
|
```
|
|
- uploading file in vercel blob
|
|
https://vercel.com/brads-projects-55888f01/~/stores/blob/store_I4WjQqMnSOkFDxWt/guides
|
|
- standalone builds
|
|
node modules may contain lot of modules that are not required so
|
|
1. configure next.config.js like this
|
|
```js
|
|
module.exports={
|
|
output : "standalone"
|
|
}
|
|
```
|
|
2. then at dist there is standalone folder is created go to that folder and do `npm i` and then go to root directory
|
|
3. Remove the output standalone config and then build it again to have folder `.next`, copy this folder in standalone directory and when running `npm run start` it will run this build
|
|
- remove type errors in nextjs build
|
|
```js
|
|
// in next.config.js
|
|
module.exports = {
|
|
typescript: {
|
|
// !! WARN !!
|
|
// Dangerously allow production builds to successfully complete even if
|
|
// your project has type errors.
|
|
// !! WARN !!
|
|
ignoreBuildErrors: true,
|
|
},
|
|
}
|
|
```
|
|
|
|
|