152 lines
4.4 KiB
Markdown
152 lines
4.4 KiB
Markdown
# Tiber365 - Professional IT Services Website
|
|
|
|
A modern, multilingual website for Tiber365, an IT services company specializing in Microsoft 365 support, networking solutions, web hosting, and custom IT projects for freelancers and small businesses.
|
|
|
|
## 🚀 Features
|
|
|
|
- **Modern Design**: Clean, responsive design with dark/light mode support
|
|
- **Multilingual**: Support for English, Dutch, and Italian
|
|
- **Performance**: Built with Astro for optimal performance and SEO
|
|
- **Responsive**: Mobile-first design that works on all devices
|
|
- **Accessibility**: WCAG compliant with proper semantic HTML
|
|
- **SEO Optimized**: Meta tags, Open Graph, structured data, and more
|
|
- **Security**: Content Security Policy headers and secure configurations
|
|
|
|
## 🛠️ Tech Stack
|
|
|
|
- **Framework**: [Astro](https://astro.build/) 4.0
|
|
- **Styling**: [Tailwind CSS](https://tailwindcss.com/)
|
|
- **Internationalization**: Astro's built-in i18n
|
|
- **Fonts**: Inter & Poppins (Google Fonts)
|
|
- **Icons**: Heroicons SVGs
|
|
|
|
## 📄 Pages
|
|
|
|
- **Homepage**: Hero section, services overview, testimonials, CTA
|
|
- **Services**: Detailed service descriptions and features
|
|
- **About**: Company story, values, team information
|
|
- **Contact**: Contact form and company information
|
|
- **404**: Custom error page with helpful navigation
|
|
|
|
## 🏗️ Project Structure
|
|
|
|
```
|
|
/
|
|
├── public/ # Static assets
|
|
│ ├── favicon.svg # Site favicon
|
|
│ ├── manifest.json # Web app manifest
|
|
│ └── robots.txt # Search engine instructions
|
|
├── src/
|
|
│ ├── components/ # Reusable components
|
|
│ │ ├── Header.astro
|
|
│ │ ├── Hero.astro
|
|
│ │ ├── Services.astro
|
|
│ │ ├── Testimonials.astro
|
|
│ │ ├── CTA.astro
|
|
│ │ ├── Footer.astro
|
|
│ │ ├── ContactForm.astro
|
|
│ │ ├── ThemeToggle.astro
|
|
│ │ └── LanguageSwitcher.astro
|
|
│ ├── layouts/ # Page layouts
|
|
│ │ └── BaseLayout.astro
|
|
│ ├── pages/ # File-based routing
|
|
│ │ ├── index.astro # Homepage
|
|
│ │ ├── services.astro
|
|
│ │ ├── about.astro
|
|
│ │ ├── contact.astro
|
|
│ │ └── 404.astro
|
|
│ ├── locales/ # Translation files
|
|
│ │ ├── en.json
|
|
│ │ ├── nl.json
|
|
│ │ └── it.json
|
|
│ ├── styles/ # Global styles
|
|
│ │ └── global.css
|
|
│ ├── utils/ # Utility functions
|
|
│ │ ├── theme.ts
|
|
│ │ └── animations.ts
|
|
│ └── site.config.ts # Site configuration
|
|
├── astro.config.mjs # Astro configuration
|
|
├── tailwind.config.mjs # Tailwind configuration
|
|
└── package.json
|
|
```
|
|
|
|
## 🚀 Getting Started
|
|
|
|
### Prerequisites
|
|
|
|
- Node.js 18+
|
|
- npm or yarn
|
|
|
|
### Installation
|
|
|
|
1. Clone the repository:
|
|
```bash
|
|
git clone <repository-url>
|
|
cd tiber365
|
|
```
|
|
|
|
2. Install dependencies:
|
|
```bash
|
|
npm install
|
|
```
|
|
|
|
3. Start the development server:
|
|
```bash
|
|
npm run dev
|
|
```
|
|
|
|
4. Open your browser and visit `http://localhost:4321`
|
|
|
|
### Build for Production
|
|
|
|
```bash
|
|
# Build the site
|
|
npm run build
|
|
|
|
# Preview the build
|
|
npm run preview
|
|
```
|
|
|
|
## 🌐 Internationalization
|
|
|
|
The website supports three languages:
|
|
- English (default) - `/`
|
|
- Dutch - `/nl/`
|
|
- Italian - `/it/`
|
|
|
|
Translation files are located in `src/locales/` and can be easily extended or modified.
|
|
|
|
## 🎨 Customization
|
|
|
|
### Colors & Theming
|
|
|
|
Colors are defined in CSS custom properties in `src/styles/global.css` and can be easily customized. The site supports both light and dark themes with automatic system preference detection.
|
|
|
|
### Content
|
|
|
|
- **Site configuration**: Edit `src/site.config.ts`
|
|
- **Translations**: Edit files in `src/locales/`
|
|
- **Services**: Update the `SERVICES` array in `src/site.config.ts`
|
|
- **Testimonials**: Update the `TESTIMONIALS` array in `src/site.config.ts`
|
|
|
|
### Styling
|
|
|
|
The site uses Tailwind CSS with custom utility classes defined in `src/styles/global.css`. Component-specific styles are included in the respective `.astro` files.
|
|
|
|
## 📞 Contact Information
|
|
|
|
For any questions about this website or Tiber365 services:
|
|
|
|
- **Email**: info@tiber365.it
|
|
- **Phone**: +39 123 456 7890
|
|
- **Website**: https://tiber365.it
|
|
- **Blog**: https://blog.tiber365.it
|
|
- **Support**: https://support.tiber365.it
|
|
|
|
## 📝 License
|
|
|
|
This project is proprietary software developed for Tiber365.
|
|
|
|
---
|
|
|
|
Built with ❤️ using [Astro](https://astro.build/) |