📣 Необычный ползунок диапазона на CSS и JavaScript

Unicycle Range Slider - ползунок с человечком на одноколесном велосипед, а при изменении диапазона числовое значение отображается на флаге

Код и демо: codepen.io/jkantner/pen/wvarNEp

Так, спасибо всем, кто написал мне!

Удивительно, но почти все догадались, с кем у меня была запись подкаста.
Конечно же - Алексей Лукацкий
Ну а кто же ещё?

Это было настолько интересное интервью, что не хотелось останавливаться вообще:
мы успели пройтись по всему — от карьерных путей в кибербезе до «Макса» и всего, что вокруг него крутится.
И в какой-то момент я поймала себя на мысли:
«Если бы не камеры, мы бы до утра сидели».
Теперь — монтаж
И как только будет готово — первыми узнаете именно вы.

https://t.me/kruasanova_as
всё ещё пишет сама и всё ещё восхищается людьми

WebView вместо нативной разработки: экономия или технический долг?

Масштабирование бизнеса часто упирается в дилемму: клиенты требуют приложение (уведомления, иконка на экране), а смета на штат iOS/Android-разработчиков выглядит неподъёмной.

В инженерной среде принято скептически относиться к «обёрткам» для сайтов и no-code-решениям. Однако с точки зрения бизнеса, Time-to-Market порой важнее архитектурного пуризма. Превращение веб-ресурса в APK через конструктор — это способ проверить гипотезу мобильного присутствия без капитальных вложений в нативный код.

Изучим инструменты быстрой миграции в мобайл и протестируем готовые сборки.

🖥 Пример создания адаптивной верстки сайта с помощь Grid CSS

HTML разметка ⤵️

    

        <div class="layout">

    <header>Header</header>

    <nav>Sidebar</nav>

    <main>Main</main>

    <article class="widget">Widget</article>

    <article class="statistics">Statistics</article>

    <footer>Footer</footer>

</div>{}

    

CSS стили ⤵️

    

        .layout {

  display: grid;

  gap: 4px;

  grid-template-rows: 40px 40px auto 60px 60px 40px;

  grid-template-columns: 1fr;

  grid-template-areas: 'header' 'sidebar' 'main' 'widget' 'statistics' 'footer';

  height: 100vh;

}

@media (min-width: 480px) {

  .layout {

    display: grid;

    grid-template-rows: 40px auto 80px 40px;

    grid-template-columns: 160px auto auto;

    grid-template-areas: 'header header header' 'sidebar main main' 'sidebar widget statistics' 'footer footer footer';

  }

}

header {

  grid-area: header;

  background: #c08bfd;

}

footer {

  grid-area: footer;

  background: #c08bfd;

}

nav {

  grid-area: sidebar;

  background: #f6c356;

}

main {

  grid-area: main;

  background: #b2ee94;

}

.widget {

  grid-area: widget;

  background: #ff8983;

  width: 100%;

}

.statistics {

  grid-area: statistics;

  background: #99c2fe;

  width: 100%;

}{}

    

👍- если было полезно | ➡️ WebTaverna

Чувствую себя жёлтой уточкой

Сын пишет сообщение «помоги с кодом». Ну чтобы не кричать на весь дом мы часто переговариваемся через iMessage сообщения дома.

Я подымаюсь на второй этаж к нему в комнату. Он мне начинает объяснять, в чем проблема у него с игрой, которую он делает на Godot и тут же говорит: «все ясно, дальше я разберусь». И я как желтая уточка спускаюсь вниз, продолжать смотреть телевизор. Вот так сын гоняет меня по лестнице, чтобы я просто работал уткой.

На самом деле такое часто было, особенно, когда я работал на Sony. У нас там не было нормального дебагера и приходилось ловить отладочные сообщения через DebugView. Это вынуждало больше думать о логике кода и очень хорошо помогала просто возможность рассказать другому, что происходит.

Желтая уточка - это реальность. Если застряли где-то, то возьмите какую-нибудь игрушку, можно живого кота (у него глаза умные), и объясните ему проблему, что вы уже рассказали, как выполняется код и где вы подозреваете есть баг.