- Improved the initialization process to ensure the RocketChat widget is only set up once, preventing redundant initializations. - Added functionality to mark the widget iframe for persistence across page transitions, enhancing user experience during navigation. - Updated event listeners to maintain the persistence marker after DOM updates, ensuring consistent behavior of the livechat widget.
🌍 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 2022–2024. It’s 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:
- ⭐ GitHub: onwidget/astrowind
- 💬 Community discussions: AstroWind Discussions
- 📄 License: MIT License
We’ve 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:prodlocally - Test mobile menu, language selector, theme switcher
- Check browser console for CSP violations
- Run
npm run checkfor 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.