Spectrum IT Consulting Website Template

A modern, customizable template for Spectrum IT Consulting websites, built with Astro, SolidJS, Tailwind CSS v4, Bun, and TypeScript. This template provides a solid foundation for building fast, responsive, and visually appealing consulting websites.

🚀 Project Overview

This template is designed for IT consulting businesses looking to establish a professional online presence. It features:

• Clean, modern design with utility-first styling
• Modular, reusable components
• SEO-friendly static site generation
• Easy customization and theming
• Optimized performance and accessibility

🧰 Tech Stack

• Astro: Static site generation & SSR
• SolidJS: Reactive UI components
• Tailwind CSS v4: Utility-first CSS framework
• Bun: Fast runtime & package manager
• TypeScript: Type safety throughout

📁 Project Structure

/
├── public/           # Static assets (images, icons, etc.)
├── src/
│   ├── components/   # Reusable UI components
│   ├── layouts/      # Page/layout components
│   ├── pages/        # Route-based pages
│   ├── styles/       # Global & component styles
│   ├── utils/        # Utility functions
│   └── data/         # Site configuration & data
├── bun.lock          # Bun lockfile
├── tailwind.config.js# Tailwind CSS config
├── astro.config.mjs  # Astro config
├── tsconfig.json     # TypeScript config
└── README.md         # Project documentation

⚡ Getting Started

1. Install dependencies

   bun install

2. Start the development server

   bun dev

3. Build for production

   bun build

4. Lint and format code

   bun lint   # Run ESLint
   bun format # Run Prettier

🎨 Customization & Theming

• Edit content and structure in src/pages/ and src/components/.
• Update global styles and Tailwind config in src/styles/ and tailwind.config.js.
• Configure site data in src/data/.
• Add environment variables in .env (see .env.example if available).

📦 Deployment

After building, deploy the contents of the dist/ directory to your preferred static hosting provider (e.g., Vercel, Netlify, Cloudflare Pages).

📚 Documentation

• Astro Documentation
• SolidJS Documentation
• Tailwind CSS v4 Docs
• Bun Documentation
• TypeScript Handbook

🔗 Baserow Integration (Optional Usage)

Baserow integration is included out-of-the-box using the @watzon/baserow client library. A utility is provided at src/utils/baserow.ts that exports a pre-configured client using environment variables. This makes it easy to use Baserow for dynamic data or as a CMS, but it is only active if you provide the required environment variables.

How It Works

• The Baserow client is always available for import, but will throw an error if you try to use it without setting up the environment variables.
• See .env.example for the required variables: BASEROW_API_URL and BASEROW_API_TOKEN.

Example Usage

import { baserow } from '@/utils/baserow';

// Example: Fetch all tables in a database
const tables = await baserow.databaseTables.list(1);

You can use this data in your Astro or SolidJS pages/components. See the @watzon/baserow documentation for more advanced usage and API details.

📝 License

This template is provided as-is for Spectrum IT consulting projects. Customize and extend as needed for your business.