next-postgres-with-typescript

next-postgres-with-typescript is a full-stack boilerplate that combines Next.js 7, React 16.4.2, Postgres, and Sequelize with TypeScript and Jest support for building server-rendered web applications. It is a fork of the next-postgres repo by @jimmylee, extended with provisional TypeScript types and a Jest/Enzyme test setup, while keeping the original stack of custom Express, Emotion CSS-in-JS, Passport local authentication, and Redux.

What is next-postgres-with-typescript?

next-postgres-with-typescript is a production-ready starting point for a full-stack JavaScript application with posts, comments, and server-side rendering. It takes a Postgres database connection and your application code, and outputs a deployed web app that can run on Zeit (now) or Heroku, with local development served at localhost:8000. The template was created by forking the original next-postgres repository and is open for contributions to make it more type-safe.

Key Features

• TypeScript support — Most files in the common, components, higher-order, and pages directories are converted to .tsx with provisional types, and a dedicated data-models file holds shared TypeScript interfaces.
• Jest and Enzyme testing — A test harness is configured for unconnected, pure components, allowing you to run unit tests alongside development.
• Next.js with custom Express server — Uses Next.js 7 for server-side rendering and routing, paired with a custom Express backend for API endpoints.
• Emotion CSS-in-JS — Styling is handled through Emotion, enabling component-scoped styles without a separate CSS build step.
• Sequelize ORM for Postgres — Data modeling and migrations use Sequelize 4, with schema migrations run via sequelize-cli.
• Passport local authentication — Includes Passport.js for username/password authentication, ready to wire into your user model.
• Redux state management — Redux is included for global client-side state, integrated with the Next.js data flow.
• Deployment to Zeit or Heroku — The repo is pre-configured for Zeit's now-cli (with alias support) and includes a separate HEROKU.md guide for Heroku deployment, plus now-secrets.json for production database credentials.

Who is it for?

• Developers starting a hackathon project — The repo provides a working full-stack base with auth, database, and SSR already wired, so you can begin building features immediately.
• Developers learning TypeScript with Next.js — Because the fork includes provisional types and a data-models file, it serves as a practical example of migrating a JavaScript Next.js codebase to TypeScript.
• Teams needing a production-ready web app template — The setup is deployed in real projects like indvstry.io and Reading Supply, showing it can support concept validation and serious production use.

What can you do with next-postgres-with-typescript?

• Launch a server-rendered blog or content app — With posts, comments, and server-side rendering already implemented, you can adapt the models and pages to publish content without building the foundation.
• Prototype a full-stack product — Use the built-in authentication, Postgres schema, and API routes to test a startup idea quickly, then deploy to Zeit or Heroku.
• Practice writing Jest tests for React components — The configured Jest/Enzyme environment lets you add unit tests for pure components, with known limitations around Redux and Router integration.

How does next-postgres-with-typescript work?

The template follows a standard full-stack workflow: install dependencies and Postgres, configure the database in config.js, run Sequelize migrations, then start the development server with npm run dev. For production, you deploy to Heroku following HEROKU.md, or to Zeit using now, after setting production secrets for the database connection via now secrets.

FAQ

Is next-postgres-with-typescript free?

The repo is open source and explicitly states the code can be used without attribution, so it is free to use for personal or commercial projects.

What are the known limitations of this template?

Several areas remain untyped: the IUser, IPost, and IComment interfaces are still defined as any, and files such as withData.js, _document.js, and the api directory have not yet been converted to TypeScript. Jest tests currently fail for components that need Redux Provider or Next Router context.

Does the template include authentication?

Yes, it includes Passport local authentication for username/password login, integrated with the Postgres database via Sequelize.

Can I deploy to platforms other than Zeit or Heroku?

Deployment instructions are specifically provided for Zeit (now-cli) and Heroku. Since it uses Next.js and a custom Express server, other Node-compatible hosting platforms may work, but those two are officially documented.