kopchikovich's blog
212 subscribers
25 photos
118 links
Запускаю IT продукты и учусь их монетизировать
Обратная связь @kopchikovich
Download Telegram
Кстати в выпуске Ночного фронтенда про конференцию HolyJS 2018 Piter узнал об очень интересном докладе Ильи Климова "30: Слишком много JavaScript" об эффективном обучении.

Доклад поможет расставить приоритеты: что нужно учить, а что "выучиться само". Очень актуально для нас, рекомендую к просмотру.
Рекомендую к прочтению статью на medium для тех, кто считает что после 30 лет нет смысла "лезть в IT".

Реальная история человека о проблемах с которыми столкнулся, решениями и практическими советами.

Статья на английском языке.
Короткий курс по английскому от лофтблога JavaScript по-английски.

Понравилось запоминание слов с помощью гугл картинок из первого урока, да и в целом интересно и полезно.

Главное не просто смотреть, а действительно пробовать полученные знания.
Подробный список того, что нужно знать веб-разработчику know-it-all.io.

В нём можно отмечать, что уже знаешь или знаешь, но недостаточно хорошо.

Неплохой способ отсортировать полученные навыки и увидеть что ещё предстоит изучить.
Завершил второй курс на freeCodeCamp под названием JavaScript Algorithms and Data Structures и получил сертификат.

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

Хотя сам грешен и решение одного задания подсмотрел 😊 но там всё упёрлось в математику, а не в js. Хотя это тоже так себе оправдание.
Статья на английском из 3х частей на css tricks о том как пользоваться css grid в ie.

После ознакомления со статьей, сделал для себя вывод пока не использовать гриды в ие🙂 продолжаю набивать руку на flexbox.
На проекте JavaScript.Ninja выложили матрицу компетенций Fullstack JS разработчика.

В ней можно оценить свой уровень в различных вещах: от около фронтендовых технологиях до софтскилов.

А главное посмотреть что представляет из себя уровень "гуру" и что нужно понимать, чтобы его достичь. А наша цель - его достичь.
С 16 июля 2018 года открыт новый набор в Школу разработки интерфейсов Яндекса! В этот раз она пройдёт в трёх городах: Москве, Санкт-Петербурге и Симферополе.

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

Сам бы с удовольствием поехал поучиться в Симферополь, но есть обстоятельства, которые удерживают на текущем месте проживания.
Наткнулся на отличную подборку книг на гугл диске по веб-разработке на русском языке.

Обязательно загляните - столько хороших книг в одном месте не часто увидишь.
Зачем я создал этот канал?

Мне 26. Меня не устраивает моё текущее место работы и проживания, я бы хотел поменять свой род деятельности. На самом деле таких как я очень много. Но моя главная цель не быть тем, кто хочет что-то поменять у себя в жизни, а тем кто изменил и не пожалел.

IT-сферу я выбрал, т.к. всегда интересовался компьютерами, несколько раз безуспешно пытался освоить язык Delphi, в школьные годы ходил на курсы фотошоп и HTML, даже сохранились сертификаты. Но всегда что-то останавливало и не давало погрузится в технологии с головой.

Сейчас пришло осознание того, что если ничего не сделать, то я уже так и останусь инженером на работе, которая мне не нравится, хоть с и неплохой зарплатой.

В силу определенных жизненных обстоятельств на текущем месте работы я задержусь ещё на 3,5 года.
Кажется, это неплохой срок, чтобы научиться программировать. Всё-таки это марафон, а не спринт.

Главное не забывать:
«Дисциплина и постоянство усилий на длительном промежутке времени создаёт результат» Ярослав Брин

Канал отражает мой путь к программированию, а также в нём я скрупулёзно собираю материалы которые помогают мне и, надеюсь, помогут Вам.
За прошедшую неделю изучил основные моменты Git, создал первый репозиторий на GitHub, покомитил.
Ещё сильнее влюбился в VS Code, с Git можно работать не выходя из редактора.

Ссылки для изучения Git:
- Скринкаст по Git от learn.javascript.ru - всё что вы хотели и не хотели знать про Git здесь
- Подробная шпаргалка
- Интерактивный курс по Git - набиваем руку
Когда в голове появляется очередная идея для сайта/приложения и хочется быстренько накидать интерфейс, вам может помочь минималистичное веб-приложение Wireframe.

Оно поможет вам сделать простенький макет, если вы не веб-дизайнер и не пользуетесь чем-то более глобальным.

Периодически им пользуюсь, когда хочется сверстать что-то своё, но сейчас в основном ищу готовые макеты psd и набиваю руку верстая их.

Найти макеты можно, например, на этих сайтах:
- psdrepo.com
- psd-html-css.ru
На этой неделе попробовал сверстать макет по технике pixel perfect. Получилось так себе, есть куда развиваться, буду верстать дальше.

Почитать про pixel perfect и инструменты для него можно на zencoder.ru. Я использовал расширение для Chrome.

Ещё недавно открыл для себя "HTML Шорты" от HTML Academy. Это серия коротких видео, которые помогут разобраться во многих вопросах по вёрстке.
Всем привет. Продолжаю прокачиваться в вёрстке. Сейчас смотрю записи с интенсивов HTML Academy (т.к. курсы у них платные, ссылок кидать не буду, легко находится в гугле) - отлично и доступно рассказывают, кто только присоединился - начните изучение вёрстки с них.

Попробовал использовать Browser Sync. Он нужен для синхронного тестирования в разных браузерах; может по аналогии с Live Reload обновлять страницу при изменении выбранных файлов; запускает мини-сервер с сайтом, который можно открыть на любом устройстве в одной сети (например для тестирования сайта на мобильном устройстве).
Крайне полезный инструмент, лучше освоить его как можно раньше, в будущем поможет сэкономить много времени. Посмотрите урок от лофтблога в ссылках для лучшего понимания зачем нужен browser sync и как его использовать.

Ссылки:
- сам browser sync
- урок по browser sync на youtube от LoftBlog
Нашел для вас интересный авторский канал на котором разбираются частые вопросы с тех. собеседований на позицию фронтенд разработчика:
frontends don't lie


Доступно, понятно, со ссылками на материал для изучения - всё как мы любим 😊

Канал будет интересен всем, т.к. на нём раскрывают много тонкостей фронтенда, которые пригодятся не только на собеседованиях.
Если потеряли мотивацию, столкнулись со сложностями, хочется всё бросить - остановитесь и послушайте подкаст от Marlin'a «Вот почему начинающим программистам нелегко учиться!»

Запись поможет поменять отношение к программированию, а следовательно и к обучению. Ведь действительно мы учимся быть программистами не только для того чтобы пройти собеседование и устроиться на работу. Мы учимся и программируем, потому что нам нравится это делать. Нам нравится что-то создавать своими руками и когда это что-то работает и делает полезные и крутые штуки. Разве не так?
За прошедшие 2 недели мало практиковался, но всё-таки начал писать классы по БЭМ и использовать препроцессор Less.

Препроцессоры, кажется, нужно использовать только если вам нужен какой-то их функционал, которого нет в css, но изучить их определенно стоит. Самые популярные препроцессоры Less и Sass очень похожи и если вы знаете один, считайте что знаете другой.

А вот БЭМ-методологию действительно лучше использовать, по началу будет немного непонятно (я сейчас на этом этапе), но далее это поможет не тратить много времени на создание структуры страницы.

Ссылки:
- HTML Шорты про БЭМ - коротко о главном;
- Основные понятия на сайте bem.info, там вся остальная информация про БЭМ, но не советую сильно углубляться, главное понять что такое блок, элемент блока, модификатор и как это всё называть;
- БЭМ-методология: с чего всё начиналось и зачем это всё нужно статья про создание БЭМ от Яндекса;
- материала по изучению и Less и Sass очень много, что-то особенно выделять не хочется - смотрите и читайте на любимых ресурсах, но начать можно, например с бесплатного курса от HTML Academy Знакомство с LESS;
- Less Tester, Sass Meister - две песочницы по Less и Sass соответственно, в которых можно попробовать функционал препроцессоров и сразу увидеть что будет в css.
Наконец-то нашёл время и разобрался как работает Gulp, а также настроил его под себя. Теперь вёрстка стала гораздо более приятным процессом.

Сейчас я просто пишу в консоли "gulp dev" (название выбрал сам, вы сможете написать другое) и у меня запускается сервер browser sync (о нём писал ранее), а препроцессорный код при сохранении файла на лету компилируется в css. Все изменения сразу видно в браузере. Сказка.

Для настройки Gulp вам может понадобиться много времени (у меня ушло часа 4, ещё настроил сборку проекта на будущее), но я рекомендую найти это время, спокойно сесть с чашкой чая и потихоньку шаг за шагом написать свою сборку.

В этом вам поможет статья (а внутри есть ещё видео урок) от WebDesign Master. Там всё очень подробно, с примерами кода. Рекомендую для начала разобраться с browser sync чтобы оценить всю магию автоматизации
Познакомился с canvas, говорят скоро без него никуда.
Canvas предназначен для создания графики с помощью JavaScript. Например, его используют для рисования графиков, создания фото композиций, анимаций и даже обработки и рендеринга видео в реальном времени.

Изучать canvas предлагаю сразу на практике: открывайте справочник MDN и пробуйте в каком-нибудь codepen все возможности, которые там описаны. Canvas переводится как холст, то что вы на нём нарисуете ограничено лишь вашей фантазией :)

На MDN не все статьи переведены на русский, так что если у вас есть возможность и способность к переводу, то вы можете помочь сообществу переводя статьи справочника на русский язык.