Made service with Next.js and PlanetScale

I made a service 'Contact Nite' contact management service with contact form widget for Flutter.

Like above image, you can place contact form widget by just a easy code pasting.

And you can see contacts in this service.

Service
https://contact-nite.com/ja

Pub
https://pub.dev/packages/contact_form

Free plan is provided. If you are interested in, try. I'm also using on my app.

If contacts came, notify by email and Slack notification. And you can send and receive mail on the service. You don't need to open Gmail.

Technology

Package is a simple Flutter package. Service is made by Next.js, PlanetScale, Cloud Run.

PlanetScale

PlanetScale is a Serverless MySQL Service. I knew it when I'm developing.

Recently, I had been used Firestore when I make small web applications. Because there are no services cheap and large capacity. But when I found PlanetScale, I tried to change DB to it. Because it has free plan and large capacity. I like MySQL than NoSQL so I'm so excited.

I think I always use PlanetScale when I make somethings.

Next.js

Made by Next.js. API Server is also Next.js API Routes. So so so easy. There are nothing to think about client and server. Just make. If I work on job, it's not good to use API Routes. But on my indie hacking, I can't use others.

Using Internationalized Routing for English and Japanese localization.

Deploy

Using Cloud Run. Recently I'm using only this. So I'm now easy to develop with it.

By default, Cloud Run deploys when code pushed. But testing is easier than GitHub Actions, doing like this: push -> Test on GitHub Actions -> Build on Cloud Build (Starts with Webhook from Actions) -> Deploy to Cloud Run.

DB Migration is also executed on Cloud Build.

On testing, using simple API test by Jest and E2E test with Cypress. Cypress is very interesting. On Cypress Dashboard, you can see movie of testing.

Mail

Using SendGrid. Using Dynamic Templates. You don't need manage mail templates on your service.

And with receiving hook, saving received mail to DB. So you can send and receive mails only on web.

Flutter

Localization

Localization was complicated. When develop package, use example project created with package. When developing on it, there were no problems. But when I use the package in other app, localization was not worked well. Fixing was difficult.

Freezed

No problems. I could use.

Testing

Package is public. I can use GitHub Actions with no limit. So I write some tests.

Small story

Contact form on 'Contact Nite' is using its contact form API.