mdmarufhossen71/website

1. Overall shape

- This is a static, multi-section personal portfolio site rather than a server-rendered app.

- The main runtime is the browser; pages are plain HTML/CSS/JS and are deployed as a static site with a custom domain (CNAME) and GitHub Pages-style artifacts (dist/).

2. Primary site shell

- The root-level pages (index.html, 404.html, thank-you.html, about-this-website.html, faq.html, privacy-policy.html, terms-and-conditions.html, disclaimer.html, security.html) form the core website boundary.

- These pages provide the portfolio, legal/utility pages, and user journey endpoints.

3. Portfolio/homepage layer

- The homepage is the main entry point for the personal brand: services, credentials, contact paths, and visual presentation.

- Shared presentation assets live in Design/style.css and top-level JavaScript/ files, indicating the homepage uses a dedicated style/script set separate from the tools/games subsystems.

4. Blog subsystem

- blog/index.html and the many files in blog/posts/ form a static content publishing area.

- Blog styling is isolated in blog/assets/css/blog.css, with its own images folder, so blog pages are a distinct content boundary optimized for SEO and long-form articles.

5. Tools subsystem

- tools/index.html is the tools hub, and tools/apps/*.html are individual utility pages such as calculator, color picker, image compressor, text counter, and unit converter.

- The shared behavior is centralized in tools/js/tools-app.js and tools/js/tools-implementations.js, with common layout pieces in assets/includes/tools-games-header.html and assets/includes/tools-games-footer.html.

6. Games subsystem

- games/index.html is the game portal, with each game isolated in its own folder (snake, memory-matching, tic-tac-toe-ai, space-shooter, etc.).

- Shared game infrastructure lives in games/js/games-app.js, games/js/games-implementations.js, and games/shared-game.css, which suggests a hub-and-spoke pattern: one launcher, multiple self-contained mini-apps.

7. Client-side behavior and interactions

- Global UI behavior is handled by browser JS files such as JavaScript/script.js, JavaScript/floating-bubbles.js, assets/js/smart-navbar.js, and assets/js/useSmartNavbar.js.

- These scripts support navigation, motion/animation, and interactive effects; there is no evidence of a backend app server in the runtime path.

8. Analytics, ads, and tracking

- JavaScript/analytics.js, ads.txt, and the README’s GA4/GTM references show the site is instrumented for traffic analytics and monetization.

- This is a front-end concern: pages emit tracking events and expose ad verification metadata, but the core content remains static.

9. SEO and publishing infrastructure

- sitemap.xml, robots.txt, site.webmanifest, 404.html, and CNAME are the key site-ops files that shape discovery, indexing, installability, and domain routing.

- The presence of a Google site-verification-style text file and the manifest indicates the site is optimized for search visibility and PWA-style metadata, not for authenticated application workflows.

10. Build and deployment boundary

- vite.config.js, package.json, package-lock.json, and the committed dist/ directory indicate a build step exists, but the deployed artifact is still static HTML/CSS/JS.

- In practice, the build pipeline likely packages assets and outputs production-ready files; the hosting layer then serves them directly without backend compute.

11. External/service boundary

- The README mentions Google Fonts, Font Awesome, Google Analytics, Google Tag Manager, and Google Translate, so the site depends on several third-party client-side services.

- These are used for typography, icons, analytics, and multilingual presentation; they are not core application logic.

12. Data/content model

- Most content is file-based: each page or post is an individual HTML document, which keeps routing simple and makes SEO-friendly URLs straightforward.

- The supabase/migrations/20260129161805_create_blog_structure.sql file suggests a future or auxiliary database-backed blog structure, but the repository as shown is still primarily static and file-driven.