# denysvitali/thebestmotherfuckingwebsite architecture

> Architecture diagram of the GitHub repository denysvitali/thebestmotherfuckingwebsite, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-05-13). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/denysvitali/thebestmotherfuckingwebsite
- Repository: https://github.com/denysvitali/thebestmotherfuckingwebsite

## Overview

1. This repository is a static website project, not a traditional app with a backend. The whole architecture centers on generating a deployable `dist/` site from source assets under `src/`, then serving that output through static hosting infrastructure.

2. The content/layout layer is Pug-based. `src/pug/index.pug` is the page template source, which is compiled into HTML during the build. This is the main structural boundary for the site’s markup.

3. The presentation layer is authored in Less via `src/less/main.less`. That stylesheet is compiled and bundled into the final site assets, separating style authoring from the deployed CSS.

4. Client-side behavior lives in TypeScript/JavaScript. `src/index.ts` is the TypeScript entrypoint, and `src/js/main.fucking.js` suggests there is also existing JavaScript logic or legacy script content. These are bundled for browser execution rather than run on a server.

5. Static assets are kept alongside the source, including images in `src/img` and the web manifest in `src/dist/site.webmanifest`. That indicates the site includes browser-facing metadata and asset delivery as part of the compiled output.

6. The build pipeline is webpack-driven. `webpack.config.js` and `webpack.config.prod.js` define how templates, styles, scripts, and assets are transformed into deployable files. `tsconfig.json` confirms TypeScript compilation is part of that pipeline.

7. The repository appears to keep some distributable files in version control under `src/dist/`, including `LICENSE.txt` and a `js/` bundle. That suggests the project may ship prebuilt static assets alongside source, or preserve generated files that are part of the site’s final payload.

8. Deployment is purely static-file based. The README says to run `yarn run build` and deploy the contents of `dist/`, so the runtime artifact is just a directory of HTML/CSS/JS/assets rather than a service with APIs or databases.

9. There is explicit web-server configuration for nginx under `nginx/`. The main config plus snippets for CORS, gzip, and security headers show the site is intended to be served by a static web server with production-grade HTTP settings, not by application middleware.

10. Docker support is included via `Dockerfile`, so the site can be packaged into a container that serves the built static files. This is a deployment boundary only; it does not introduce application logic.

11. CI/CD is present through `.github/workflows/deploy.yml` and `.travis.yml`. That implies automated build-and-deploy flow from source to static hosting, likely with publishing of the generated `dist/` artifact.

12. `CNAME` indicates the site is tied to a custom domain, reinforcing that the final architecture is “build static site → publish to hosting/CDN/nginx → serve globally.” The project’s main data flow is one-way: authored source in `src/` becomes compiled assets in `dist/`, which are then served to browsers.

Main entry points: [`webpack.config.js`](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/webpack.config.js) (Webpack config), [`nginx/thebestmotherfuckingwebsite.conf`](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/nginx/thebestmotherfuckingwebsite.conf) (Site vhost), [`src/index.ts`](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/src/index.ts) (TypeScript entry), [`nginx/nginx.conf`](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/nginx/nginx.conf) (Nginx config)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_source["Source"]
  node_pug_template["Pug template<br/>markup source<br/>[index.pug]"]
  node_less_styles["Less styles<br/>style source<br/>[main.less]"]
  node_ts_entry["TypeScript entry<br/>client entry<br/>[index.ts]"]
  node_legacy_js["Legacy script<br/>client script<br/>[main.fucking.js]"]
  node_images["Images<br/>static assets"]
  node_web_manifest["Web manifest<br/>pwa metadata<br/>[site.webmanifest]"]
  node_bundled_js["JS bundle<br/>built asset"]
end

subgraph group_build["Build"]
  node_webpack_base["Webpack config<br/>build config<br/>[webpack.config.js]"]
  node_webpack_prod["Prod config<br/>build config"]
  node_tsconfig["TypeScript config<br/>compiler config<br/>[tsconfig.json]"]
  node_dist_site["Dist site<br/>static output"]
end

subgraph group_deploy["Deploy"]
  node_dockerfile["Dockerfile<br/>container image"]
  node_github_actions["Deploy workflow<br/>ci pipeline<br/>[deploy.yml]"]
  node_travis["Travis CI<br/>ci pipeline<br/>[.travis.yml]"]
  node_custom_domain["CNAME<br/>hosting config"]
end

subgraph group_serving["Serve"]
  node_nginx_main["Nginx config<br/>server config<br/>[nginx.conf]"]
  node_nginx_site["Site vhost<br/>server vhost"]
  node_nginx_security["Security headers<br/>server snippet<br/>[security.conf]"]
  node_nginx_cors["CORS snippet<br/>server snippet<br/>[cors.conf]"]
  node_nginx_gzip["Gzip snippet<br/>server snippet<br/>[gzip.conf]"]
end

node_pug_template -->|"compiled by"| node_webpack_base
node_less_styles -->|"bundled by"| node_webpack_base
node_ts_entry -->|"bundled by"| node_webpack_base
node_legacy_js -->|"bundled by"| node_webpack_base
node_images -->|"copied by"| node_webpack_base
node_web_manifest -->|"packaged by"| node_webpack_base
node_webpack_base -->|"produces"| node_dist_site
node_webpack_prod -->|"extends"| node_webpack_base
node_tsconfig -->|"configures"| node_ts_entry
node_bundled_js -->|"included in"| node_dist_site
node_dist_site -->|"served by"| node_dockerfile
node_dist_site -->|"served by"| node_nginx_main
node_nginx_main -->|"includes"| node_nginx_site
node_nginx_site -->|"includes"| node_nginx_security
node_nginx_site -->|"includes"| node_nginx_cors
node_nginx_site -->|"includes"| node_nginx_gzip
node_github_actions -->|"builds"| node_dist_site
node_travis -->|"builds"| node_dist_site
node_custom_domain -->|"points to"| node_dist_site

click node_pug_template "https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/src/pug/index.pug"
click node_less_styles "https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/src/less/main.less"
click node_ts_entry "https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/src/index.ts"
click node_legacy_js "https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/src/js/main.fucking.js"
click node_images "https://github.com/denysvitali/thebestmotherfuckingwebsite/tree/master/src/img"
click node_web_manifest "https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/src/dist/site.webmanifest"
click node_bundled_js "https://github.com/denysvitali/thebestmotherfuckingwebsite/tree/master/src/dist/js"
click node_webpack_base "https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/webpack.config.js"
click node_webpack_prod "https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/webpack.config.prod.js"
click node_tsconfig "https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/tsconfig.json"
click node_dockerfile "https://github.com/denysvitali/thebestmotherfuckingwebsite/tree/master/Dockerfile"
click node_github_actions "https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/.github/workflows/deploy.yml"
click node_travis "https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/.travis.yml"
click node_custom_domain "https://github.com/denysvitali/thebestmotherfuckingwebsite/tree/master/CNAME"
click node_nginx_main "https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/nginx/nginx.conf"
click node_nginx_site "https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/nginx/thebestmotherfuckingwebsite.conf"
click node_nginx_security "https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/nginx/snippets/security.conf"
click node_nginx_cors "https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/nginx/snippets/cors.conf"
click node_nginx_gzip "https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/nginx/snippets/gzip.conf"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_pug_template,node_less_styles,node_ts_entry,node_legacy_js,node_images,node_web_manifest,node_bundled_js toneBlue
class node_webpack_base,node_webpack_prod,node_tsconfig,node_dist_site toneAmber
class node_dockerfile,node_github_actions,node_travis,node_custom_domain toneMint
class node_nginx_main,node_nginx_site,node_nginx_security,node_nginx_cors,node_nginx_gzip toneRose
```

## Components

### Source

Authoring inputs for the site

- [Pug template](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/src/pug/index.pug): markup source · Main page structure source compiled to HTML · `src/pug/index.pug`
- [Less styles](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/src/less/main.less): style source · Primary stylesheet source compiled into site CSS · `src/less/main.less`
- [TypeScript entry](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/src/index.ts): client entry · Browser code entrypoint bundled for the site · `src/index.ts`
- [Legacy script](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/src/js/main.fucking.js): client script · Existing JavaScript logic bundled for the browser · `src/js/main.fucking.js`
- [Images](https://github.com/denysvitali/thebestmotherfuckingwebsite/tree/master/src/img): static assets · Visual assets shipped with the site · `src/img`
- [Web manifest](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/src/dist/site.webmanifest): pwa metadata · Browser manifest included in the site payload · `src/dist/site.webmanifest`
- [JS bundle](https://github.com/denysvitali/thebestmotherfuckingwebsite/tree/master/src/dist/js): built asset · Generated browser JavaScript output preserved in version control · `src/dist/js`

### Build

Tooling that compiles source into the deployable site

- [Webpack config](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/webpack.config.js): build config · Primary bundling and asset pipeline configuration · `webpack.config.js`
- [Prod config](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/webpack.config.prod.js): build config · Production-specific webpack overrides · `webpack.config.prod.js`
- [TypeScript config](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/tsconfig.json): compiler config · TypeScript compilation settings used by the build · `tsconfig.json`
- **Dist site**: static output · Final deployable site artifact produced by the build

### Deploy

Packaging and automation for publishing the built site

- [Dockerfile](https://github.com/denysvitali/thebestmotherfuckingwebsite/tree/master/Dockerfile): container image · Container packaging for serving the built static files · `Dockerfile`
- [Deploy workflow](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/.github/workflows/deploy.yml): ci pipeline · Automated build-and-deploy workflow · `.github/workflows/deploy.yml`
- [Travis CI](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/.travis.yml): ci pipeline · Legacy CI configuration for build or release automation · `.travis.yml`
- [CNAME](https://github.com/denysvitali/thebestmotherfuckingwebsite/tree/master/CNAME): hosting config · Custom domain binding for the published site · `CNAME`

### Serve

Static web server configuration and hosting setup

- [Nginx config](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/nginx/nginx.conf): server config · Primary static server configuration · `nginx/nginx.conf`
- [Site vhost](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/nginx/thebestmotherfuckingwebsite.conf): server vhost · Virtual host for the deployed website · `nginx/thebestmotherfuckingwebsite.conf`
- [Security headers](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/nginx/snippets/security.conf): server snippet · Reusable security header rules · `nginx/snippets/security.conf`
- [CORS snippet](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/nginx/snippets/cors.conf): server snippet · Reusable cross-origin access rules · `nginx/snippets/cors.conf`
- [Gzip snippet](https://github.com/denysvitali/thebestmotherfuckingwebsite/blob/master/nginx/snippets/gzip.conf): server snippet · Reusable compression rules · `nginx/snippets/gzip.conf`

## Connections

- Pug template → Webpack config: compiled by · Page template is processed through the bundler
- Less styles → Webpack config: bundled by · Styles are compiled into the deployable CSS
- TypeScript entry → Webpack config: bundled by · TypeScript entry is part of the client bundle
- Legacy script → Webpack config: bundled by · Legacy browser script is included in the build
- Images → Webpack config: copied by · Static images are copied into the final site
- Web manifest → Webpack config: packaged by · Manifest file is included in the built payload
- Webpack config → Dist site: produces · Main build emits the deployable static site
- Prod config → Webpack config: extends · Production settings refine the base bundling setup
- TypeScript config → TypeScript entry: configures · TypeScript compiler settings support the browser entrypoint
- JS bundle → Dist site: included in · Prebuilt JS assets are part of the final output
- Dist site → Dockerfile: served by · Container image serves the built static files
- Dist site → Nginx config: served by · Static output is deployed behind nginx
- Nginx config → Site vhost: includes · Main nginx config pulls in the site vhost
- Site vhost → Security headers: includes · Site config applies security headers
- Site vhost → CORS snippet: includes · Site config applies CORS rules
- Site vhost → Gzip snippet: includes · Site config applies compression rules
- Deploy workflow → Dist site: builds · CI workflow generates the deployable site
- Travis CI → Dist site: builds · Legacy CI also targets the static site artifact
- CNAME → Dist site: points to · Custom domain resolves to the published site