• Для танкиста: зачем сборщики проектов (gulp/webpack)?

    @McHack
    Представьте такую ситуацию. У вас огромный проект с множеством составляющих, над ним работает 4-6 человек и у каждого собственные js и css к примеру, плюс ко всему вы работает с GIT-ом (а сейчас без него никуда). В девелоперской сборке творится корпоративный бардак, куча файлов, куча несжатых картинок и css-файлы на 8К+ строк.

    Собственно, тут нам и понадобится сборщик, который соединит воедино все .css, .scss, .styl в один единый минифицированный css-файл. Тоже самое сделает и со скриптами, пожмет картинки и положит их в положенную папку. Вы на выходе имеете довольно оптимизированный и хорошо потерявший в весе проект. Отсюда вы грузите нужное вам на нужную ветку вашего Git-а и отправляется оттуда на сервер. В итоге на сервере вы имеете готовый продукт, без бардака и конечный пользователь не получает ничего лишнего.

    Это самый базовый пример и более глобальная цель сборщиков и им подобного. Если же отходить от банальщины, то разработчику просто намного удобнее и приятнее работать. Если же вы не понимаете зачем это все нужно, значит вы просто еще не "доросли" до этого. Рано или поздно и вы придете в эту тему, тогда то и раскроете рот от всех возможностей, которые имеются в том же WebPack :D
    Ответ написан
    Комментировать
  • Как выводить заглушку на сайте при отсутствии интернет соединения?

    Vlad_IT
    @Vlad_IT
    Front-end разработчик
    Ребята, это не пинг и не NavigatorOnLine, так делать нельзя, ибо пользователь может читать статью, а вы ему при потере интернета все обломаете. Такая плашка работает на сайтах, чей контент грузится по ajax, без перезагрузки страницы. Плашка должна показываться при неудачном ajax запросе получения страницы, и в идеальном случае, предлагать посмотреть оффлайн страницы (предварительно загруженные в хранилище). Если же сайт не ajax, можно при помощи того же NavigatorOnLine делать проверку, что если сайт в оффлайне, превентить переходы по ссылкам, и показывать эту плашку только в случае клика на ссылку.
    Ответ написан
    Комментировать
  • Есть ли сайт, где собраны общепринятые практики программирования?

    @akimdi
    Вы спрашиваете
    где собраны общепринятые практики ?

    Нечто подобное собрано в топиках на гитхабе
    например есть так называемые Awesome Lists, где кто то собирает лучшие практики, кто-то собирает курсы, а кто-то шаблоны проектирования и т.п. и т.п. Их там много можно найти на любой вкус.
    Ответ написан
    1 комментарий
  • Есть ли сайт, где собраны общепринятые практики программирования?

    Moskus
    @Moskus
    Естественно, нет, потому что всё, что вы описали - это не какое-то тайное знание, которое можно только запомнить, а логичные приёмы, которые следуют из знания фундаментальных принципов и анализа требований к продукту. Если попытаться заменить фундаментальные знания таким сборником прецедентов, он получится гигантским и совершенно непригодным для освоения - столько всего просто нельзя запомнить. Объем фундаментальных знаний - на порядки меньше объёма частностей, которые из них выводятся, но сложность этих знаний, при этом, выше. Кто фундаментальные знания не осилил, остаётся говнокодером, пока не осилит.
    Ответ написан
    Комментировать
  • Возможен ли план самообучения WEB разработке?

    dimovich85
    @dimovich85 Куратор тега CSS
    https://u-academy.net/
    Советов надавали, я накидаю ссылок:
    Веб-стандарты Этот канал интересен уже тогда, как основа заложена. Много полезных и интересных докладов.

    Дмитрий Лаврик Много бесплатных материалов, классные платные курсы, для новичков и для среднего уровня.

    HTML Academy Много хороших материалов для изучения

    Илья Кантор Много материала по JS

    Master-CSS Здесь я нашел много бесплатных видео по настройке разных плагинов, в общем, для старта отлично, но когда поймешь JS, то сам сможешь разбираться.

    Шпаргалка по jQ В голове такие вещи обычно не держу, что-то, что часто использую помню наизусть, а так - всегда подсматриваю.

    Learn JavaScript RUS Классный учебник по JS.

    CodePen и JSFiddle В процессе обучения важно на практике применять полученные знания. Каждый раз собирать файлы, шаблоны, подключать либы, настраивать сборщики и тд лениво, очень классно, что можно в браузере сразу все сделать и даже сохранить, расшарить.

    Webmassa SVG Видео по работе с SVG.

    Юра Артюх Классные стримы по созданию анимаций. WebGL, SVG, Canvas, CSS - все тут.

    StackOverflow Авторитетный ресурс по поиску решений.

    Документация MDN Документация от разработчиков Mozilla. Есть на русском. Вообще, надо научится читать и понимать документацию, так как знать все на все случаи жизни нереально, профи умеют искать и читать документации. Для этого надо бы подтянуть английский.

    W3C Specs, W3School - инфа из первых рук.

    Писал ссылки по мере попадания под руку)

    Успехов!
    Ответ написан
    Комментировать
  • Возможен ли план самообучения WEB разработке?

    @programrails
    А я думаю, что настоящее развитие может быть только по плану. Однако, ваша самая главная задача сейчас - это хорошо учиться в школе. Выучите веб, но ценой завала школы - глупость неимоверная, преступная. Не надо так спешить, детство даётся один раз в жизни. Не вебом единым жив человек. Не следует думать в отношении некоторых школьных предметов, что "это мне не понадобится". Понадобится всё. Начать с веб можно и с 18 лет - вполне достаточно. Если уж так неймётся - то забросьте пока до 18 лет к чёрту всю эту веб-разработку и основной упор сделайте на изучение английского языка. Станьте асом в английском языке и тогда ваши (российские) конкуренты (со временем) останутся далеко позади - потому что подавляющее большинство российских разработчиков позорно плохо (до смешного плохо) знают английский. Хороший английский - это секретный ключ к успеху в программировании. Не имея навыка смотреть американский фильм с оригинальной дорожкой и понимать (на слух) хотя бы половину - хорошим программистом не стать. Во-первых, бОльшая часть веб-документации - только на английском. Во-вторых - никогда не читайте англоязычную документацию в русском переводе (книги, статьи) - ничего не поймёте правильно - только в оригинале. Потому что перевести такое невозможно - можно только заново написать на другом языке. В-третьих - будете в Турции/Египте летом - сможете больше пообщаться при необходимости.

    Изучение английского - это очень временеёмкая задача. Именно в юном возрасте и следует этим заниматься. Потом, после 18, жизнь уже не даст такого шанса, и будете потом постоянно себе говорить - какой же я был дурак, что не изучал его ранее. Можно даже прямо сейчас найти какие-то курсы английского - для детей-подростков это по карману, для взрослых же будут драть втридрога. Не пожалейте никаких усилий ради английского.

    Когда вам исполнится 17-18 - вообще забудьте про веб и все силы бросьте на поступление в ВУЗ. И лишь после поступления можно начинать с вебом. Да, и забудьте про компьютерные игры. Прямо начиная с сегодня. Совсем. Навсегда.

    Все предыдущие советы даны без учета возраста задающего вопрос. Эти ответы рассчитаны на человека от 18 лет возрастом. Мой же ответ - именно для 14-летнего.
    Ответ написан
    26 комментариев
  • Пример хорошего ТЗ/гайдлайна для вёрстки?

    dpmango
    @dpmango
    Лучше ТЗ верстальщику - макет. Все таки в этой профессии должна быть доля креативности и нужно удивлять клиента своими решениями. Если это не профессиональная студия из ТОП50 рейтингов, где описаны действительно необычные решения, обычно все ТЗ сводиться к пунктам вида "спасибо, кэп". Например - клик на иконкe гамбургера должен открывать мобильное меню, стрелки вперед/назад слайдера должны сменять слайды и т.д.

    По критериям - у каждого свои понимания о том что есть хорошо и плохо.

    Я руководствуюсь такими стандартами
    https://docs.google.com/document/d/1bZyzlhBvR1luYW...
    Ответ написан
    Комментировать
  • Составили требований для верстальщика, не перегнули ли палку?

    xmoonlight
    @xmoonlight
    https://sitecoder.blogspot.com
    Советую так составить документацию:
    1. Создайте "чистый" пустой("белый лист") шаблон-заготовку (без сторонних библиотек и с возможностью скачать его в архиве) и кратко опишите структуру шаблона (включая разметку сетки и её поведение по-умолчанию при различных разрешениях).
    2. Опишите формат секции(-й) для подключения сторонних библиотек и их самих: для чего они нужны и в каких случаях их необходимо применять. (можно добавить подключение всех и закоментировать в "чистом" шаблоне-заготовке и выложить в доп.архиве)
    3. Создайте каталог всех элементов шаблона: слева - сам объект, справа - исходный код.
    4. Отдельно опишите основные, наиболее часто используемые стили и их доп.модификаторы.
    Ответ написан
    Комментировать
  • И снова курсы веб разработки?

    iCoderXXI
    @iCoderXXI
    React.JS/FrontEnd engineer
    В конце 2015 года я задумался о том, чтобы свалить со стека php+jquery на что-то более адекватное современным реалиям. Т.к. года с 2011 ajax/spa неумолимо все больше доминирует над старомодным рендерингом средствами php, мой выбор пал на клиентсайд с JS.

    До того времени (начало 2016 года) я к JS относился весьма скептически, т.к. еще свежи были впечатления от нездоровых приключений с js3 vs ie6 и иже. Тем не менее проштудировав материалы JavaScript Weird Parts и ролики Зоракса я, внезапно, понял, простил и полюбил JS.

    По мере же погружения в прелести ES6+ я стал фанатом JS.

    Моё стремление в сторону JS крепчало.

    Из фреймворков я сначала позарился на Ember.JS, но что-то путное на нем слепить с наскоку оказалось задачей непосильной, хотя он, безусловно, крут.

    Angular v1 мне сразу не понравился чисто интуитивно, как оказалось, это решение было верным.

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

    Параллельно, впервые за 20 лет практики, я внезапно стал дистанционно "ходить" по собесам, и .... круто обламываться. Особо больно было в первые 2-3 раза. Сказались дурные привычки юности - стремление изучать только то, что конкретно приносит пользу здесь и сейчас, игнорируя "тупую", "бесполезную" теорию. Сыпался на таких мелочах, что стыдно вспомнить...

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

    В общем я осознал, что дальше так продолжаться не может и нужно кардинально сменить парадигму и стратегию. Записал себя в джуны и стал прилежно учить все подряд, что касается тематики фронтенда и JS в частности. Этот финт ушами почти даже не жахнул по моему самолюбию и самооценке, т.к. багаж прошлых заслуг все равно рулит и весьма существенно помогает. Какие бы новые языки не изобрели, какие бы новые навороченные фреймворки не нарожали - базовые принципы всё те же, а когда ими владеешь, то все остальное - дело времени и усилий.

    Так вот, чтобы переформатировать мозги с пыхи на JS мне нужно было попрактиковаться несколько сотен часов. Я весьма ленив, поэтому сам себе задачки придумывать бросил сразу после школы и школьных олимпиад - наигрался. Тем не менее без практики никуда, поэтому я пошел на кодварс (пруф: https://www.codewars.com/users/iCoderXXI) и стал решать там всё подряд. Поначалу код был ужасен, но работал, постепенно мозг привык и качество кода стало расти. Параллельно стало сложно писать на пыхе, ибо кода получается существенно больше при аналогичном выхлопе. Подобный инцидент у меня случился году в 2006, когда я с клиппера мигрировал на пыху, потом было сложно писать на клиппере, ибо он убог. Пока я не знал пыхи, клиппер мне казался весьма недурным языком. :)

    В общем материалов и приёмов пришлось освоить массу, на все про все у меня ушло более 1.5 лет в режиме 2-4+ часа ежедневных занятий. За это время я умудрился завалить порядка 10 собесов, пока, наконец, не выстрелило.

    Тем не менее мне еще очень многому предстоит научиться, т.к., по сути, мой потенциал - это матёрый сеньёр/архитектор, а реально я пока мидл по части фронтенда. :) Рассчитываю за следующие пару лет устранить этот досадный разрыв.

    Это я все к тому написал, что переучиться можно в любом возрасте (мне 36), было бы желание и упорство.

    В общем я настоятельно рекомендую упор делать в JS/HTML5+/CSS3+ и React/Vue (хотя тут по вкусу, но на эти два "фреймворка" приходится существенная доля вакансий и заказов).

    ВАЖНО! Если раньше не доводилось программировать, то в обязательном порядке параллельно с JS нужно освоить базовые знания/навыки в алгоритмах и структурах данных, а, так же, базовый уровень в информационных технологиях, иначе многое будет просто непонятно, будешь буксовать часами и днями на всяких глупостях.

    P.S.: На htmlacademy курс мне нравится (я там подрабатываю наставником). Однако мне очень хочется, чтобы курсанты приходили несколько более подготовленные по части алгоритмов и структур данных.
    Ответ написан
    2 комментария
  • ТЗ + документы, ответственность, как не пролететь?

    Kewa2008
    @Kewa2008
    Программист
    1) По факту занимаюсь embedded программированием на с++ и си, а вместо оформления программистом оформили инженером. Это нормальная практика для гос контор? И часто такое встречается?

    То, что ты не программиста, а инженер - нормальная практика. Точнее это конечно не нормально, но для гос структур - обычное дело. Я сам долгое время был "лаборантом", "инженером", "заведующим лабораторией" (это тип так повышали меня =) ). Пока не пошел в коммерческую структуру и не понял как оно должно быть на самом деле.

    2) В штате нет администраторов, devops-ов и как результат сборка виртуальных машин для компиляции ложиться на плечи программистов.

    Тоже нормальная практика. Из личного опыта (можешь поправить если у тебя не так) могу сказать что это делается не из-за экономии средств, а из-за элементарной безграмотности многих "руководителей".

    3) Тз нет в принципе, их никому не выдавали НИКОГДА. Все формулируется устно, при этом правки в "устное тз" могут вносится по настроению начальника в любое время и на любой стадии проекта.

    Тоже знакомая ситуация =) Опять же это не нормально, но для госСлужбы - привычное дело.

    4) В конторе нет документации, вообще нет.

    С таким я конечно не сталкивался, хоть что-то но было. Но обычно это "что-то" делалось силами самими программистами, чтобы облегчить себе жизнь. Поэтому я не сильно удивлюсь, если документация будет отсутствовать=)

    5) Нет дизайнеров, разработка ui и рисование картинок лежит на плечах программистов. Графики в приложении много.


    Ты спроси у руководителей, знают ли они о существовании людей с такой должностью? =) Скорее всего нет. Для них программист - как шампунь (все в одном =) ): и тестировщик, и аналитик, и дизайнер, и сисАдмин, и кодер. А при необходимости он (программист) еще может вытащить застрявшую бумагу из принтера, установить драйвера для него, заправить картридж тонером. И я это все говорю из ЛИЧНОГО опыта.

    6) Устанавливают сжатые сроки на проекты.


    Такого у меня не было. Обычно когда дают задачу, через пару дней про нее забывают
    или откладывают, потому что появилась более срочная задача. Ну и 3-4 месяца - это конечно не "сжатые" сроки. Это прям лафа =) В коммерческих организациях все должно быть сделано "вчера, ну или на крайний случай сегодня вечером".

    7) Сроки устанавливаются сверху и спускаются на отдел. Меня даже не спрашивают смогу ли я это сделать за такой срок или нет.


    Опять же это делается из-за уровня профессионализма "начальства". С этим ничего не поделаешь, если собираешься там продолжать работать - смирись

    8) В связи с пунктами 2-7 вопрос какая на мне будет ответственность если что-то пойдет не так? К примеру программа упадет в продакшене и клиент подаст в суд, какая на меня ляжет ответственность?


    Ну приготовься к тому, что пока ты джуниор ты во всем виноват и везде крайний. А твой начальник будет говорить "я же тебе говорил!", "А я тебя предупреждал!" и т.п.
    Если будет все очень плохо и дело пойдет в суд, то при самом плохом раскладе тебя уволят. Ничего сверх тебе сделать не смогут. Ну уволят по нехорошей статье (но это КРАЙНЕ маловероятно. Если тебя конечно увольнять будет не Путин =) ). В этом случае (как и сказал Сергей Горностаев) выкидываешь ее подальше и устраиваешься заново. Но, повторюсь, это крайне маловероятно.

    9) Свалить возможности нет, по условиям контракта придется выплатить неустойку, если сам уйду или если уволят, работать осталось около года.Подскажите как себя вести в юридическом плане. Какие документы желательно не подписывать в такой ситуации?


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

    10) Как вести себя в профессиональном плане, какие плюсы можно извлечь из ситуации?

    Плюсы в госСлужбе на должности джуниора... дай подумать... Боюсь что никаких =) Хотя есть вариант (но тут в зависимости от твоего возраста, семейного положения и т.п.), можно найти руководителя женского пола и жениться (ну или на дочке жениться). Тогда карьерный рост тебе обеспечен =)

    Я сам долгое время работал в госСлужбе, потом работал по совместительству (и в коммерческой и в гос). Потом совсем ушел от госУчреждений. Боюсь что в профессиональном плане программисту многого там не получится добиться. Но может я и ошибаюсь.
    Ответ написан
    Комментировать
  • Адаптивные и отзывчивые сетки — как их создавать?

    snap44
    @snap44
    Фыр!
    какие используются брекпоинты чаще всего

    320/480/600/768/1024/1200
    И как в итоге получают размеры в rem при вычислениях?

    Умножают базовый размер в пикселях на rem.
    body {fontsize: 16px;}
    h1 {font-size: 1.5 rem} = 16*1.5 = 24px
    Как правильно строить такие сетки

    Так же, как и фиксированные, только в отоснительных единицах измерения + media
    Ответ написан
    1 комментарий
  • На каких сайтах можно посмотреть идеи дизайна веб элементов (кнопок, полей ввода, списков и т.д.)?

    nikitanaz
    @nikitanaz
    UX Lead and DesignOps @EPAM
    Эх, жаль пару порталов кануло в небытие…
    Вот парочка что есть)

    houseofbuttons.tumblr.com
    www.uiparade.com
    ui-cloud.com
    Ответ написан
    Комментировать
  • Как научиться учить программирование?

    Virel
    @Virel
    цифровой художник
    Вы не знаете с чего начать учить, опускаются руки, вы понимаете, что не знаете чего-то глубинного) Тоже самое сейчас у меня... Не реклама, но я забила на свои проекты пока и пошла учится программировать с нуля на хекслет. Нужно полностью освоить какую-то одну профессию до уровня свободного владения. Вам правильно сказали - расставьте цели. Спроектируйте ваш путь к знаниям. А проекты на потом. Хотя я вас понимаю - хочется. Но что поделать, если вам не под силу? Поставьте самообразование на первое место и чётко составьте график ваш.
    п.с.: и не слушайте тех, кто твердит, что это не ваше и вы не сможете. Сможете! Просто дисциплинировать себя надо.
    Ответ написан
    1 комментарий
  • Какой код начать писать на JS?

    @cluberr
    Советую прочитать вот эту книгу :
    1011395255.jpg
    там классно изложены все темы и идет последовательное построение Игры Морской Бой от простого к сложному
    постепенно изучаешь новые фишки и внедряешь их с пониманием того, для чего это нужно.

    Вот этот сайт очень мощный в плане прокачки практики: https://ru.hexlet.io/professions/frontend

    А еще очень советую решить весь список: ЗАДАЧИ ПО JAVASCRIPT ИЗ КНИГИ "ВЫРАЗИТЕЛЬНЫЙ JAVA...

    плюс сайт www.codewars.com - это отличный сайт на котором собрано огромное количество задач для оттачивания навыков программирования его используют для подготовки к собеседованиям в ведущие компании.

    ну и https://www.freecodecamp.org/
    Ответ написан