|
| 1 | +# WebHub |
| 2 | + |
| 3 | +CD-Labs main website published online at [www.charlesdoucet.com](www.charlesdoucet.com). |
| 4 | + |
| 5 | +A modern, minimalist web application built with pure TypeScript and Vite. This project showcases a clean architecture approach without heavy frameworks, focusing on performance and maintainability. |
| 6 | + |
| 7 | +## 🚀 Features |
| 8 | + |
| 9 | +- **Pure TypeScript Architecture** - No React, Vue, or Angular dependencies |
| 10 | +- **Component-Based** - Modular TypeScript components for reusability |
| 11 | +- **Dynamic Routing** - Client-side routing system |
| 12 | +- **Performance Optimized** - Minimal bundle size and fast loading |
| 13 | + |
| 14 | +## 🛠️ Tech Stack |
| 15 | + |
| 16 | +- **Build Tool**: Vite |
| 17 | +- **Language**: TypeScript |
| 18 | +- **Styling**: CSS3 (no preprocessors) |
| 19 | +- **Bundling**: Native ES modules |
| 20 | +- **Development**: Hot Module Replacement (HMR) |
| 21 | + |
| 22 | +## 📁 Project Structure |
| 23 | + |
| 24 | +``` |
| 25 | +src/ |
| 26 | +├── components/ # Reusable UI components |
| 27 | +│ ├── navigation/ # Navigation system |
| 28 | +│ ├── buttons/ # Button components |
| 29 | +│ ├── footer/ # Footer component |
| 30 | +│ └── socials/ # Social media links |
| 31 | +├── content/ # Content management |
| 32 | +│ ├── home/ # Homepage content |
| 33 | +│ ├── about/ # About page content |
| 34 | +│ ├── contact/ # Contact page content |
| 35 | +│ ├── logs/ # Blog articles |
| 36 | +│ └── utils/ # Content utilities |
| 37 | +├── core/ # Core application logic |
| 38 | +│ ├── router.ts # Client-side routing |
| 39 | +│ ├── event-bus.ts # Event management |
| 40 | +│ └── handlers.ts # Event handlers |
| 41 | +├── styles/ # CSS organization |
| 42 | +│ ├── base/ # Reset, variables, typography |
| 43 | +│ ├── components/ # Component styles |
| 44 | +│ ├── layout/ # Layout systems |
| 45 | +│ ├── utilities/ # Helper classes |
| 46 | +│ └── views/ # Page-specific styles |
| 47 | +└── views/ # Page components |
| 48 | + ├── home/ # Homepage views |
| 49 | + ├── about/ # About page views |
| 50 | + ├── contact/ # Contact page views |
| 51 | + └── logs/ # Blog article views |
| 52 | +``` |
| 53 | + |
| 54 | +## 🎨 Architecture Philosophy |
| 55 | + |
| 56 | +This project demonstrates how to build a modern web application using: |
| 57 | + |
| 58 | +- **Vanilla TypeScript** for component logic |
| 59 | +- **CSS Grid & Flexbox** for layouts |
| 60 | +- **CSS Custom Properties** for theming |
| 61 | +- **ES Modules** for dependency management |
| 62 | +- **Event-driven architecture** for component communication |
| 63 | + |
| 64 | +## 🚀 Getting Started |
| 65 | + |
| 66 | +### Prerequisites |
| 67 | + |
| 68 | +- Node.js (v16 or higher) |
| 69 | +- npm or yarn |
| 70 | + |
| 71 | +### Installation |
| 72 | + |
| 73 | +```bash |
| 74 | +git clone https://github.com/cd-bash/webhub.git // 1. Clone the repository |
| 75 | +npm install // 2. Install dependencies |
| 76 | +npm run dev // 3. Start development server |
| 77 | +npm run build // 4. Build for production |
| 78 | +``` |
| 79 | + |
| 80 | +## 📄 License |
| 81 | + |
| 82 | +This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details. |
| 83 | + |
| 84 | +## 🎨 Copyright Notice |
| 85 | + |
| 86 | +### Visual Content & Design |
| 87 | + |
| 88 | +All visual content, including but not limited to: |
| 89 | +- Custom graphics and illustrations |
| 90 | +- Photography and image compositions |
| 91 | +- Video content and animations |
| 92 | +- Logo designs and branding elements |
| 93 | +- UI/UX design layouts and visual compositions |
| 94 | + |
| 95 | +**© 2025 CD-Labs. All rights reserved.** |
| 96 | + |
| 97 | +The visual content and design elements of this website are proprietary and protected by copyrights. They may not be reproduced, distributed, or used in any form without explicit written permission from CD-Labs. |
| 98 | + |
| 99 | +### Code License |
| 100 | + |
| 101 | +The source code of this project (HTML, CSS, TypeScript, and configuration files) is licensed under the MIT License and is available for use, modification, and distribution according to the terms of that license. |
| 102 | + |
| 103 | +### Third-Party Assets |
| 104 | + |
| 105 | +Any third-party assets used in this project retain their original licenses and copyright notices. Please refer to individual asset documentation for specific licensing terms. |
| 106 | + |
| 107 | +--- |
| 108 | + |
| 109 | +For licensing inquiries regarding visual content, please contact: [[email protected]] |
| 110 | + |
| 111 | +## 🤝 Contributing |
| 112 | + |
| 113 | +This is a personal portfolio project. While the code is open source under the MIT License, the visual content and design are proprietary to CD-Labs. |
| 114 | + |
| 115 | +--- |
| 116 | + |
| 117 | +*Built with ❤️ using pure TypeScript and modern web standards* |
0 commit comments