Next.js Forms

An open-source web-form app built with Next.js
Express.js and AWS for the REST API and NoSQL database.

Features · Running locally · Overview · API Routing · Authors

Features

• Next.js App Router
• Amazon Web Services for backend functionality
• The Amplify Framework for AWS integration
• Support for REST API, NoSQL Database DynamoDB, and Lambda functions
• Edge runtime-ready
• shadcn/ui
  • Styling with Tailwind CSS
  • Radix UI for headless component primitives
• Cross Origin Resource Sharing for legitimate requests only
• Zod Typesafe Form Validation ensuring sanitized input is always sent

Tech Stack

Overview

A static site is hosted with a contact form. We use API Gateway to create an API which makes a PUT request to our DynamoDB database after the user clicks Register on the form.

The API sends user records to DynamoDB which then pushes the record into the DynamoDB Data Stream.

Running locally

First, run the development server:

npm install
npm run dev

Your app template should now be running on localhost:3000.

API Routing

The REST API is hosted on AWS using a Lambda function which deploys a Serverless Express.js app. Source code for lambda function is in the amplify/backend/function/formfunction/src/app.js

Important

The app template which is running on localhost:3000 is using the REST API hosted on AWS. It has CORS enabled which means your app template will not be able make requests to the REST API hosted on AWS.

Note

To learn more about the Serverless Express.js app and how to deploy it, visit the amplify/README.md

Authors

This project is created by MLSA KIIT team members:

• Sourasish Basu (@SourasishBasu) - MLSA KIIT
• Swapnil Dutta (@rycerzes) - MLSA KIIT

Version

Version	Date	Comments
1.0	21-11-2023	Initial release

Future Roadmap

• Authentication and Authorization using API Keys
• HTTPS Validation
• Input Validation and Sanitization on server side
• Better Error Handling