DНЕВНИК web-программиста
2.58K subscribers
214 photos
14 files
560 links
Авторский канал о том, как стать программистом, когда вы даже не знаете, что это.
Много интересного и для других сфер - планирование, самоконтроль, различные лайфхаки и т.д.
Задачи @tasks_frontend
Обратная связь @WpdFeedbackBot
Сотрудничество @rezvanini
Download Telegram
Выводы. Оказалось, что HTML совсем несложен, даже для человека, который никогда не занимался программированием. Да, это не язык программирования, но все же многие думают, что это будет сложно для них. У меня ушло 2 недели, кому-то потребуется 1-2 дня (я просто каждый урок пытался прорабатывать своими примерами). Но это проще, чем может показаться!!! 👍 #HTML
Навигатор по каналу.

Приветствую всех, кто читает этот канал. Решил для Вашего удобства создать небольшой путеводитель по каналу. Периодически буду добавлять информацию в данное сообщение.
О канале
План обучения на 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