WCC Frontend Application

This is the FE application (NextJS) for Women Coding Community website.

How to contribute?

See our Contributing page.

Requirements for running on your machine

• Node (20+)
• Pnpm (v9+)

If you don't have node, go to their downloads page.

If you don't have pnpm you can install it with npm running

npm install -g pnpm@9

Then, install project dependencies

  pnpm install

Next, create an .env.local file in your root folder. In this file please paste the following:

API_BASE_URL=http://localhost:8080/api/cms/v1
API_KEY={your_local_api_key}

This will allow your local to connect to the backend, if you don't yet have an API_KEY please send a message via our dedicated Slack channel. This will never be committed to the github repository.

Now you can run the application using

  pnpm dev

You can run also these commands pre-commit for your peace of mind. The application uses husky, which will run these same checks before you can commit.

  pnpm lint:fix && pnpm format && pnpm type-check

For running unit tests, you can use this command:

  pnpm test

Use this one to run playwright (e2e) tests:

  pnpm test:e2e

For running e2e tests in a Docker container (recommended for consistency across environments):

  pnpm run test:e2e:docker

This uses Docker Compose to run Playwright tests in an isolated container, as the CI does. It also retries 3 times, as the CI does.

To run an individual test, one can also pass grep parameters with the test title such as:

  pnpm run test:e2e:docker -g "Validate footer"

To update visual regression snapshots (when UI changes are intentional):

  pnpm run test:e2e:docker:update

This updates the reference screenshots used in visual tests.

CI/CD and deploy (Vercel)

The website frontend is deployed to Vercel using Vercel's native Git integration on pushes to main.

Configure the following environment variables in the Vercel project dashboard:

• API_BASE_URL (Backend API URL, e.g. https://wcc-backend-prod.fly.dev/api/cms/v1)
• API_KEY (Backend API key)