https://github.com/kryptonum-dev/woodme
🪵 A high-performance website for WOODME - a custom woodworking and interior design company. Built with Astro.js and Sanity CMS, focusing on performance, accessibility, and user experience. Features include zero-JS by default, optimized image pipeline, WCAG 2.0 compliance, and comprehensive SEO optimization.
https://github.com/kryptonum-dev/woodme
accessibility astro astrojs core-web-vitals jamstack mux performance portable-text sanity turborepo vercel wcag2
Last synced: 4 months ago
JSON representation
🪵 A high-performance website for WOODME - a custom woodworking and interior design company. Built with Astro.js and Sanity CMS, focusing on performance, accessibility, and user experience. Features include zero-JS by default, optimized image pipeline, WCAG 2.0 compliance, and comprehensive SEO optimization.
- Host: GitHub
- URL: https://github.com/kryptonum-dev/woodme
- Owner: kryptonum-dev
- Created: 2024-12-30T10:02:57.000Z (6 months ago)
- Default Branch: main
- Last Pushed: 2025-02-13T15:55:31.000Z (4 months ago)
- Last Synced: 2025-02-13T16:39:49.860Z (4 months ago)
- Topics: accessibility, astro, astrojs, core-web-vitals, jamstack, mux, performance, portable-text, sanity, turborepo, vercel, wcag2
- Language: Astro
- Homepage: https://wood-me.pl
- Size: 2.99 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🏗️ WOODME Website
## Project Overview
A high-performance website for WOODME - a company specializing in custom woodworking, interior design, and architectural solutions. Built with modern technologies focusing on performance, accessibility, and user experience.
## Tech Stack
- **[Astro](https://astro.build)**: Core framework for static site generation
- **[Sanity.io](https://sanity.io)**: Headless CMS for content management
- **[TurboPack](https://turbo.build)**: Monorepo build system
- **[TypeScript](https://www.typescriptlang.org)**: End-to-end type safety
- **[SCSS](https://sass-lang.com)**: Advanced styling
- **[Preact](https://preactjs.com)**: Lightweight React alternative
- **[Bun](https://bun.sh)**: JavaScript runtime and package manager
## Project Structure
- `apps/astro`: Main website application
- `apps/sanity`: Content management system
## Features
### 🎨 Component Library
- 45+ custom Astro components including:
- Animated project references
- Dynamic blog system with reading time estimation
- Interactive galleries and sliders
- Contact forms with international phone support
- Fully managed through Sanity Studio with live previews
### 🎯 Performance
- Zero-JS by default with selective hydration
- Optimized image pipeline with:
- Automated WebP conversion
- Responsive images with proper srcset
- Lazy loading implementation
- Minified and bundled assets via TurboPack
### ♿ Accessibility
- WCAG 2.0 compliance with:
- Semantic HTML structure
- ARIA attributes
- Proper heading hierarchy
- Interactive elements with minimum 44px touch targets
- Keyboard navigation support
### 🔍 SEO & Meta
- Automated meta tags generation
- Dynamic sitemap.xml and robots.txt
- Structured data for:
- Organization
- Blog posts
- Projects
- Canonical URL management
## Why This Approach
### ⚡ Technical Architecture
- Astro-powered static generation for optimal performance
- Strategic hydration with client:load, client:idle, and client:visible directives
- Type-safe development with TypeScript and Astro's built-in checking
### 💻 Developer Workflow
- Monorepo structure with TurboPack for efficient builds
- Organized component library with 45+ reusable sections
- Consistent code style with ESLint and Prettier
### 🎯 Business Advantages
- Content management through intuitive Sanity Studio interface
- Real-time preview capabilities for content editors
- Optimized Core Web Vitals for better SEO rankings
## Authors
- [@oliwiersellig](https://github.com/OliwierSellig)