DНЕВНИК web-программиста
2.57K subscribers
214 photos
14 files
560 links
Авторский канал о том, как стать программистом, когда вы даже не знаете, что это.
Много интересного и для других сфер - планирование, самоконтроль, различные лайфхаки и т.д.
Задачи @tasks_frontend
Обратная связь @WpdFeedbackBot
Сотрудничество @rezvanini
加入频道
Навигатор по каналу.

Приветствую всех, кто читает этот канал. Решил для Вашего удобства создать небольшой путеводитель по каналу. Периодически буду добавлять информацию в данное сообщение.
О канале
План обучения на 2019г
Инструкция, как я учусь
Изучение HTML
Изучение CSS (Анализ после прохождения тут👈)
Изучение JavaScript:
- этап 3.1. (Анализ тут и финальный тут👈)
- этап 3.2. - DOM
- этап 3.3. - практика
Изучение React
- этап 4.1 - теория+практика
- этап 4.1.1. - промежуточный этап
Собеседование
- результаты
Мой дипломный проект

Полезные материалы из канала:
Сборник задач
Учим английский
Чат канала
PSD Шаблоны

Так же вы можете найти интересующую информацию по следующим хештегам:
#html, #css, #js
#собеседование - тут все понятно
#диплом - подробно о моей практике
#план - планирование и самоконтроль
#lifehack #лайфхак, #soft, #book
#задача - тесты, задачи
#ts #react #vue #angular #node #linux #юмор - 😅
Сборник ресурсов с практическими материалами:

🇷🇺Практика на руском:🇷🇺
1. Задачи от Трепачева Дмитрия На сайте 4 раздела: задачник HTML+CSS, задачник PHP+SQL, задачник JavaScript.Так же есть платный раздел.
2. Задачи от Алекса Лущенко Небольшой сборник задач от автора YouTube канала, который я рекомендовал еще в плане обучения К задачам он снимает видео с подробным разбором!
Первые 2 ссылки это лучшее, что нашел на русском.
3.
checkio Проект сфокусирован на Python и JavaScript. Этот сборник игровых задач для тех, кто уже не новичок. Упор на геймификацию, симпатичную графику и общение в сообществе.
ps В настройках есть русский язык.
4. itproger Тесты и практика. Почти все платное.
5. learn.javascript - после каждой темы обучения есть несколько задач.

🇬🇧 Практика на английском:🇬🇧
1. w3resource куча задач с решениями, разбиты по категориям, можно через переводчик.
2. codewars Считается одной из крутейших платформ с задачами на различные уровни сложности на многих языках программирования. К своему стыду, я не смог выполнить даже 1 задачу на JS, тк не понял, что они имели в виду 😂
3. hexlet Свежий проект от сообщества hexlet. Этим все сказано.
4. hackerrank Довольно известный американский проект с кучей соревнований, челенджей и прочих сервисов. На данном ресурсе вы найдете задачи на большинстве популярных языков: C++/#, Java, PHP, Python, JavaScript, Kotlin и т.д.
5. leetcode Сборник задач по различным языкам. Есть платные материалы

На английском можно этот список очень долго продолжать, я указал лишь некоторые.
#js #css #html
Всем привет🖖

Вчера вышла просто супер статья, о 10 сервисах для прототипирования структуры веб-сайтов.
Парочку уже себе отобрал - такой любитель планирования, как я, не мог пройти мимо 🤣
Рекомендую 👍

#html
Всем привет! 🖖

Наткнулся на тест по HTML

Если кому нечем заняться - попробуйте, у вас 112 секунд 🤣

#html
​​Всем привет!

Что-то я зациклился последнее время на React и JavaScript, а ведь есть те, кто только начинают этот путь.

Для них эта статья - Как учить html и css👈
Все ссылки в одном месте.

#css #html
​​Полный список способов скрытия html элементов.

Подробнее

#css #html
Помню когда писал chat на чистом JS очень плотно пришлось поработать с HTML data- атрибутами.
Очень нужная и классная штука.

Поэтому публикую перевод -
Полное руководство по HTML-атрибутам data-

👉Подробнее👈

#html
Подробное руководство - "Как вставить адаптивное видео на сайт".

👉Перевод статьи

#html #css #js
Полное руководство по работе с изображениями.

Перевод отличной статьи, рекомендую любому веб-разработчику.

В закладки

#html #css
Недавно обсуждали в чате mobilefirst вёрстку и насколько это актуально. Лично я двумя руками за этот подход, тем более мобильный веб уже не будущее, а настоящее.

Поэтому, поискал что есть свеженькое на этот счёт и нашел:
видео верстки mobile first вот этого проекта в Figma.

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

#html #css
Думаю, самый популярный плагин в редакторе любого программиста, которому требуется верстать - EMMET.
Я сейчас только представил - как же без него не весело. Поэтому, хочу поделиться материалами, которые очень мне помогли:

1. Подробное руководство - EMMET молниеносная верстка

2. Шпаргалка по EMMET

В закладки!

#css #html
На одном из собеседований мне задавали вопросы про оптимизацию загрузки сайта. К сожалению, я слабоват в этой теме, но считаю ее очень важной и собираюсь хорошо разобраться в ней.

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

ЗЫ Кто в курсе, насколько это важная тема - начинайте смотреть с 10минуты. На скорости х1.5 мне было комфортно.

👉Повышаем скорость загрузки сайта

#js #html #css
Простой подход к работе с отзывчивыми изображениями

👉Подробнее

#html
Всем привет!🖖

Немного для новичков (и не только) - перевод статьи, где автор разбирает несколько основных HTML5 API.

#html
А вы знаете в чём разница между узлом и элементом DOM?
Я даже не задумывался об этом)))

#html
Не знаю как вы, а я ни один из них ещё не использовал!

👉HTML атрибуты

#html