DEV Community

Desmond Obisi
Desmond Obisi

Posted on

Fullstack Serverless Starter with Hono.js, Cloudflare Workers, and Neon Postgres

This is a submission for the Neon Open Source Starter Kit Challenge : Ultimate Starter Kit

My Kit

This is a starter project for a fullstack serverless application using Hono.js, Cloudflare Workers, and Neon Postgres. It is a simple CRUD application that allows you to create, read, update, and delete posts. It also has provisions for building user interfaces using HTML and CSS.

starter-preview

Link to Kit

This project is available on GitHub. If you find it helpful, star it and share it with others. Contributions are also accepted.

GitHub logo DesmondSanctity / neon-serverless-starter

This is a starter project for a fullstack serverless application using Hono.js, Cloudflare Workers and Neon Postgres. It is a simple CRUD application that allows you to create, read, update and delete posts. It also has provisions for building user interface using HTML and CSS.

Fullstack Serverless Starter with Hono.js, Cloudflare Workers and Neon Postgres.

This is a starter project for a fullstack serverless application using Hono.js, Cloudflare Workers, and Neon Postgres. It is a simple CRUD application that allows you to create, read, update, and delete posts. It also has provisions for building user interfaces using HTML and CSS.

Prerequisites

Project structure

The project structure is as follows:

---docs
    |-- schemas.ts
---prisma
    |-- schema.prisma
---public
    |-- images.*png,jpg,svg
    |-- favicon.ico
---src
    |-- configs
    |-- controllers
    |-- middlewares
    |-- queries
    |-- routes
    |-- validations
    |-- views
    |-- index.ts
---utils
    |-- constants.js
---tsconfig.json
---wrangler.toml
---package.json
---package-lock.json
---README.md
  • The docs folder contains the OpenAPI schemas for generating documentation for the application. It uses @hono/zod-openapi to generate the schemas. Only the schemas is documented in this starter.
  • The prisma folder contains the database schema and migration files.

Your Journey

Building a fullstack serverless app the conventional way always does not pan out well. You have to make tweaks here and there everytime when you want to build something. To make it easy, I have created this starter project that has most of the things you need for your serverless application, saving you hours of configurations and setups.

I used Hono.js and Cloudflare workers to create and deploy the APIs, Neon for a serverless database, and integration of Workers AI so to show how easy it is to run AI models in a serverless application. The starter app also uses Twind via SSR to serve Tailwind CSS files, helping us to have a fullstack app with APIs and user interfaces in the same project.

What is included?

  • Authentication using JWT.
  • Database interaction using Prisma.
  • Middleware for authentication and logging.
  • Validation using Zod.
  • Secure Headers.
  • Error handling.
  • Deployment to Cloudflare.
  • Pagination for getAll endpoints.
  • Search functionality for getAll endpoints.
  • Sorting for getAll endpoints.
  • Filtering for getAll endpoints.
  • AI Bindings to use Workers AI.
  • Twind configuration that allows use of Tailwind CSS in Cloudflare Workers through SSR.
  • Serving of static assets.
  • Support for OpenAPI documentation.
  • Example user interfaces using HTML and CSS.

Top comments (0)