Frontend Space

Создаём веб-сайт, как будто сейчас 1999 год Нашёл для вас забавное чтиво. В нём автор предлагает погрузиться в атмосферу веб-разработки конца 90-х и начала 00-х годов. Иметь свой сайт тогда хотел каждый второй. Попробуем вернуться в прошлое и воспроизвести похожий веб-дизайн — яркий, с тонной gif и нетипичными шрифтами. ➡️ Читать статью Frontend Space // чат

Полное руководство по функции «calc()» в CSS В CSS есть особая функция calc(), применяемая для выполнения простых вычислений. Из этой статьи вы узнаете, как и где она применяется — на примерах и с понятными пояснениями. ➡️ Читать статью Frontend Space // чат

🎰 Проект: делаем свою слот-машину как в онлайн-казино В данной статье показали, как сделать очень простую слот-машину (как в онлайн-казино), которая будет показывать случайные эмодзи фруктов и овощей на трёх слотах. Проект поможет попрактиковаться в CSS-анимациях, работе с DOM и массивами в JavaScript. Frontend Space // чат

Тесты на знание основ HTML и CSS Держите сразу 2 теста: первый по HTML, второй по CSS. С помощью них вы сможете проверить свои знания и определить слабые места в области вёрстки сайтов. В каждом по 25 вопросов разного уровня сложности, а в конце вы узнаете свой результат. Frontend Space // чат

👩‍💻 Box Shadow CSS Generator А если не хотите сами разбираться с box-shadow, то вот хороший сайт, который за вас сам настроит CSS по ваши нужды. От вас требуется только передвинуть ползунки и скопировать полученный код 😊 Frontend Space // чат

Адаптивная вёрстка сайта с нуля для начинающих Нашёл для вас небольшой плейлист, в котором автор пошагово обучает созданию одностраничного сайта, используя HTML и CSS. ➡️ Смотреть видео & Скачать видео Frontend Space // чат

⚡️ Vue JS: полный курс c нуля В этом видеокурсе рассматриваются: основы Vue 3, работа с данными, компоненты, взаимодействие с сервером, расширение фреймворка, оптимизация производительности, развертывание на сервере. Курс предназначен для разработчиков, которые уже имеют опыт работы с JavaScript и хотят углубить свои знания в области фронтенд-разработки.

🎮 Sturdy-Doodle: креативный сайт-портфолио Веб-сайт для демонстрации профилей, созданный с помощью HTML, Canvas, CSS и JavaScript. Пользователи могут управлять персонажем, чтобы добраться до красной консоли, что позволяет перемещаться между разделами сайта. Frontend Space // чат

Уже очевидно, что ВАЙБКОДИНГ — главный навык ближайших лет Посмотрите сами. ИИ уже забирает на себя работу целых команд: пишет код, закрывает задачи джунов и позволяет стартапам запускать продукты в 2–3 раза меньшим составом. То, на что раньше нужны были несколько разработчиков, сегодня всё чаще делает один человек с ИИ-агентами. И это только начало. Те, кто освоит вайбкодинг сейчас, смогут быстрее запускать проекты, автоматизировать огромный объём работы, увереннее конкурировать на рынке и зарабатывать больше тех, кто продолжает делать всё вручную. Начать с нуля поможет канал Вайб-кодинг. Там ребята круглосуточно мониторят более 320 российских и зарубежных источников и публикуют только главное: релизы, инструменты, гайды, курсы и практические кейсы. Подписывайтесь, нас уже 60 тысяч: @vibecoding_tg

🔖 485 SVG-иконок на все случаи жизни Откопал для вас огромную коллекцию различных SVG-иконок, которые вы сможете использовать в своих проектах. ➡️ Есть возможность скачивания в формате SVG, а также копирования в виде различных компонентов для React, Vue, Angular, Svelte и Web Component.

🤔 Как сделать новый шаблон страницы в WordPress на основе старого Представим, что у нас есть новостной сайт на WordPress, где все титульные изображения имеют фиксированное соотношение сторон, например 2:3 или 16:9. Пока загружаемые картинки соответствуют этим пропорциям, всё выглядит нормально. Но при добавлении новой рубрики, например, с мемами о киногероях, соотношение сторон становится непредсказуемым. В результате изображения обрезаются под стандартный формат, портя внешний вид. 🛠 Решение: так как сам дизайн страницы нас устраивает, нужно просто создать новый шаблон. Он сохранит весь текущий стиль, но изменит отображение обложки — вместо обрезки она будет показываться полностью. Frontend Space // чат

👨‍💻 Стоит ли фронтенд-разработчикам переходить на фриланс в 2025 году? В статье вы узнаете, какие есть перспективы у фронтент-разработчиков, что ждет отрасль в будущем и стоит ли специалистам переходить на фриланс. Frontend Space // чат

🔭 Калейдоскоп на JavaScript Любопытный проект на голом JavaScript — скрипт, который делает калейдоскоп из любого изображения. Вы можете выбрать как саму картинку (любую, по URL), так и количество граней и скорость смены экспозиции. Frontend Space // чат

🛡 Зачем нужен CORS: просто о сложном CORS — чрезвычайно полезный инструмент в мире, где орудуют киберпреступники и запускаются некорректно настроенные веб-серверы. 👉 Из этой статьи вы узнаете, что такое CORS и как он может уберечь вас от межсайтовых подделок запросов. Frontend Space // чат

👨‍💻 Responsive Image Carousel (Animation) Отзывчивая карусель с фото и анимацией Исходник с кодом на CodePen Frontend Space // чат

👩‍💻 Вводный курс по React за 90 минут Хороший разбор от одного из главных каналов по программированию на Ютубе. Само видео на английском, но поверх наложен качественный дубляж для удобства изучения материала. Содержание видео (под катом): 00:00:00 Введение в курс 00:01:55 Необходимые знания 00:02:43 Что такое React? 00:04:57 Настройка среды разработки 00:06:24 Создание React-приложения 00:09:17 Структура проекта 00:11:20 Создание компонента React 00:16:41 Как работает React 00:19:00 Экосистема React 00:21:04 Построение компонентов 00:21:40 Создание компонента ListGroup 00:27:15 Фрагменты 00:29:42 Отображение списков 00:33:11 Условный рендеринг 00:38:36 Обработка событий 00:44:43 Управление состоянием 00:50:44 Передача данных через Props 00:54:42 Передача функций через Props 00:58:27 Состояние против Props 01:00:00 Передача дочерних элементов 01:05:04 Инспекция компонентов с помощью React Dev Tools 01:07:14 Упражнение: создание компонента кнопки 01:14:15 Упражнение: показ уведомления Frontend Space // чат

🎲 Современные способы переключения контента Когда речь заходит о переключении контента, мы обычно используем свойства display: none или opacity: 0 + JavaScript. Однако, современный веб стремительно развивается, и, возможно, настало время рассмотреть другие подходы к переключению контента. В статье узнаем какие нативные API на сегодняшний день поддерживаются, их достоинства и недостатки, а также некоторые нюансы, о которых мы могли и не подозревать. Frontend Space // чат

👩‍💻 Всем программистам посвящается! Вот 14 авторских обучающих IT каналов по самым востребованным областям программирования: Выбирай своё направление: 👩‍💻 Python — t.me/python_ready 🤔 InfoSec & Хакинг — t.me/hacking_ready 🖥 SQL & Базы Данных — t.me/sql_ready 👩‍💻 IT Новости — t.me/it_ready 🤖 AI & ML — t.me/neuro_ready 👩‍💻 Frontend — t.me/frontend_ready 👩‍💻 C/C++ — https://t.me/cpp_ready 👩‍💻 C# & Unity — t.me/csharp_ready 👩‍💻 Linux — t.me/linux_ready 👩‍💻 Java — t.me/java_ready 📖 IT Книги — t.me/books_ready 📱 JavaScript — t.me/javascript_ready 🖼️ DevOps — t.me/devops_ready 🖥 Design —t.me/design_ready 📌 Гайды, шпаргалки, задачи, ресурсы и фишки для каждого языка программирования!

👩‍💻 CSS Gradient Если вам нравятся градиенты, обязательно загляните на этот сайт. Здесь можно создать градиент любой сложности, используя любые цвета. Оттенки настраиваются слайдерами или вручную через шестнадцатеричные коды. Даже если он вам никогда не понадобится, залипнуть можно надолго! Frontend Space // чат

Чем заменить Claude Code в России: китайские ИИ вместо западных сервисов Российским пользователям все чаще блокируют аккаунты в западных ИИ-сервисах, возникают проблемы с оплатой, а привычные инструменты становятся менее доступными. Но это не повод отказываться от ИИ как рабочего инструмента. На бесплатном практикуме Кирилл Пшинник, CEO Университета Зерокодера, покажет, как работать с китайскими ИИ ZCode и DeepSeek Harness на практике: от создания сайтов до аналитики и автоматизации задач. Что ждет вас на практикуме? • Собрать дашборд с графиками и выводами из таблицы; • Создать лендинг с формой заявки по текстовому описанию; • Получить 3D-модель, просто описав объект словами; • Начать работать из России без блокировок и обходных путей. Также сравним китайские инструменты с Claude Code и Codex, разберем их возможности, ограничения и то, что действительно доступно бесплатно. Бонус: сборник из 30 идей для вайбкодинга, доступ к закрытой базе ИИ-решений и гайды по установке китайских ИИ из РФ. Бесплатная регистрация по ссылке.