BOB Docs
FrontendTutorials

Local Development

Prerequisites

To start a local server, you need to install some dependencies.

Node.js

Visit this website and install Node.js on your local machine. macOS, Windows, and Linux are supported.

Although Next.js documentation mentions npx, I want you to understand the difference between npx and npm:

  • npm – Node Package Manager – the default package manager installed with Node.js. We use the npm command-line tool to manage packages.

  • npx – Node Package Execute – allows you to run any npm package without installing it globally. You can check if it’s installed by running:

    npx -v

Infrastructure

To properly run the application, you need to run bob-api and infrastructure on your machine.

git clone git@github.com:business-oriented-programming/boilerplate-deploy.git
cd boilerplate-deploy

You can use the infrastructure.yaml file to create the full infrastructure setup to run BOB locally:

docker compose -f infrastructure.yaml up -d

You can adjust the .local.env file to customize any infrastructure settings. After editing it to your needs, rename it to .env.

To run BOB API, edit the apps.yaml file and comment out the bob-front section. You are now ready to go.

Start App

After the backend and infrastructure are running, clone your frontend repository:

git clone git@github.com:business-oriented-programming/boilerplate-frontend.git
cd boilerplate-frontend

Now install all packages from the package.json file:

npm install

Start the development server. By default, it runs on localhost:3000:

npm run dev

WebStorm Debugging

It is extremely important to properly set up your development environment for smooth and fast coding. Make sure you can debug your code.

As a big fan of JetBrains, I highly recommend using WebStorm. However, you can use any IDE you like—just ensure debugging is enabled.

After opening the project in WebStorm, go to your package.json file. You will see a play button next to the scripts section. Simply click the green play button next to dev, and voilà—your configuration and server will be ready for debugging. Easy peasy! 🚀

On this page