-
Notifications
You must be signed in to change notification settings - Fork 73
Dev setup
You need Node (^20.9 || ^22
) and npm (^10
) installed to use this starter kit. It's tested with the active and maintenance LTS versions of Node.
You can check your current versions of these tools with node --version
and npm --version
.
The automated testing all takes place in Ubuntu and Windows Server, but other Linux versions and macOS should work too.
-
Clone your repository to your local machine.
-
cd
into the repository's directory on your local machine. You can rungit status
to check you're in the right place, it should say something likeOn branch main Your branch is up to date with 'origin/main'. nothing to commit, working tree clean
-
Install the dependencies by running
npm ci
(ornpm install
); this will create anode_modules/
directory and fill it with the requirements specified in the variouspackage.json
files andpackage-lock.json
. -
Set up a database and configure the app to connect to it, see Dev setup#Database
Note: even if you've deployed to Render or similar, I'd suggest setting up a separate database for local development (otherwise any errors or experiments in your local development can impact your production deployment and the rest of your team).
-
Create a
.env
file in the root of the repository for any environment variables you'll need (see Dotenv). Start by setting your DB connection string and enabling extra logging to help develop and debug:DATABASE_URL=<...> LOG_LEVEL=debug
-
Run the app using either
npm run dev
(developer mode, with watching/reloading of your code as you make changes) ornpm run serve
(production mode, to check what will actually get deployed) - see Scripts for more details. -
While one of those two scripts is running, visit http://localhost:3000 to see the app.
If you see any errors, or the site doesn't look like the image above, check out Home#Common errors.
-
Now that you're up and running, see Structure to get an idea of the layout of the kit and where to start putting your code.
You'll need to supply a database for the app to use on startup. The app tries to connect to the database specified by the DATABASE_URL
environment variable (which e.g. Heroku sets automatically).
This variable can be set in the .env
file in the repository root, see Dotenv. You can see configuration and connection data (or edit it if needed) in api/db.js
and api/utils/config.js
.
⚠️ Do not include credentials (usernames, passwords, etc.) in your source code. Store them only in.env
, which is excluded from git tracking, for local development, and look up how to set real environment variables in your deployment environment (e.g. Heroku, Render, ...) for production.
To run Postgres locally, see:
-
Official installer: follow the instructions at https://www.postgresql.org/download/
-
Homebrew (macOS only):
brew install postgresql
thenbrew services start postgresql
-
Docker: assuming you've installed Docker, see https://docs.docker.com/get-docker/:
docker run --detach --env POSTGRES_DB=<db> --env POSTGRES_PASSWORD=<password> --name <name> --publish 5432:5432 postgres
The database URL will be
postgres://postgres:<password>@localhost:5432/<db>
You can start and stop the container as needed using
docker stop <name>
/docker start <name>
.
Once you have Postgres up and running, unless you used Docker, createdb <db>
to create the database the app will use.
If you see EADDRINUSE
when trying to run dev
or serve
, you may have other processes running on your machine that are using ports the starter kit expects. You can check which processes these are using the command:
lsof -i :<port>
If you see existing npm
commands running, you may have terminals running in the background somewhere - find them and stop them! If you see some other program running, you may need to switch ports. You can do this as follows:
-
npm run dev
:-
Frontend (default: 3000): you need to change the line
"dev:web": "cross-env PORT=3000 npm --workspace web run dev",
inpackage.json
-
Backend (default: 3100): you need to change the line
"dev": "cross-env API_PORT=3100 concurrently \"npm:dev:*\"",
inpackage.json
.
-
Frontend (default: 3000): you need to change the line
-
npm run serve
:-
Backend (default: 3000): the easiest way to override this is when you actually run the server, so you can do e.g.
PORT=3210 npm run serve
. Alternatively you can change the lineport: parseInt(process.env.PORT ?? "3000", 10),
inapi/utils/config.js
.
-
Backend (default: 3000): the easiest way to override this is when you actually run the server, so you can do e.g.