Astro + MDX / новая версия 404.su

Код, SEO и аналитика для интернет-маркетинга

Современный контентный сайт для статей, сниппетов кода, диаграмм, графиков, подборок инструментов и практических заметок программиста-маркетолога.

Открыть блог Смотреть инструменты

SEOAPIMDXChartsAutomation

44ресурсаMDXстатьи0 JSпо умолчанию

Возможности

Основа для блога, справочника и лаборатории кода

Структура рассчитана на рост: можно добавлять рубрики, статьи, коллекции инструментов, аналитические страницы и интерактивные демо.

Статьи на MDX

Публикации можно писать как Markdown, но вставлять внутрь компоненты, графики, примеры и интерактивные блоки.

Кодовые блоки

Подсветка синтаксиса, примеры PHP, JS, SQL, API-запросов и готовые snippets для практики.

Графики и диаграммы

Встроенные компоненты для аналитики, воронок, схем процессов, SEO-метрик и маркетинговых отчетов.

Каталог инструментов

Ссылки на сервисы сгруппированы по задачам: аудит, аналитика, API, контент, реклама и дизайн.

Статика для Beget

Astro собирает быстрый HTML, который можно выгрузить в public_html без Node.js на хостинге.

SEO из коробки

Canonical, sitemap, robots, Open Graph, чистая семантика и быстрые страницы для поисковых систем.

Code snippets

Куски кода прямо в статьях

В MDX можно публиковать заметки с кодом, пояснениями, чеклистами и интерактивными блоками. Подходит для API-интеграций, парсеров, SEO-проверок и автоматизации отчетов.

PHP, JavaScript, SQL и shell-примеры с подсветкой.
Вставка компонентов прямо внутрь MDX-материала.
Готовая структура для рубрик и тегов блога.

seo-audit.tsAstro / MDX

type Check = {
  name: string;
  score: number;
  status: "ok" | "warning" | "error";
};

const checks: Check[] = [
  { name: "robots.txt", score: 100, status: "ok" },
  { name: "sitemap.xml", score: 100, status: "ok" },
  { name: "Core Web Vitals", score: 82, status: "warning" }
];

export const averageScore =
  checks.reduce((sum, item) => sum + item.score, 0) / checks.length;

Analytics

Графики, диаграммы и схемы процессов

Для простых материалов хватит статических SVG/CSS-графиков. Для интерактивных отчетов уже установлен ECharts, а диаграммы можно выводить Mermaid-компонентом.