Richard Bergsma 97f9faa8b2 Refactor widget container widths for improved layout consistency
- Updated multiple widget components to change the maximum width from `max-w-7xl` to `max-w-6xl`, ensuring a more uniform appearance across the application.
- Adjusted layout in various pages to enhance responsiveness and maintain design integrity on different screen sizes.
2025-11-06 13:28:20 +01:00
2024-06-22 12:30:39 -04:00
2025-02-26 01:53:49 +01:00
2024-10-09 10:25:53 +02:00
2023-01-21 20:19:20 -05:00
2024-04-09 01:47:10 +02:00
2023-01-21 17:23:37 -05:00
2023-08-30 12:24:36 -04:00
2024-10-13 03:33:40 -04:00

🌍 365DevNet Website

Welcome to the source code for the official 365DevNet website — built by and for freelancers, small businesses, and entrepreneurs who want reliable, clear, and modern IT services.

This website is powered by Astro and Tailwind CSS, and is hosted on our own secure VPS infrastructure. It reflects our mission, values, and service offerings.

💡 Visit the live site: https://365devnet.eu


🧾 About 365DevNet

365DevNet is a Netherlands-based IT services company. We support individuals and small businesses with digital infrastructure that is easy to manage, cost-efficient, and built to scale with you.

Our core services include:

  • 📦 Microsoft 365 setup & migration (mail, SharePoint, Teams, OneDrive)
  • 🔁 Process automation using Power Automate and PowerShell
  • 🌐 Website development with secure VPS deployment and modern tooling
  • 🛡️ Security and management (DNS, domains, backups, access control)
  • 📚 Training and documentation so clients stay in control

Learn more: https://365devnet.eu/en


🧠 Why This Stack?

We built this site with:

  • Astro Ultra-fast static site builder that ships zero JavaScript by default
  • Tailwind CSS Utility-first styling framework for full design control
  • Markdown/MDX For simple, content-friendly editing
  • Custom VPS hosting Gives us control over performance, pricing, and security

We believe in owning our tech and reducing platform dependency.


🗂 Project Structure

/
├── public/            # Static assets (robots.txt, icons)
├── src/
│   ├── assets/        # Local images, styles, favicons
│   ├── components/    # Reusable UI components
│   ├── content/       # Blog posts and markdown pages
│   ├── layouts/       # Page templates
│   ├── pages/         # Route-based pages (e.g. index.astro)
│   └── config.yaml    # SEO, metadata, i18n settings
├── package.json       # Project dependencies and scripts
├── astro.config.ts    # Astro configuration
└── README.md          # You're reading it 🙂

🎨 Theme & Credits

This website was originally built on top of AstroWind — the most starred and forked Astro theme from 20222024. Its a modern, production-ready template that combines Astro with Tailwind CSS and is designed with performance and best practices in mind.

AstroWind is an open-source project created and maintained by onWidget and the amazing open-source community:

Weve adapted the template to reflect the unique mission and brand identity of 365DevNet, while continuing to follow the project's great structure and standards.


🔐 Environment Variables

Create a .env file and keep it out of version control. Example:

# Email
# For Microsoft 365 / Office 365:
SMTP_HOST=smtp.office365.com
SMTP_PORT=587
SMTP_USER=your-email@yourdomain.com
SMTP_PASS=your-app-password
# OR use OAuth2 (recommended for Microsoft 365):
# OAUTH2_CLIENT_ID=your-client-id
# OAUTH2_CLIENT_SECRET=your-client-secret
# OAUTH2_REFRESH_TOKEN=your-refresh-token
# OAUTH2_ACCESS_TOKEN=your-access-token (optional)

# For generic SMTP or Mailcow:
# SMTP_HOST=your-smtp-server
# SMTP_PORT=587
# SMTP_USER=your-username
# SMTP_PASS=your-password

ADMIN_EMAIL=your-email@yourdomain.com
WEBSITE_NAME=

# Monitoring
UPTIME_KUMA_URL=

# SCM
GITEA_TOKEN=

# AI (optional)
GEMINI_API_KEY=

# Security - Content Security Policy
# Set to 1 to enable CSP (use for production testing)
# ENABLE_SSR_CSP=1

🚀 Development & Testing

Quick Start

# Install dependencies
npm install

# Start development server (fast, no CSP)
npm run dev

# Visit http://localhost:4321

⚠️ IMPORTANT: Pre-Deployment Testing

Always test with production security settings before deploying:

# Test with CSP enabled (matches production)
npm run dev:prod

This will:

  • Build the production bundle
  • Run with server.js (same as Docker)
  • Enable Content Security Policy (ENABLE_SSR_CSP=1)
  • Help you catch security/CSP issues before deployment

Available Commands

Command Description
npm run dev Development server (Astro dev, no CSP)
npm run dev:prod Production testing with CSP ⚠️ Use before deploying!
npm run build Build for production
npm run preview:prod Preview built site with CSP enabled
npm run start Start production server
npm run check Run linting & type checking

📋 Pre-Deployment Checklist

See TESTING.md for the complete testing guide and checklist.

Quick checks:

  • Run npm run dev:prod locally
  • Test mobile menu, language selector, theme switcher
  • Check browser console for CSP violations
  • Run npm run check for linting errors

🐳 Docker Deployment

The production environment runs in Docker with CSP enabled:

# Build and run with Docker Compose
docker-compose up -d

# View logs
docker-compose logs -f web

Environment variables are set in docker-compose.yml and .env.

Description
Website for 365DevNet
https://www.365devnet.eu
Readme 35 MiB
Languages
Astro 45.8%
TypeScript 42.5%
JavaScript 5.2%
HTML 3.1%
MDX 2.8%
Other 0.5%