Development Workflow

This guide outlines the standard development workflow for the FiNAN documentation project. Following these steps ensures a smooth development experience and consistent code quality.

Development Server

The development server is your primary tool for writing and previewing documentation. It provides hot module replacement (HMR), so changes are reflected instantly in the browser.

1. Open your terminal in the project root.

2. Run the development server:

   pnpm dev

3. Open your browser to http://localhost:4321.

Tip

The development server will automatically catch many common errors, such as broken links or invalid frontmatter, and display them in the terminal or browser overlay.

Type Checking

Since this project uses TypeScript in Strict Mode, it’s important to verify type safety. The build process runs type checks automatically, but you can also run them manually during development.

To run a full type check across the entire project:

pnpm check

This command runs astro check, which validates types in .astro components, .mdx files, and .ts modules.

Linting & Formatting

We rely on the build process to enforce many of our standards. While we don’t have a separate “lint” command, the following standards are expected:

• Prettier: Code should be formatted consistent with standard Prettier configuration.
• TypeScript: No implicit any, unused variables are flagged by the editor.

Note

Most modern IDEs (like VS Code) with the Astro extension will handle formatting and basic linting automatically as you type or save.

Build Process

Before deploying or submitting a pull request, it is crucial to run a production build locally. This ensures that all pages can be generated successfully and that there are no critical errors.

pnpm build

The build command will:

1. Validate all Content Collections.
2. Check for broken links between pages.
3. Optimize assets and images.
4. Generate static HTML files in the dist/ directory.

Previewing the Build

After a successful build, you can preview the production version locally to ensure everything looks correct:

pnpm preview

This serves the content from the dist/ directory, mimicking the production environment.