dojo media
главная
блог
Hello! ✨ Классическая веб разработка
фронт бэк
👋 Привет! Я @AndrewDojoMedia
🚀 Я — Андрей Цай, предприниматель, digital-маркетолог и основатель Dojo Media — агентства, которое делает сайты, SEO и digital-решения для клиентов из РФ/EC/США и не только.
👀 Интересуюсь:
– биохакингом и ЗОЖ 📈
– созданием ботов и микросервисов на Linux 💻
– видеоиграми и тем, как они развивают предпринимательское мышление 🎮🧠
🌱 Сейчас учусь:
– как прокачать себя в зале без ущерба для сна
– делать лекции, после которых студенты не залипают в телефон 🤓
– минималистично бэкапить проекты без боли Git
💞️ Открыт к коллаборациям:
– по SEO
– по AI-агентам
– по Telegram-ботам 🤖
– по стартапам на стыке digital, контента и автоматизации
– по обмену инсайтами про маркетинг, сон и креатив
📫 Связь:
– Telegram @andrei7685
– или через сайт агентства
РЕЙТИНГИ И НАГРАДЫ
Что такое веб-разработка?
Процесс создания сайтов и веб-приложений — творческий и технологический подход к построению цифрового мира.
Зачем это нужно?
От социальных сетей до интернет-магазинов и стриминговых платформ — веб-разработка обеспечивает нашу онлайн-жизнь.

Бернерс-Ли

создал первый сайт
Минимализм в своей чистоте: простой текст и гиперссылки, демонстрирующие потенциал новой технологии.
Эволюция интернета
От медленных dial-up соединений до молниеносных современных скоростей — путь технологического прогресса.
Структура сайта
Два ключевых компонента:
  • Фронтенд
    (интерфейс) — видимая часть
  • Бэкенд
    логика
Фронтенд — что это?
Всё, что пользователь видит и с чем взаимодействует — визуальная и интерактивная оболочка веб-приложения.
Бэкенд — что это?
Серверная часть, отвечающая за обработку данных, логику приложения и взаимодействие с базами данных.

Технологии фронтенда

Три кита современной веб-разработки:

  • HTML — структура

  • CSS — стилизация

  • JavaScript

    интерактивность
HTML
Язык разметки, создающий базовую структуру и контент веб-страницы. https://dojo-media.ru/portfolio
CSS
Технология стилизации, отвечающая за визуальное оформление и дизайн сайта. (https://dojo-media.ru/)
JavaScript
Язык программирования, придающий сайтам динамику и интерактивность. (https://dojo-media.ru/)
Технологии бэкенда
Популярные языки программирования:
  • Python
    Python — это суперпопулярный язык программирования, известный своей простотой и мощью 💪
    Он читается почти как английский, поэтому его легко изучать и быстро на нём писать.
  • PHP
    PHP — это проверенный временем язык для веба 🌐
    Он запускает серверную часть сайтов: обрабатывает формы, подключает базы данных, генерирует HTML.

    💼 Почему его всё ещё используют?

    🔹 Идеален для сайтов и CMS (WordPress, Joomla)
    🔹 Прост в развертывании
    🔹 Работает быстро и стабильно
    🔹 Поддерживается хостингами из коробки
  • Node.js
    Node.js — это JavaScript на сервере 💻⚡
    Позволяет писать и фронт, и бэкенд на одном языке — удобно и быстро!

    🚀 Почему выбирают Node.js?

    🔹 Высокая скорость (работает на движке V8 от Google)
    🔹 Идеален для real-time приложений (чаты, игры, стримы)
    🔹 Огромное сообщество и море готовых пакетов (npm)
    🔹 Отлично масштабируется

🖥 Что такое сервер и хостинг в вебе?

📦 Виды хостинга:
1. 🔹 Обычный (Shared Hosting) — ты делишь сервер с другими сайтами. Дёшево, но ограничено.
2. 🔹 VPS (Virtual Private Server) — больше свободы, отдельные ресурсы, почти как свой сервер.
3. 🧱 Выделенный сервер — целая машина только для тебя. Максимум мощности, гибкости и ответственности.
Базы данных
Системы хранения и управления информацией для эффективной работы сайтов.
Взаимодействие фронтенд и бэкенд Фронтенд отправляет запросы, бэкенд обрабатывает их и возвращает результат.
Пример: Регистрация на сайте От заполнения формы до сохранения данных в базе — полный цикл работы веб-приложения.
Современные сайты:
Динамичные, с мультимедиа и анимацией.
https://www.apple.com/imac/
https://www.garmin.com/en-US/

Профессии
Frontend ⭐
backend 😊
Fulstack 🔥
Web Designer 🎉
Fulstack Designer web+front ❤️
Ai+vibe+promt ✨
Веб Дизайн
Figma
https://www.figma.com/design/YCCvjJaR8UkqdL2M6QuWdA/Uniso---eCommerce-Design-Template?node-id=0-1&p=f&t=LxQEmwrEyHTNj4nK-0
Интерактивный прототип
тест до верстки
https://www.figma.com/proto/WiqpCm9rE2JxA2UjnsvBAC/UNDERLINE--%D0%BF%D1%80%D0%BE%D1%82%D0%BE%D1%82%D0%B8%D0%BF?page-id=0%3A1&node-id=13-30361

Готовые решения

https://dojo-agency.com/

https://elements.envato.com/ru/
github.com
https://github.com/AndrewDojoMedia
PWA Progressive Web Apps
это сайты, которые ведут себя как мобильные приложения. Они быстрые, работают оффлайн и могут отправлять уведомления, как приложения из магазина! Всё это благодаря специальным технологиям, которые делают обычные веб-страницы "умнее". Например, PWA может загрузиться без интернета, если ты уже заходил на сайт раньше. (https://ru.pinterest.com/)
https://dojo-media.ru/tpost/9gkr25kbd1-spokoistvie-prilozhenie-dlya-meditatsii
Безопасность в вебе Основы защиты сайта: пароли, HTTPS, XSS и CSRF.
Пароли
Пароли — это ключ к твоему сайту. Нельзя хранить их просто так, как "12345", потому что хакеры легко их угадают. Шифрование превращает пароль в непонятный код, например, "k9$p#m1". Так никто не узнает настоящий пароль, даже если заглянет в базу!

HTTPS
Видел "замочек" рядом с адресом сайта? Это HTTPS. Он шифрует всё, что ты отправляешь (например, логин или сообщение), чтобы никто не подслушал. Без него данные — как открытая книга для хакеров.

XSS (Cross-Site Scripting)
Это когда хакер через форму или комментарий "подсовывает" вредный код, например, "<script>украсть всё</script>". Если сайт не проверит, что ввели, этот код сработает. Защита: всегда чисти и проверяй, что пишут пользователи.

CSRF (Cross-Site Request Forgery)
Хакер может обмануть сайт, притворившись тобой. Например, ты кликаешь на "крутую ссылку", а она тайно меняет твой пароль. Чтобы этого не случилось, сайт должен проверять запросы с помощью секретных токенов — это как пропуск "я настоящий".


CMS
WordPress — самая известная, подходит для блогов, сайтов и магазинов.
Bitrix — популярна в России, для бизнеса и сложных сайтов.
Shopify — для интернет-магазинов, легко настроить продажи. (США)
Squarespace — стильные шаблоны, идеально для портфолио.

Фреймворк — это как набор готовых "кирпичиков" для создания сайтов или приложений. Он помогает писать код быстрее и удобнее, но требует знаний программирования. Это не готовый сайт, как CMS, а инструменты для твоих идей!
фреймворк
React — для крутых интерфейсов, как у Facebook или Instagram.
Django — для сайтов с базами данных, например, форумов или магазинов.
Vue.js — лёгкий и гибкий, для интерактивных страничек.
web
CMS нужна для быстрого создания стандартных сайтов , а фреймворк — для сложных, уникальных проектов, где ты сам пишешь логику.
Веб Аналитика
Яндекс Метрика