Верстальщик от бога
9.22K subscribers
1.38K photos
18 videos
1 file
1.64K links
Регистрация в перечне РКН:
https://knd.gov.ru/license?id=6757e1989d804a279b283165&registryType=bloggersPermission

Самый большой канал по верстке в телеграм.

Чат верстальщиков: @godinhtmlchat

По всем вопросам: @anothertechrock
Download Telegram
Заканчиваете школу или хотите уйти в сферу IT, но не знаете, где учиться программированию и получить диплом государственного образца?

Skillbox совместно с РАНХиГС проводит набор на онлайн-бакалавриат по направлению «Веб-разработка».

Всё как в классическом вузе: семинары, сессия, студенческие льготы и отсрочка от армии, только все занятия и экзамены — онлайн.

Документы и заявление подаются онлайн. Для зачисления нужно предоставить результаты ЕГЭ или пройти вступительные испытания.

Преимущества онлайн-бакалавриата со Skillbox:
— Учёба из любой точки мира.
— Программа, спроектированная под запросы рынка.
— Проекты для портфолио с 1-го курса.
— Стажировки и помощь в трудоустройстве.
— Диплом бакалавра РАНХиГС государственного образца по специальности «Прикладная информатика».

Программировать безумно интересно. Переходите по ссылке за подробностями: https://epic.st/olQ-0u

Реклама. ЧОУ ДПО «Образовательные технологии «Скилбокс (Коробка навыков)», ИНН: 9704088880
👍7👎2
Как сделать простой слайдер на html и javascript

#почитать #junior

Описание решения практической задачи — создание слайдера на html и js. Это не эталонное решение, но код работает. Плюсом идет перечисление самых популярных библиотек для создания слайдеров.

Читать статью
🔥8👍6❤3👎1
🟡Frontend дайджест за неделю c 6 по 12 июля

🔖 Почитать:

▪️ Манипулируй DOM правильно
▪️ [React] Разбираем useId( ) хук под микроскопом
▪️ Не наступил ли у React момент переписывания Angular.js на Angular?
▪️ Как настроить Node.js Express сервер для React
▪️ Как я использую React Hook Form
▪️ Новый перспективный веб-фреймворк Cample.js. Реактивность без VDOM
▪️ Пишем хорошие компоненты, которые захочется переиспользовать, а плохие — не пишем
▪️ Разработка фронтенда ИТ-продукта: какой подход выбрать исходя из задач бизнеса
▪️ Оптимизация Apollo-client
▪️ 8 полезных библиотек React, которые упрощают жизнь разработчику
▪️ Введение в View Transitions API
▪️ Новинки CSS и UI: I/O 2023
▪️ Мои любимые вопросы о CSS с ответами. Версия 2023 года
▪️ Как фронтендеру пройти собеседование: разбор типичных задач и советы от тимлида «РТК ИТ»
▪️ Знакомимся с @scope в CSS
▪️ Разбираемся в REST assured как новичок и не только

👀 Посмотреть:

🌐 JavaScript - Путь самурая. Первые шаги к отладке программы, DEBUG. БЕСПЛАТНЫЙ КУРС IT-KAMASUTRA (⏱ 28:05)
🌐 JS - Путь самурая. Сложная программа, if else, проценты, счётчик. JAVASCRIPT для новичков (⏱ 43:42)
🌐 #1 "Джуны и сеньоры" - Пишем игру на ЧИСТОМ JS (⏱ 22:53)
🌐 Верстка сайта#html #css #js (⏱ 11:10:20)

Хорошего дня!
Please open Telegram to view this post
VIEW IN TELEGRAM
👍12🔥8❤7
This media is not supported in your browser
VIEW IN TELEGRAM
Типичная ситуация на созвоне
😁24🎉7❤4
🌐 React: доклады школы разработки интерфейсов

#посмотреть #junior #middle

Два больших практических доклада от Тёмы Сенюкова.

▫️Реакт база (~3 часа)
▫️Реакт продвинутый (~3 часа)
Please open Telegram to view this post
VIEW IN TELEGRAM
👍9🔥6❤4👎1
Яндекс Практикум набирает наставников на курс по Web-разработке для подростков. Готовы выделить 2-3 часа в день для будущего IT-поколения?

Задачи: 
• проводить вебинары, отвечать на вопросы в чатах,
• давать обратную связь по практическим заданиям,
• помогать, поддерживать, объяснять, мотивировать. 

От кандидата ожидают: 
• опыт в веб-разработке от полугода (подойдут фриланс, pet-проекты),
• реализованные проекты на Vue.js (другие фреймворки только в плюс),
• опыт с Node.js, Express.js, MongoDB,
• владение актуальными подходами к вёрстке на HTML и CSS.

Вознаграждение и бонусы: 
• 35 000 рублей в месяц за группу до 50 студентов, 
• бесплатное обучение в Школе наставников, 
• прокачка лидерских и soft skills, нетворкинг. 

Узнать детали и откликнуться на вакансию наставника по WEB-разработке.
❤7👍4🔥4👎1
🖥 8 полезных библиотек React, которые упрощают жизнь разработчику

#почитать #junior #middle

В статье собраны React-библиотеки, позволяющие в разы повысить скорость и эффективность работы frontend-разработчика. Formik, React Popover, React Icons, Recharts и другие.

Читать статью
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥9👎6👍4
🟡Frontend дайджест за неделю c 13 по 19 июля

🔖 Почитать:

▪️ React Content Elements
▪️ Асинхронность в JS: как выполнять долгие сетевые запросы без блокирования основного потока
▪️ Правда ли Astro так быстр, сравнение с Nuxt 3
▪️ Работа с единицами системы СИ на JavaScript
▪️ ES2023 — что нового в JavaScript?
▪️ Архитектура микрофронтенд с feature sliced design
▪️ [React] Разбираем useId( ) хук под микроскопом
▪️ Как настроить Node.js Express сервер для React
▪️ Введение в Astro
▪️ Создаем веб-сайт, будто на дворе 1999 год
▪️ Манипулируй DOM правильно
▪️ React Content Elements
▪️ Оптимизация изображений для пользователей с медленным интернетом с помощью Network Information API
▪️ Зачем нужно внедрение зависимостей в JS

👀 Посмотреть:

🌐 Больше практики! Как стать фронтенд разработчиком. Эффективный план обучения frontend (roadmap) (⏱ 34:11)
🌐 JavaScript - Путь самурая. Ветвление программы, условные конструкции. If else, isNaN. (⏱ 58:21)
🌐 JavaScript - Путь самурая. Prompt, document write, console log. БЕСПЛАТНЫЙ КУРС IT-KAMASUTRA (⏱ 33:37)
🌐 Основы CSS (⏱ 27:30)

Хорошего дня!
Please open Telegram to view this post
VIEW IN TELEGRAM
👍7❤4🔥3👏1
💘 — пойду на премьеру Барби
🙈 — пойду на преьмеру Оппенгеймер

Хороших выходных!
🙈45💘33😁20❤2
🔥 Guide for Juniors IT

#почитать #junior

Полезный гайд для начинающих IT специалистов. Поможет не только в поисках работы, но и в развитии навыков. Здесь вы найдете всю необходимую информацию, ссылки на ресурсы, списки MUST HAVE и многое другое.

Читать
👍9❤7🙈5👎1
🌐 Адаптивная верстка сайта — Подробный урок для начинающих

#посмотреть #junior

В данном видеоуроке сверстаем макет одностраничного сайта, сделаем мобильную версию и создадим меню с помощью JavaScript. Если Вы начинаете осваивать HTML, CSS то этот урок для Вас.

Смотреть на YouTube (~3 часа)
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥9👍5❤4
Знаете основы веб-разработки и хотите углубить свои знания? Присоединяйтесь к бесплатному мини-курсу, где вы получите практические советы и инсайты от опытного программиста, а также создадите 3 классных проекта — сайт, приложение и сервис — и добавите их в портфолио.

Зарегистрируйтесь прямо сейчас и получите гайд по веб-разработке. Он поможет вам узнать больше о профессии, востребованности, зарплатах и карьерных перспективах: https://epic.st/5dl_PP

На мини-курсе вы:
— создадите веб-страницы, используя язык разметки HTML и технологию CSS;
— реализуете серверную часть (backend) веб-приложений на языке PHP;
— поработаете с базой данных MySQL и напишете запросы к ней на языке SQL;
— освоите основы JavaScript, чтобы делать веб-приложения интерактивными;
— научитесь автоматически получать информацию с других сайтов;
— разместите свой сайт в интернете.

Спикер мини-курса — Даниил Пилипенко, основатель и директор центра подбора IT-специалистов SymbioWay. 19 лет работает в сфере Java и веб-разработки, руководит командами разработки в разных проектах. Автор 10 курсов по программированию и карьере программистов.

Все участники получат скидку 10 000 рублей на любой курс Skillbox и персональную карьерную консультацию с тестовым доступом к понравившейся профессии. А ещё — 5 полезных материалов и гайдов по веб-разработке. Всем, кто посмотрит первый урок, откроем годовой доступ к изучению английского языка.

Присоединяйтесь! Вас ждёт много интересного. Подробная программа — по ссылке: https://epic.st/5dl_PP

Реклама. ЧОУ ДПО «Образовательные технологии «Скилбокс (Коробка навыков)», ИНН: 9704088880
👍7🎉3👎1
🌐 Gulp сборка - полная инструкция. HTML, SCSS, JS, webpack, babel, webp, сжатие графики, автопрефиксы

#посмотреть #junior #middle

Обзор task менеджера Gulp и написание сборки. Работа с шаблонами в HTML, SASS / SCSS, авто-префиксы, минификация кода, scss glob. Сборка JS с помощью webpack, babel. Оптимизация изображений, автоматическое создание и подключение webp. Две версии сборки для разработки и оптимизированная production версия. Стартовый проект для html верстки.

Подробно с пошаговыми объяснениями для новичков.

Смотреть на YouTube (~3 часа)
Please open Telegram to view this post
VIEW IN TELEGRAM
👍11❤6👏4👎3
🟡Привет, верстальщики! Свежий frontend-дайджест от канала JS Live 🚩 JavaScript & Frontend-разработка за неделю с 17 по 23 июля!

🔖 Почитать:

▪️ Исследование производительности анимации на основе скрола страницы
▪️ Реализация WebRTC в Node JS. Передача видео с Raspberry PI до Web
▪️ 5 интеграций в React: Контент + Дизайн + Разработка
▪️ Event Propagation: фазы погружения (capturing) и всплытия (bubbling)
▪️ React Content Elements
▪️ Асинхронность в JS: как выполнять долгие сетевые запросы без блокирования основного потока
▪️ Как мемоизация влияет на производительность React-приложения
▪️ Архитектура микрофронтенд с feature sliced design
▪️ Mobx: библиотека глобальных сторов (state manager)
▪️ Компонентный подход в вёрстке: подробный разбор для джунов и сочувствующих
▪️ Вышел Chrome 115
▪️ Манипулируй DOM правильно
▪️ Сравнение тяжеловесности популярных библиотек UI компонент для Vue 3
▪️ Как сделать редизайн сервиса: рассказываем на примере средневекового замка

👀 Посмотреть:

🌐 Todolist React JS - material UI | Практика JS планировщик Todolist (⏱ 1:09:46)
🌐 JavaScript — Ветвление программы, условные конструкции. If else, isNaN. (⏱ 58:21)
🌐 Бесплатный вебинар. Как стать Frontend-разработчиком и построить свою карьеру в IT. 18.07.2023 (⏱ 1:36:46)
🌐 Программирование: технологии уже не торт (⏱ 1:00:38)

Подписывайтесь на JS Live и получайте дайджесты каждую неделю на регулярной основе!

Хорошего дня!
Please open Telegram to view this post
VIEW IN TELEGRAM
👍9🔥5❤4
😁37🔥6🙈6👍1
🌐 Фронтенд собеседование с ChatGPT. AI против кожаных

#посмотреть #middle

ChatGPT пробует пройти собеседование на FE разработчика. Базовые (и не очень) вопросы по JS.

Смотреть на YouTube (~1 час)
Please open Telegram to view this post
VIEW IN TELEGRAM
👍8👏5😁4👎2
Frontend дайджест за неделю c 24 по 30 июля

🔖 Почитать:


▪️ React + Styled Components — идеальная анимация. Параметризованная анимация
▪️ TypeScript 5.2: Новое ключевое слово: 'using'
▪️ Web API для Angular
▪️ Под капотом анимаций в React Native. Часть 1/2: Animated and Bridge
▪️ Считаем 2+2×2
▪️ Все что необходимо знать про key в React и даже больше
▪️ Ускорить таблицу на React в 1 000 раз, изменив лишь одну строку
▪️ 5 интеграций в React: Контент + Дизайн + Разработка
▪️ Event Propagation: фазы погружения (capturing) и всплытия (bubbling)
▪️ Как мемоизация влияет на производительность React-приложения
▪️ Компонентный подход в вёрстке: подробный разбор для джунов и сочувствующих
▪️ Манипулируй DOM правильно

👀 Посмотреть:

📹 Уроки JavaScript для начинающих / Преобразование объектов в примитивы практика (⏱ 25:05)
📹 [10] - Путь Самурая. Математика для программиста, часть 1 (⏱ 34:06)
📹 Пишем Рейтинг или ТОП систему на JavaScript, PHP, MySql | Практика программирования (⏱ 47:07)
📹 Проблемы с тегами, новая версия Node.js и обновление @font-face (⏱ 1:06:35)
📹 Обработка событий в JS. Интенсив «Сайт аниме на JS» — день 1 (⏱ 1:21:15)

Хорошего дня!
Please open Telegram to view this post
VIEW IN TELEGRAM
❤8👍5🔥4
🌐 JavaScript: тестовое собеседование — JS, Next.js, Nest.js, React.js, Node.js, SQL

#посмотреть #junior #middle

План собеседования: интро — node.js — nest.js — sql — next.js — react.js — js

Смотреть на YouTube (~1 час 15 минут)
Please open Telegram to view this post
VIEW IN TELEGRAM
👍7❤4🔥4🤔1
🧠 Как улучшить память IT-специалисту

После прочтения этой статьи вы не начнете по щелчку пальцев покорять новые вершины знаний без усилий и напряжения, однако, пробуя методику за методикой, начнете увеличивать свою эффективность раз за разом, делая ее всё выше и выше.

Читать статью
❤13👍7👏5