SSW.Website

This repository is a v3 of the zzSSW.Website. This website uses NextJS with TinaCMS.

Watch the demo:

See the important Documents

• Instructions - Deployment
• Business
• Technologies and Architecture
• Alternative Solutions Considered
• Definition of Done
• Definition of Ready
• SSW Website - Power Automate flows

Architecture Overview

Requirements

• Git, Node.js Active LTS
• pnpm corepack enable pnpm
• A TinaCMS account for live editing.

Get Started

Install the project's dependencies:

pnpm install

Run the project locally:

pnpm dev

Build the project:

pnpm build

Get Started with Dev Container

How to

1. Open Command Palette in VSCode

> Dev Containers: Reopen in Container

2. Develop as you would normally

Don't want to use Dev Container any more?

1. Close VSCode connected with the Dev Container
2. Open project folder on host machine
3. Remove node_modules and reinstall dependencies

pnpm install

Updating the project's dependencies

pnpm outdated

Test locally to make sure everything still works.

Local URLs

• http://localhost:3000 : browse the website
• http://localhost:3000/admin : connect to Tina Cloud and go in edit mode
• http://localhost:3000/exit-admin : log out of Tina Cloud
• http://localhost:4001/altair/ : GraphQL playground to test queries and browse the API documentation

UI Testing on local

• 1 Make sure you have CREATE_LEAD_ENDPOINT environment variable in your .env - Follow steps to setup

• 2 Run npx playwright test --ui in your terminal and make sure your local instance is running in the background.

Pull Requests

Each Pull Request will be deployed to its own staging environment, the URL to the environment is available in the PR thread.

⚠️ Warning: Changes in the mdx files must be done with TinaCMS. This is because TinaCMS maps mdx files with its fields with specific characters for customized UI (e.g., rich-text field). So avoid direct edits as they may result in build failures or go unnoticed during PR reviews.

Getting Help

• Email SSW to schedule a call.

• Reach out through the chat widget on ssw.com.au

• Visit the documentation to learn about TinaCMS.

• Join the Tina Discord to share feedback for TinaCMS to improve.