Create a fullstack project using Scala3, Tapir, Circe, OpenApi, React, Typescript

Generate Scala server

tapir project generation

It is enough to start with. Also it adds two get endpoints, user and getBooks(called differently).

Generate React(typescript) client

CreateReactApp

npx create-react-app client
cd client
npm start

Do some useless stuff

Inside build.sbt I added the common block, however I am not using it as I want to detach from mixing scala stuff and FE stuff. In this template both are separated projects.

Also changed the name from sbtx to sbtw.

For more details check the sbtw usage page. Otherwise, if sbt is already installed, you can use the standard commands:

Deploy locally

Deploy server

./sbtw -h # shows an usage of a wrapper script
./sbtw compile # build the project
./sbtw test # run the tests
./sbtw server/run # run the application (Main)

Or with sbt

sbt compile # build the project
sbt test # run the tests
sbt server/run # run the application (Main)

Deploy client

npm install
npm start

I build two components to handle user and getBooks endpoints and display the content. For this I followed this tutorial: Fetch_data_with_React_Hooks_and_Typescript

You can also access the OpenApi at this link, however sbt is going to show these details: http://localhost:9000/docs/#/

The result

Links:

tapir_project_generation

tapir_documentation

tapir_github

bootzooka: template microservice using tapir

sbtw_wrapper

CreateReactApp

sbt

Fetch_data_with_React_Hooks_and_Typescript