> ## Documentation Index
> Fetch the complete documentation index at: https://docs.yuvrajverma.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Configuration Basics

> Learn how to configure and customize your Latch website through TypeScript configuration files

## Overview

Latch uses TypeScript configuration files located in the `config/` folder to manage all content and settings. This approach provides type safety, better IDE support, and easier maintenance compared to JSON or environment variables.

<Info>All configuration files are in TypeScript format (`.ts`) and located in the `config/` directory</Info>

***

## Quick Start

<Steps>
  <Step title="Locate the config folder">
    Navigate to the `config/` directory in your project root
  </Step>

  <Step title="Choose a config file">
    Find the file corresponding to what you want to change (see reference below)
  </Step>

  <Step title="Edit the configuration">
    Open the file and modify the exported configuration object
  </Step>

  <Step title="Save and test">
    Changes are applied automatically - refresh your browser to see updates
  </Step>
</Steps>

***

## Configuration Categories

### Brand & Identity

<CardGroup cols={2}>
  <Card title="Branding" icon="palette" href="/configuration/branding">
    Company name, logo, colors, navigation, and footer

    **File:** `config/branding.ts`
  </Card>

  <Card title="SEO & Meta" icon="magnifying-glass" href="/configuration/seo">
    Site title, description, Open Graph, and meta tags

    **File:** `config/seo.ts`
  </Card>

  <Card title="Currency" icon="dollar-sign" href="/configuration/currency">
    Currency symbol, code, and position

    **File:** `config/shared/currency.ts`
  </Card>

  <Card title="Sale Banner" icon="badge-percent" href="/configuration/sale-banner">
    Promotional banner at the top of your site

    **File:** `config/promotions/sale-banner.ts`
  </Card>
</CardGroup>

### Content Pages

<CardGroup cols={2}>
  <Card title="Homepage" icon="house" href="/configuration/home">
    Hero section, features, and homepage content

    **File:** `config/home.ts`
  </Card>

  <Card title="About Page" icon="circle-info" href="/pages/about">
    Company information and mission

    **File:** `config/pages/about.ts`
  </Card>

  <Card title="Contact Page" icon="envelope" href="/pages/contact">
    Contact form and support information

    **File:** `config/pages/contact.ts`
  </Card>

  <Card title="Jobs Page" icon="briefcase" href="/pages/jobs">
    Career opportunities and job listings

    **File:** `config/pages/jobs.ts`
  </Card>
</CardGroup>

### Hosting Products

<CardGroup cols={3}>
  <Card title="VPS Hosting" icon="server" href="/products-hosting/vps-hosting">
    VPS plans and specifications

    **File:** `config/hosting/vps.ts`
  </Card>

  <Card title="Dedicated Servers" icon="hard-drive" href="/products-hosting/dedicated-server">
    Dedicated server configurations

    **File:** `config/hosting/dedicated.ts`
  </Card>

  <Card title="Web Hosting" icon="globe" href="/products-hosting/web-hosting">
    Shared and managed hosting

    **File:** `config/hosting/web-hosting.ts`
  </Card>
</CardGroup>

### Game Server Hosting

<CardGroup cols={2}>
  <Card title="Games Listing" icon="gamepad" href="/products-hosting/games-listing">
    All available game servers

    **File:** `config/games/index.ts`
  </Card>

  <Card title="Individual Games" icon="joystick" href="/products-hosting/game">
    Specific game configurations

    **File:** `config/games/[gamename].ts`
  </Card>
</CardGroup>

### Support & Information

<CardGroup cols={2}>
  <Card title="Knowledgebase" icon="book" href="/configuration/knowledgebase">
    Help articles and documentation

    **Files:** `config/knowledgebase/`
  </Card>

  <Card title="FAQ" icon="circle-question" href="/help/faq">
    Frequently asked questions

    **File:** `config/faq.ts`
  </Card>

  <Card title="Testimonials" icon="star" href="/configuration/testimonials">
    Customer reviews and feedback

    **File:** `config/testimonials.ts`
  </Card>

  <Card title="Changelogs" icon="clock-rotate-left" href="/configuration/changelogs">
    Version history and updates

    **File:** `config/changelogs.ts`
  </Card>
</CardGroup>

### Technical Specs

<CardGroup cols={2}>
  <Card title="Hardware Specs" icon="microchip" href="/configuration/hardware">
    Server specifications and components

    **File:** `config/hardware.ts`
  </Card>

  <Card title="Partners" icon="handshake" href="/products-hosting/partners">
    Partner integrations and affiliates

    **File:** `config/pages/partners.ts`
  </Card>
</CardGroup>

### Legal Pages

<CardGroup cols={2}>
  <Card title="Privacy Policy" icon="shield-check" href="/configuration/legal-pages">
    Privacy policy content

    **File:** `config/legal/privacy.ts`
  </Card>

  <Card title="Terms of Service" icon="file-contract" href="/configuration/legal-pages">
    Terms and conditions

    **File:** `config/legal/terms.ts`
  </Card>
</CardGroup>

***

## Configuration File Structure

All configuration files follow a similar pattern:

```typescript theme={null}
// Example: config/example.ts
export const exampleConfig = {
  // Your configuration here
  property: "value",
  nested: {
    item: "data"
  }
};
```

<Tabs>
  <Tab title="TypeScript Benefits">
    * **Type Safety**: Catch errors before runtime
    * **IntelliSense**: Auto-completion in your IDE
    * **Documentation**: Inline type hints
    * **Refactoring**: Easy to update across files
  </Tab>

  <Tab title="Best Practices">
    * Keep configurations organized by category
    * Use descriptive variable names
    * Add comments for complex configurations
    * Test changes in development before deploying
  </Tab>
</Tabs>

***

## Quick Reference Table

| **What to Change**      | **File Path**                         | **Documentation**                               |
| :---------------------- | :------------------------------------ | :---------------------------------------------- |
| **Company name & logo** | `config/branding.ts`                  | [Branding](/configuration/branding)             |
| **Brand colors**        | `config/branding.ts`                  | [Branding](/configuration/branding)             |
| **Navigation menu**     | `config/branding.ts` → `navbarConfig` | [Branding](/configuration/branding)             |
| **Footer links**        | `config/branding.ts` → `footerConfig` | [Branding](/configuration/branding)             |
| **SEO & Meta tags**     | `config/seo.ts`                       | [SEO](/configuration/seo)                       |
| **Homepage content**    | `config/home.ts`                      | [Home](/configuration/home)                     |
| **Customer reviews**    | `config/testimonials.ts`              | [Testimonials](/configuration/testimonials)     |
| **FAQ questions**       | `config/faq.ts`                       | [FAQ](/help/faq)                                |
| **Changelogs**          | `config/changelogs.ts`                | [Changelogs](/configuration/changelogs)         |
| **Hardware specs**      | `config/hardware.ts`                  | [Hardware](/configuration/hardware)             |
| **About page**          | `config/pages/about.ts`               | [About](/pages/about)                           |
| **Contact page**        | `config/pages/contact.ts`             | [Contact](/pages/contact)                       |
| **Jobs page**           | `config/pages/jobs.ts`                | [Jobs](/pages/jobs)                             |
| **Games listing**       | `config/games/index.ts`               | [Games](/products-hosting/games-listing)        |
| **Game pages**          | `config/games/[gamename].ts`          | [Game Pages](/products-hosting/game)            |
| **VPS hosting**         | `config/hosting/vps.ts`               | [VPS](/products-hosting/vps-hosting)            |
| **Dedicated servers**   | `config/hosting/dedicated.ts`         | [Dedicated](/products-hosting/dedicated-server) |
| **Web hosting**         | `config/hosting/web-hosting.ts`       | [Web Hosting](/products-hosting/web-hosting)    |
| **Partners page**       | `config/pages/partners.ts`            | [Partners](/products-hosting/partners)          |
| **Knowledgebase**       | `config/knowledgebase/index.ts`       | [KB](/configuration/knowledgebase)              |
| **KB articles**         | `config/knowledgebase/articles/`      | [KB](/configuration/knowledgebase)              |
| **Sale banner**         | `config/promotions/sale-banner.ts`    | [Banner](/configuration/sale-banner)            |
| **Currency settings**   | `config/shared/currency.ts`           | [Currency](/configuration/currency)             |
| **Privacy policy**      | `config/legal/privacy.ts`             | [Legal](/configuration/legal-pages)             |
| **Terms of service**    | `config/legal/terms.ts`               | [Legal](/configuration/legal-pages)             |
