Готов учебник по AJAX в PHP

Для его прохождения нужны знания JavaScript на уровне высшего учебника и знания PHP на уровне основного учебника.

учебник тут:
https://code.mu/ru/ajax/book/php/

Перевод сайта на другие языки

Выложил новые переводы на целую группу языков:)
Список приводить не буду, их много, кому интересно, загляните https://code.mu/

Так как языков стало очень много, то я убрал переключатель языка, который был расположен в уроках справа снизу. Пока вместо него я прикрутил небольшой костыль - показываются ссылки на 5 случайных языков. Попозже сделаю адекватный переключатель:)

Также по просьбе читателей добавил два варианта узбекского языка - с кириллицей и с латиницей. Тут:
https://code.mu/uzc/
https://code.mu/uzl/

Задачник по Dart

Готова первая версия задачника по языку Dart. Задачник по уровням, от простого к сложному.

Смотрите по ссылке:
https://code.mu/ru/dart/tasker/stager/

Задачник по Go

Готов задачник по уровням по языку Go.

Смотрите по ссылке:
https://code.mu/ru/go/tasker/stager/

Справочник Drupal

Готов справочник по таблицам Drupal.

Смотрите по ссылке:
https://code.mu/ru/cms/drupal/manual/table/

Бесплатные курсы по AJAX
Начало: 6-го ноября
Продолжительность: 1 месяц
Преподаватель: Трепачёв Дмитрий, автор сайта code.mu

В рамках данного курса вы сможете изучить изучить технологию AJAX.
Для участия в курсе нужно знать JavaScript на уровне высшего учебника и PHP на уровне основного учебника.

Курсы проходят в формате "менторство": я выдаю учебник, вы его изучаете, задаете вопросы, решаете задачи, присылаете код на проверку. Вопросы можно задавать
в любое время и сколько угодно!

Для записи вступите в следующий канал:
https://t.me/+uK_-o1-0VJA1ZDMy

Бесплатный курс:
Практика на Реальных Проектах и Работы в Портфолио

Начало: 11 ноября
Продолжительность: 1 месяц
Преподаватель: Трепачёв Дмитрий
автор сайта code.mu

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

Для записи вступите в следующий канал:
https://t.me/+iQdCJA8yzv1mZjNi

Опять code.mu под ddos атакой.
не работает на внешний мир, только на Беларусь

Скоро заработает.

P.S.
Ближайшие дни буду решать вопрос с защитой от ddos, чтобы такое не повторялось:)

СВЕЖАЯ ОФЛАЙН ВЕРСИЯ

Собрал текущую офлайн версию сайта. Только светлая тема и только русский язык.

Эта версия временная, так как я сейчас активно меняю учебники и синхронизация версий быстро пропадет.

Позже начну выпускать офлайн версии на регулярной основе.

P.S.
Как пользоваться

Перед использованием распакуйте архив:)
Затем можно открыть любой html файл в браузере. После этого в браузере у вас откроется полноценный сайт. Можете переходить по ссылкам, как в обычном сайте.

Бесплатные курсы по Верстке
Начало: 11-го ноября
Продолжительность: 1 месяц
Преподаватель: Трепачёв Дмитрий, автор сайта code.mu

В рамках данного курса вы сможете изучить: работу с HTML, работу с основными CSS свойствами, продвинутую работу с селекторами, работу со шрифтами, изображениями, фоном, работу с позиционированием, работу с Flex и Grid. Вы сможете освоить продвинутые возможности CSS: градиенты, анимацию и трансформации. Вы также сможете научиться адаптивной верстке для мобильных устройств, а также изучить препроцессоры LESS и SASS и методологию БЭМ.

Курсы проходят в формате "менторство": я выдаю учебник, вы его изучаете, задаете вопросы, решаете задачи, присылаете код на проверку. Вопросы можно задавать
в любое время и сколько угодно!

Для записи вступите в следующий канал:
https://t.me/+fNI9Cl55dZZkMzli

Задачник Django

Готова первая часть тематического задачника по фреймворку Django:
https://code.mu/ru/python/framework/django/tasker/themer/

P.S.
Задачник еще будет дорабатываться, но уже можно пользоваться:)

Обновил задачник по уровням Kotlin

Добавил задачи на списки, карты, множества. Добавил больше задач на многомерность. Добавил задач на типы данных. Добавил больше задач на функции.

Задачник тут:
https://code.mu/ru/kotlin/tasker/stager/

Секретный задачник по Kotlin

Поделюсь также задачником по темам. Этот задачник пока в разработке, поэтому его еще нет в основном меню сайта. Но в нем уже много задач и разных тем:)

Вот он:
https://code.mu/ru/kotlin/tasker/themer/

P.S.
Этот задачник я постоянно дорабатываю, поэтому внезапно может поменяться порядок уроков или добавиться новый раздел посередине:) Но кому очень нужно, то уже можно пользоваться)

ОТКРЫТА ЗАПИСЬ на НОВЫЙ КУРС
Автоматизация рутинных операций на JavaScript.

Формат: репетиторство
Стоимость: 20$ за 1.5 часа

Как проходит:
мы созваниваемся с показом экрана, я рассказываю вам теорию, а затем вы при мне отрабатываете ее на задачах, а затем закрепляете через домашнее задание.

Стоимость: 20$ за полтора часа. Курс рассчитан на 5 занятий.
Для записи напишите мне в личку: @trepachev_dmitry

---

В чем суть? С помощью JavaScript и специальных плагинов можно управлять браузером. Это значит, что вы можете выполнить любой JavaScript для любого сайта. С помощью такого подхода можно автоматизировать любые операции на сайтах. Например, можно нажимать на произвольные кнопки по расписанию, отслеживать новую информацию на сайтах, автоматически заполнять формы, скачивать картинки, музыку и фильмы, скачивать любую текстовую информацию, автоматически рассылать сообщения в месседжерах и социальных сетях, автоматически постить в каналы, автоматически выполнять переводы текстов на любые языки, можно автоматически обращаться к различным нейросетям, генерировать контент на заданную тематику и автоматически постить его в свои каналы.

Тема очень интересная, но информации по ней в открытом доступе крайне мало. Я занимаюсь подобным с 2012 года и за это время накопил богатый опыт, которым могу поделиться с вами:)

Покажу на примерах:)

Пример 1
Посмотрите на канал Занимательные задачи JavaScript: https://t.me/javascript_tricker
В этом канале каждый день выходит новый пост с задачей. Ежедневно постить задачи вручную было бы очень трудоемко. К счастью, в телеграмм можно делать посты по расписанию. Однако, вручную добавить посты на 1-2 месяц вперед тоже очень сложная рутинная работа. Поэтому я написал скрипт, который управляет браузером и автоматически размещает посты на 3 месяца вперед так, чтобы каждый день выходил один пост по расписанию.

Пример 2
Вы обратили внимание на новые справочники, например,
https://code.mu/ru/cms/opencart/manual/table/ и https://code.mu/ru/kotlin/manual/ ?
Они также сгенерированы через автоматическое управление браузером с нейросетью deepseek с последующей минимальной ручной доработкой. При этом на каждый справочник было затрачено менее 1 часа работы скрипта. Вдумайтесь в цифры: в справочнике по Kotlin сейчас 1310 страниц. Если бы я делал его сам вручную, эта работа заняла бы у меня больше месяца!

Пример 3
Вы обратили внимание на то, что code.mu теперь переведен на разные языки? Это я сделал с помощью автоматического управления нейросетью deepseek через браузер. Сейчас в русской версии около 6000 страниц и их перевод на один язык занимает всего 5 часов на одном компьютере.

Почему скрипт работает так быстро?) Дело в том, что я запускаю deepseek сразу во многих вкладках браузера. Но так просто это сделать нельзя, так как deepseek будет отказываться работать одновременно во многих вкладках. Для решения проблемы нужно использовать специальные контейнеры, чтобы каждая вкладка браузера работала как независимый браузер. Ресурсы моего компьютера позволяют одновременно запустить 70 вкладок (потоков). Без этого перевод сайта занимал бы не 5 часов на язык, а 5 * 70 = 350 часов. В моих планах сделать перевод на 50 языков. Без разделения на потоки перевод бы занял 50 * 350 = 17500 часов = 729 дней. Но если ввести 70 потоков, как это делаю я, то 729 дней / 70 = всего 10 дней непрерывной работы.

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

Интересен данный курс?
Задать вопросы и записаться вы можете в личку: @trepachev_dmitry

P.S.
Внимание! Количество мест на формат репетиторство ограничено! На описанный курс сейчас есть 3 свободных места.

Бесплатные курсы по Python
Занятия в виде онлайн лекций

Лектор: Трепачёв Дмитрий, автор сайта code.mu
Начало: 11 декабря
Расписание: пн, чт в 20.15-21.00 по москве
Продолжительность: 10 лекций + 2 недели практики

Для записи вступите в следующий канал:
https://t.me/+v9WeYJ-2fi5iY2Uy

Занимательные задачи
снова выходят:)

По JavaScript:
https://t.me/javascript_tricker

По PHP:
https://t.me/php_tricker

По Python:
https://t.me/python_tricker

Проблемы модульности в CSS

В современной верстке принято разбивать части сайта на независимые модули. Но есть проблема: обычный CSS это не поддерживает. Сейчас я покажу на примере. Пусть у нас есть следующая верстка:
<div class="parent">
<span class="elem">+++</span>

<div class="child">
<span class="elem">---</span>
</div>
</div>

Пусть я хочу, чтобы у меня был блок parent и блок child. Эти блоки должны работать независимо. Это значит, что если я стилизую какой-то элемент из parent, то элемент с таким же именем в блоке child стилизоваться не должен.

Собственно, в этом и проблема. Для примера я специально сделал два элемента с классом elem в обоих наших блоках. Пусть я хочу стилизовать элемент из блока child. Я напишу следующий CSS код:
.parent .elem {
color: red;
}

Этот CSS, однако, зацепит как elem из родительского блока, так и elem из дочернего. Что же с этим делать? Проблему можно решить через соглашения, которые накладываются на имена классов. В данном случае соглашение - это правило, которое мы накладываем на имена наших CSS классов. Мы говорим, что будем следовать этому правилу и не будем его нарушать. Наиболее известным таким соглашением является БЭМ от Яндекс https://ru.bem.info/methodology/.

Перепишем нашу верстку в стиле БЭМ:
<div class="parent">
<span class="parent__elem">+++</span>

<div class="child">
<span class="child__elem">---</span>
</div>
</div>

Стилизуем наш элемент:
.parent__elem {
color: red;
}

Как вы видите, суть соглашения в случае БЭМ - это то, что в имени элемента указывается имя родителя. Это решает описанную выше проблему. Но так как БЭМ это по сути костыль, то проблема решается не очень хорошо. Нам приходится дублировать имена родителя в каждом его элементе. Из-за этого код становится очень многословным и нарушает принцип DRY (https://code.mu/ru/theory/glossary/DRY/).

Новая модульная система в CSS

В предыдущем посте мы рассмотрели проблему модульности в CSS. К счастью, в современном CSS появилась новая команда @scope, с помощью которой можно сделать настоящие модули. Эта команда позволяет написать селектор, который стилизует от заданного родительского класса до заданного дочернего. Ее синтаксис выглядит так:
@scope (селектор1) to (селектор2) {
.elem {
color: red;
}
}

Давайте решим с ее помощью задачу из предыдущего поста. Для этого нам также придется ввести соглашение, но более простое чем в БЭМ. Мы скажем, что все теги, которые должны быть модулями,
будут иметь класс block:
<div class="block parent">
<span class="elem">+++</span>

<div class="block child">
<span class="elem">---</span>
</div>
</div>

Давайте теперь сделаем так, чтобы стили, заданные для класса block, не распространялись внутри дочерних классов блок. Говоря другими словами, сделаем так, чтобы мы могли стилизовать elem из родителя, не зацепив elem и дочернего блока. Используем команду @scope:
@scope (.parent.block) to (.block) {
.elem {
color: red;
}
}

Что дает новая блочная система? Если вы знаете БЭМ, то в ней есть также соглашение на то, что мы среди всех богатых возможностей CSS будем использовать только классы. Это сделано для того, чтобы костыль с соглашениями имен не сломался. Но в модулях через @scope мы можем делать любые селекторы! Давайте посмотрим на примере. Пусть у нас есть обычные абзацы как в родителе, так и дочернем блоке:
<div class="block parent">
<p>
+++
</p>
<p>
+++
</p>

<div class="block child">
<p>
---
</p>
<p>
---
</p>
</div>
</div>

Стилизуем абзацы из родительского блока, не захватив абзацы из дочернего:
@scope (.parent.block) to (.block) {
p {
color: red;
}
}

Поддержка
К сожалению, команда @scope еще имеет недостаточную поддержку. Если смотреть на caniuse, то по мировой статистике ее поддерживают 85% браузеров. Смотрите приложенный скрин.

Но пройдет не так много времени и соглашения типа БЭМ и других аналогичных уже станут не нужны:)

P.S.
Да, @scope еще не поддерживается достаточно. Но его уже можно применять в специфичных проектах. Например, в своих внутренних проектах, которые я делал для себя, я использую @scope уже около года.

P.P.S
Честно вам скажу, я не люблю БЭМ. Он слишком многословный. Поэтому на сайте code.mu другая модульная система, придуманная мною. Она менее многословная, но все равно костыльная.

Но, пару недель назад, я залез в верстку сайта code.mu, чтобы добавить несколько новых блоков. И решил заодно перевести сайт на модульную систему через @scope. Да, еще вроде как рановато:) Но аудитория сайта технически подкованная и не ленится обновлять браузер. Поэтому я полагаю, что особых проблем не будет.

Обновление сайта code.mu

На днях состоится обновление движка сайта. Сайт прекращает поддержку старых браузеров (кому интересны технические подробности, смотрите предыдущие 3 поста). Если в вашем браузере не будут работать CSS стили, ваш браузер устарел, обновитесь.

Если будет сломано что-то другое, пишите мне в личку, я поправлю)

P.S.
Кто по каким-то причинам не может обновить браузер - можно заюзать офлайн версию со старой блочной системой https://t.me/codemu/264.

P.S.S
В рамках данного обновления будет
добавлен перевод сайта еще на 11 языков.