CodeBase | Frontend
2.03K subscribers
488 photos
224 videos
4 files
795 links
Все самое интересное и полезное у нас 😎

Контакт: @Filgood777 (реклама, сотрудничество)
Download Telegram
Инструкция в виде комикса по основам пайки.

Скачать ТУТ 💾💾💾

Репост лайк подписка

Подпишись на наш ТГ https://t.me/club_arduino

Библиотека с книгами https://t.me/Geek_book_hub

Канал по Али https://t.me/Ali_radio_top

Андроид софт премиум https://t.me/Pirate_Gram
⚙️ Что такое свойство gap в CSS и зачем оно используется?

Свойство gap управляет расстоянием между элементами во flex- и grid-контейнерах.

Это современная замена margin для управления отступами между, а не вокруг элементов


➡️ Пример:

<div class="container">
<div class="item">1</div>
<div class="item">2</div>
<div class="item">3</div>
</div>

<style>
.container {
display: flex;
gap: 16px;
}

.item {
padding: 10px;
background: #007bff;
color: white;
}
</style>


🗣 gap — чистый и предсказуемый способ управлять расстояниями в современных интерфейсах.

CodeBase | Frontend | #CSS
Please open Telegram to view this post
VIEW IN TELEGRAM
👍52🎄2
🖥 Верстаем сложный прогрессбар в 2026 году

Автор показывает, как сегодня делать круговой прогрессбар на чистом CSS: один div, одно свойство, нормальная поддержка. Потом тюнинг, визуал и немного CSS-магии. Без SVG-страданий.

🔗 Ссылка

CodeBase | Frontend | #article
Please open Telegram to view this post
VIEW IN TELEGRAM
👍41🎄1
Please open Telegram to view this post
VIEW IN TELEGRAM
😁41😭1
This media is not supported in your browser
VIEW IN TELEGRAM
⚡️Text frame border animation rotation — Рамка из текста с анимацией вращение и эффектом при наведении.

Технологии: HTML, SCSS

🔗 Ссылка

CodeBase | Frontend | #animate
Please open Telegram to view this post
VIEW IN TELEGRAM
1
Появился мощный инструмент для прохождения собеседований — Sobes Copilot.

Это нейросеть, которая подсказывает ответы прямо во время интервью, анализируя разговор в реальном времени.

Copilot работает незаметно в Zoom, Google Meet, Teams и других платформах. Поддерживает русский язык, не виден при демонстрации экрана и помогает держать уверенный темп диалога, даже если вопрос сложный или неожиданный.

Дополнительно Sobes Copilot делает пост-анализ собеседования: разбирает диалог после созвона, подсвечивает сильные и слабые моменты, удачные формулировки и зоны роста. Это позволяет понять, что сработало, а что стоит улучшить перед следующим интервью.

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

🎁 Промокод: SOBES26 — даёт 10% скидки на старт.
2
👩‍💻 Метод Array.from() в JavaScript и как он используется

Метод Array.from() создаёт настоящий массив из массивоподобных или итерируемых объектов
(например, NodeList, arguments, Set, Map).

➡️ Пример:

const buttons = document.querySelectorAll("button");

const btnArray = Array.from(buttons);
btnArray.forEach(btn => btn.classList.add("active"));


🗣️ В этом примере:

querySelectorAll возвращает NodeList, а не массив
Array.from() превращает его в массив
• после этого доступны map, filter, forEach и другие методы

Array.from() — это мост между «псевдомассивами» и полноценными массивами, без костылей и циклов


CodeBase | Frontend | #JS
Please open Telegram to view this post
VIEW IN TELEGRAM
2👍2
This media is not supported in your browser
VIEW IN TELEGRAM
⚡️ Jelly Squish Button — Кнопка с эффектом желе.

Технологии: HTML, SCSS, JS

🔗 Ссылка

CodeBase | Frontend | #animate
Please open Telegram to view this post
VIEW IN TELEGRAM
👍31😁1
🖥 Прагматичное руководство по современным цветам в CSS

Автор разбирает, как новые CSS-фичи для работы с цветом упрощают жизнь разработчику: что появилось, зачем это нужно и как использовать, не влезая в теорию цвета.

🔗 Ссылка

CodeBase | Frontend | #article
Please open Telegram to view this post
VIEW IN TELEGRAM
2👍2
🖥 Какие новые HTML и CSS фичи полностью поддерживаются браузерами в 2026 году

Автор собрал HTML и CSS-фичи, которые к 2026 стали реально поддерживаться браузерами. Без теории и споров, просто список того, что уже можно смело тащить в прод.

🔗 Ссылка

CodeBase | Frontend | #article
Please open Telegram to view this post
VIEW IN TELEGRAM
1👍1🔥1
👩‍💻 Объект

Кроме примитивных типов в JavaScript существуют и сложные — например, объект.

🗣️ Объект (object) — это набор свойств. Каждое свойство состоит из названия и значения. Название может быть строкой или символом, а значение может быть любым.

➡️ Объекты в JavaScript используются повсюду, особенно для хранения данных. Для уверенной работы с объектами необходимо знать, как создавать объект, как его изменять и как читать значения свойств.

Пустой объект без свойств можно создать парой фигурных скобок:

const cat = {}


✔️ Когда нужно создать объект со свойствами, то их описывают внутри фигурных скобок. Свойства указываются в формате имяСвойства : значение, между свойствами ставится запятая:

const book = {
title: 'Война и мир',
author: 'Лев Толстой',
pages: 1274,
isFinished: true
}


CodeBase | Frontend | #js
Please open Telegram to view this post
VIEW IN TELEGRAM
👍7