Coder Social home page Coder Social logo

mkosir / trpc-fe-boilerplate-next Goto Github PK

View Code? Open in Web Editor NEW
25.0 2.0 6.0 2.49 MB

⚒️ Minimal tRPC frontend Nextjs boilerplate for separate BE-FE repositories. Easily consume fully typesafe APIs.

Home Page: https://mkosir.github.io/trpc-fe-boilerplate-next/

License: MIT License

JavaScript 27.35% TypeScript 72.21% CSS 0.44%
reactjs trpc trpc-client typescript nextjs

trpc-fe-boilerplate-next's Introduction

tRPC Frontend Boilerplate Heisenberg

CI

Minimal tRPC frontend boilerplate (Nextjs) for separate BE-FE repositories. Easily consume fully typesafe APIs.

Monorepos are great, but sometimes we are targeting backend and frontend as separate (mono)repositories.

We might aim for backend and frontend repositories separation of:

  • domain/business logic - expose only what need to be exposed through API.
  • developers - larger teams/companies.
  • CI/CD pipelines, PRs, issues, etc.

... in that case checkout this boilerplate.

Running

Easily set up a local development environment

  • clone repo
  • npm install
  • npm run dev
  • use latest tRPC API package in your app 🚀

Import tRPC API

There are 2 ways to import tRPC API types from backend repo:

  1. Install npm package npm i trpc-api-boilerplate (currently set as a default option)
  2. Run npm script npm run trpc-api-import (uncomment line)

Example Repo

Example backend API repository - tRPC API Boilerplate

trpc-fe-boilerplate-next's People

Contributors

mkosir avatar

Stargazers

 avatar 황진성 avatar Jeongwoo Hong avatar Daniel Bodnar avatar Tristan Remy avatar 0xPuff avatar Dylan Green avatar Mouaz Aldakkak avatar Brian Roach avatar Tony Ko avatar  avatar  avatar 克里の小跟班 avatar Daniil Babanin avatar Michael Salaverry avatar David Gidwani avatar Mateus Junior avatar Orgil avatar  avatar Tim Kersey avatar Hayden Duffy avatar Tomislav Slijepčević avatar Yuto Takeuchi avatar Neja Dolinar avatar Tomofumi Chiba avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.