• Level Up для новичков: gulp и requirejs

    • Tutorial


    Предисловие


    Качество приложения зависит не только от того, какие задачи и с какой скоростью оно решает, но и от таких, казалось бы, второстепенных факторов как «красота кода».

    Под красотой кода я (полагаю, и многие другие) понимаю:

    • Читабельность
    • Простоту изменения и дополнения
    • Возможность другим разобраться, как это работает

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

    Давайте разберёмся с двумя инструментами, которые не смотря на свою простоту повысят презентабельность исходников вашего приложения и наведут порядок в голове.
    Читать дальше →
  • 300 потрясающих бесплатных сервисов

    • Translation


    Автор оригинальной статьи Ali Mese добавил ещё 100 новых бесплатных сервисов. Все 400 потрясающих сервисов доступны здесь. И еще подборку +500 инструментов от 10 марта 2017 г. смотрите здесь.



    A. Бесплатные Веб-Сайты + Логотипы + Хостинг + Выставление Счета

    • HTML5 UP: Адаптивные шаблоны HTML5 и CSS3.
    • Bootswatch: Бесплатные темы для Bootstrap.
    • Templated: Коллекция 845 бесплатных шаблонов CSS и HTML5.
    • Wordpress.org | Wordpress.com: Бесплатное создание веб-сайта.
    • Strikingly.com Domain: Конструктор веб-сайтов.
    • Logaster: Онлайн генератор логотипов и элементов фирменного стиля (new).
    • Withoomph: Мгновенное создание логотипов (англ.).
    • Hipster Logo Generator: Генератор хипстерских логотипов.
    • Squarespace Free Logo: Можно скачать бесплатную версию в маленьком разрешении.
    • Invoice to me: Бесплатный генератор счета.
    • Free Invoice Generator: Альтернативный бесплатный генератор счета.
    • Slimvoice: Невероятно простой счет.

    Читать дальше →
  • «Книжная полка фронтендера» — как гугл, только лучше

      Список книг — «Книжная полка фронтендера

      Привет, читатель!

      В этой публикации я расскажу тебе о «Книжной полке фронтендера».

      Предыстория


      К сожалению, в рунете очень мало по-настоящему качественных ресурсов для изучения фронтенда. Эти ресурсы можно буквально пересчитать по пальцам одной руки — это Frontender Magazine, HTML Academy, «Современный учебник JavaScript». Я благодарю авторов этих ресурсов за их неоценимый вклад в развитие и популяризацию фронтенда в рунете.

      Как бы то ни было, тематические сайты — не единственный доступный источник знаний. Существует достаточно большое количество книг, написанных зарубежными авторами. Многие из этих книг переведены на русский язык.
      Читать дальше →
    • Как сверстать тему для WordPress

      • Tutorial

      Введение


      В предыдущих статьях мы рассмотрели принципы верстки на чистом CSS и с помощью Bootstrap. Сегодняшней статьей мы начинаем рассматривать особенности верстки под популярные CMS. И начнем с WordPress, как самой популярной из них. Будем считать, что WordPress у вас уже установлен и перейдем непосредственно к созданию шаблона, в качестве которого у нас по-прежнему будет выступать Corporate Blue от студии Pcklaboratory. Если вы не знаете как установить WordPress, то инструкцию можно найти здесь. В данном руководстве мы не будем подробно описывать CSS стили и HTML код – это было сделано уже в предыдущих статьях. Вместо этого рассмотрим детально особенности создания темы именно под WordPress.
      Читать дальше →
    • Выразительный JavaScript: Введение

      • Translation


      Перевод книги Marijn Haverbeke "Eloquent JavaScript". Лицензия Creative
      Commons attribution-noncommercial license
      . Код предоставляется под лицензией MIT.


      Содержание



      Читать дальше →
    • Создание клиентского MVC приложения с помощью RequireJS

      Как веб-разработчик, вы, наверное, часто писали код JavaScript в одном файле, и, когда количество кода становится все больше и больше, его трудно поддерживать. Для решения этой проблемы вы можете разделить свой ​​код на несколько файлов, добавить дополнительные теги script и использовать глобальные переменные для доступа к функциям, объявленным в других файлах. Но это загрязняет глобальное пространство имен и для каждого файла дополнительный запрос HTTP снижает пропускную способность, что увеличивает время загрузки страницы.

      Если это знакомо вам, наверное вы осознали необходимость в реорганизации вашего фронтенд кода, особенно если вы создаете крупно-масштабируемое web-приложение с тысячами строк кода JavaScript. Мы должны по-новому организовать всю эту неразбериху, чтобы код стало легче поддерживать. Новый метод заключается в использовании загрузчиков скриптов. В интернете можно найти много реализаций, но мы возьмем один из лучших, под названием RequireJS.

      В этой пошаговой инструкции вы узнаете, как построить простое MVC (Model — View — Controller) приложение с помощью RequireJS. Вам не потребуются какие-либо предварительные знания в загрузке скриптов, основы мы рассмотрим в этой статье.
      Читать дальше →
    • Надзиратель для фрилансера: выбираем систему учета рабочего времени



        Чуть более ста лет назад инженер Фредерик Тейлор встал за спиной фабричных рабочих с секундомером и стал измерять, сколько времени они тратят на рутинные операции. Вскоре стало ясно, что их можно «оптимизировать» — повысить производительность с помощью системы научной организации труда. Именно из нее выросло современное массовое производство. Но могли ли тогдашние рабочие представить, что их правнуки примутся измерять свою производительность не по приказу капиталиста, а по собственной инициативе? Современным работникам умственного труда приходится самостоятельно планировать деятельность, а секундомер Тейлора им заменяют специальные программы для учета рабочего времени — тайм-трекеры.
        Читать дальше →
      • Избегаем распространенных ошибок в HTML5 разметке

        • Translation
        HTML5 Уважаемые хабровчане, представляю вам вольный перевод статьи Avoiding common HTML5 mistakes. Здесь мы рассмотрим частые ошибки в HTML5 разметке с точки зрения семантики, и как их избежать.
        Читать дальше →
      • Webfonts — разбираемся с антиалиасингом под Windows (UPD)

        • Tutorial
        Думаю, что не только я, но и другие пользователи Chrome под Windows, на многих сайтах замечали проблемы c отображением нестандартных шрифтов. Читать текст на таких сайтах можно, но глазам больно. Я бы так все это и продолжал терпеть, но на одном из недавних собственных проектов этот вопрос встал буквально ребром. Решил разобраться во всем досконально.

        Разница в этих двух фрагментах очевидна. Первый сделан со случайно выбранного сайта adaptive-images, а второй с его локальной копии, в css которой была изменена буквально одна строчка.

        (Читавшие первую версию статьи могут сразу перейти к UPD, где приведено работающее альтернативное решение проблемы для Chrome)


        И в чем же там дело?
      • Арсенал веб-дизайнера

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

          Большие и популярные сайты


          Behance - работы лучших дизайнеров со всего мира

          Читать дальше →
        • Изучение Node.js от начала до конца на практике. Часть 1

          Предыстория


          Различной документации по Node.js его модулях огромное количество, всякого рода готовых решений тоже хватает, но начав писать сайт сталкиваешься с проблемой: «А с чего начать?». Хочу вам рассказать свой опыт изучения Node.js на практике. Задача стоит довольно простая и понятная — GPS Трекер с интернет сервисом, отображающим наши передатчики на карте, рисующим маршрут перемещения и т.д., на сколько разгуляется фантазия. Проект не коммерческий и пишется во благо человечества для себя.
          Читать дальше →
        • 27+ ресурсов для онлайн-обучения


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

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

            Читать дальше →
          • 5 полезных методов jQuery API, о которых вы могли не знать

            В статье я расскажу о пяти методах jQuery, которые я нашел для себя полезными и о которых, по моим наблюдениям, мало кто знает.

            Я с jQuery работаю уже около двух лет, но до недавнего времени не использовал эти методы, так как и без них можно обойтись. Но с ними может быть на много легче.
            Читать дальше →
          • JavaScript: от начала до конца

              TL;DR
              Эта обзорная статья. Такое себе "краткое содержание предыдущих серий". Она будет полезна для новичков, или тех, кто не следил за отраслью в последнее время. Для новичков это будет первый шаг во "Вселенную JavaScript", бывалые смогут освежить свои знания.
              

              У JavaScript очень удивительная судьба. Он преодолел путь от самого не понимаемого до самого удивительного языка. У него было тяжелое детство:
              Изначально Автор хотел написать функциональный язык. Но менеджеры хотели получить, «обычный» объектно-ориентированный. И чтобы было легко искать разработчиков для новоиспеченного языка синтаксис решили сделать похожим на Java и даже название сделали похожим.
              Но на этом история не заканчивается. Java, JavaScript это торговые марки Sun (а теперь Oracle). Microsoft не мог воспользоваться именем JavaScript (Netcape и Sun дружили против Microsoft). В результате Microsoft решил сделать реверс инжиниринг JavaScript и назвал его JScript. Сделали реверс инжиниринг, и сделали его настолько хорошо, что даже содрали все баги в реализации. Позже решили сделать стандарт и назвали его ECMAScript.
              Читать дальше →
            • Советы front-end разработчику



              Привет, читатель хабра.

              Наверное, ты сразу спросишь меня: «Да кто ты такой, чтобы давать мне советы?». Итак, немного обо мне.

              Первое мое общение с HTML и CSS было 10 лет назад, еще в школе, когда у меня только появился интернет, и я понял что тоже хочу делать странички, которые сможет увидеть весь мир. С тех пор у меня есть как минимум 5 полных лет опыта разработки сайтов по-взрослому. Сейчас я могу без лишней скромности сказать, что сверстал я уже пару сотен сайтов, большинство из которых, как ни странно, совершенно не совпадают с моими текущими требованиями к верстке.

              Я не хочу рассказывать как надо делать, эта статья результат моего опыта и попытка написать рекомендации тем, кто только начинает, хотя и для матерых верстальщиков (слово режущие слух) здесь могут найтись интересные идеи.
              Если ты заинтересовался прошу под кат…
              Читать дальше →
            • 5 фраз, которых стоит опасаться фрилансеру

              • Translation
              Если вы на пути вольнонаемного больше чем неделю, то, уверен, эти фразы вам встречались. Возможно вам удается сразу выделять их из текста писем и диалогов, а возможно вы еще новичек и хотите выяснить, какие фразы, на которые стоит обратить внимание, встречаются чаще всего. В любом случае эта статья придется по вкусу фрилансерам всего мира.
              Читать дальше →