• Где можно попрактиковаться с svg?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    Идете сюда - tutorials.jenkov.com/svg/index.html
    Наугад изучаете и тут же что-то делаете. В свг очень важно научиться писать все эти координаты "ручками". То есть не ждать какого-то сферического экспорта из иллюстратора от дизайнера, а сидеть и по фану что-то делать. Причем ставку надо делать на path (tutorials.jenkov.com/svg/path-element.html) элемент, потому-что с помощью него в свг можно сделать что угодно и потом это дело анимировать. Вначале освойте базовые формы, потом разберитесь как юзать всякие Q/C/a элементы. Затем попробуйте это дело анимировать без специальных либ (то бишь велосипедирование с помощью rAF). Это безусловно не особо быстрый путь, но зато прокачаетесь огого как.
    Я вначале года начал изучать таким способом. Помню как несколько дней бился головой о стену, пытаясь понять как грамотно юзать arc элемент, в итоге получилась такая простенькая демка - codepen.io/suez/pen/vEgZba
    Потом пошло поехало, 5 дней назад вот эту запилил, где все куда интереснее - codepen.io/suez/pen/epgZjK
    codepen.io/search/pens/?limit=suez&page=1&q=svg - вот вроде как все svg демки, можете по дате отсортировать и идти от начала к концу, изучая внутренности. Там конечно много рандомного говнокода и я комментировал только особенно интересные демки, но все же лучше чем ничего.
    Ответ написан
    Комментировать
  • В каких случаях нужно нанимать дизайнера сайтов?

    vaux
    @vaux
    Курящий лыжник
    Хороший дизайн помогает человеку решить его проблему. На входе мы имеем человека и его проблему. Человек находит сайт компании, которая, как он считает, может его проблему решить. Далее, путем работы с сайтом, человек либо решат свою проблему, либо уходит на другой сайт, где путь от захода на сайт до решения проблемы гораздо короче и понятнее. Так вот, хороший дизайн - это когда процент людей, решивших свои проблемы с помощью данного конкретного сайта, стремится к 100.

    Стоит учитывать, что целевая аудитория всегда разная, как и проблемы, которые нужно решать. Шаблон никогда таких вещей не учитывал и учесть не сможет. Именно по этому профессия дизайнера еще не скоро канет в Лету.

    Что же касается вашего вопроса, то тут всё зависит от того, как вы понимаете работу дизайнера. Если для вас это человек, который умеет рисовать красивые макеты, то, наверное, можно и не нанимать отдельного человека. Только хуже будет, поскольку вы не поймете друг друга. Если же для вас дизайн - это в первую очередь инструмент решения проблем людей, то нанимать дизайнера стоит. Единственное, что это должен быть именно дизайнер, а не просто рисовальщик красивых картинок.
    Ответ написан
    4 комментария
  • Какие существуют варианты заработка на рисованной GIF анимации?

    AntonSolovyov
    @AntonSolovyov
    UI/UX дизайнер.
    Потенциал действительно есть, но на одних gif анимациях далеко не уедешь и не подзаработаешь. Если Вам действительно нравится анимация, то идите в моушн-дизайн, займитесь созданием роликов на заказ или продавайте видео-шаблоны на videohive.net и подобных площадках.

    Сами по себе гифки никто не продаёт, по крайней мере я никогда такого не наблюдал. Их используют в основном чтобы показать некоторые детали, части проекта.
    Ответ написан
    1 комментарий
  • Какие плагины Gulp вы используете для front-end?

    var gulp = require('gulp');
    var browserSync = require('browser-sync').create(); // в 10 раз лучше livereload
    var stylus = require('gulp-stylus');
    var typographic = require('typographic');
    var nib = require('nib');
    var jade = require('gulp-jade');
    var imagemin = require('gulp-imagemin');
    var uglify = require('gulp-uglify');
    var notify = require("gulp-notify");
    var plumber = require('gulp-plumber');
    Ответ написан
    4 комментария
  • Какие плагины Gulp вы используете для front-end?

    Serj-One
    @Serj-One
    i'm sexy and i know it
    Кусок моего галпфайла. Что-то снабдил комментами.
    var connect      = require('browser-sync'); // livereload
    var sass         = require('gulp-sass'); // Кому что, я использую SCSS
    var csscomb      = require('gulp-csscomb'); // Обязательно!
    var cssmin       = require('gulp-cssmin');
    var imageop      = require('gulp-image-optimization'); // Лучшая альтернатива gulp-imagemin
    var concat       = require('gulp-concat');
    var uglify       = require('gulp-uglify');
    var plumber      = require('gulp-plumber'); // Не позволяет плагину умереть молча
    var autoprefixer = require('gulp-autoprefixer');
    var ngrok        = require('ngrok'); // Пробрасываем локальному серверу путь наружу для для заказчика
    var spritesmith  = require('gulp.spritesmith'); // Спрайты
    var notify       = require('gulp-notify'); // Уведомления
    var merge        = require('merge-stream'); // Деление таска на разные потоки

    Конечно, есть много полезного и кроме этого. Но сам верстаю в WebStorm, в котором огромное количество плюшек реализованы куда удобней, чем в галп-плагинах.
    Ответ написан
    8 комментариев
  • Насколько это плохо использовать AngularJS + RequireJS?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Не совсем, requirejs это менеджер модулей, а контейнер зависимостей в angular для более мелких модулей/сервисов. С другой стороны в angular свой менеджер модулей (angular.module) с ленивой инициализацией и прочими прелестями.

    Лично я не вижу никакого профита от использования requirejs + angular (пробовал, не понравилось), как минимум из-за очень жирного синтаксиса require.js. Так как angular не умеет асинхронно подгружать свои модули (приложение должно быть загружено целиком что бы запуститься) профит от AMD еще более сомнителен. browserify и commonjs еще можно попробовать, но опять же с появлением es2015 смысла в этом мало.

    В angular2 скажем они отказались от своей системы модулей и полностью перешли на модули из es2015. Я же использую их и в angular1.x проектах к примеру и получаю море удовольствия.
    Ответ написан
  • Какими бесплатными стоками вы пользуетесь для поиска иконок, фото и элементов интерфейса?

    dukenuk
    @dukenuk
    UI/UX designer, UI artist
    Большой выбор иконок, которые можно скачать бесплатно и вставить для примера в свой макет, а для релиза, когда идея ясна уже отрисовать свои.
    The Noun Project

    В моей копилке сайтов есть следующие ссылки:
    iconmonstr.com
    www.iconarchive.com - free icon stock search
    www.iconfinder.com - free icon stock search

    designmoo.com - stock web dribble ui free
    freepsdfiles.net
    365psd.com/
    365psd.ru/
    www.freebievectors.com
    www.flaticon.com - free icon
    www.freepik.com
    openclipart.org
    www.freedigitalphotos.net
    www.everystockphoto.com
    www.freephotosbank.com
    www.studio25.ro/EN
    www.photogen.com
    www.freejpg.com.ar
    www.turbophoto.com
    www.kavewall.com
    www.morguefile.com
    www.adigitaldreamer.com
    www.imagebase.net
    www.photorack.net
    qvectors.net
    www.vecteezy.com
    https://www.vectoropenstock.com/
    www.vectormadness.com
    www.vectorilla.com
    vector4free.com
    www.graphicsfuel.com
    www.greatvectors.com
    wowvectors.com
    www.vectorportal.com
    www.free-vectors.com
    www.allvectors.com
    www.logoinstant.com - logo
    shaboopie.com - logo
    imageafter.com - текстуры
    mayang.com/textures — с дневным лимитом
    free-textures.got3d.com — частично бесплатный
    newtek.com/freestuff — требуется регистрация

    Free Photo
    search.creativecommons.org — поисковик бесплатных фоток
    https://www.flickr.com/search/?q=paris&l=cc&ct
    https://500px.com/creativecommons
    photopin.com

    Little Visuals littlevisuals.co
    Unsplash unsplash.com
    Death to the Stock Photo join.deathtothestockphoto.com
    New Old Stock nos.twnsnd.co
    Superfamous (requires attribution) superfamous.com
    Picjumbo picjumbo.com
    The Pattern Library thepatternlibrary.com
    Gratisography www.gratisography.com
    Getrefe getrefe.tumblr.com
    IM Free (requires attribution) imcreator.com/free
    Jay Mantri jaymantri.com
    Public Domain Archive publicdomainarchive.com
    Magdeleine magdeleine.co
    Foodiesfeed foodiesfeed.com
    Picography picography.co
    Raumrot www.raumrot.com/10
    ISO Republic isorepublic.com
    www.gratisography.com
    stockphotos.io
    pickupimage.com — в основном, природа и города.
    www.rgbstock.com
    pixabay.com - free photo
    unsplash.com Unsplash
    www.picjumbo.com Picjumbo
    www.gratisography.com Gratisography
    www.superfamous.com Superfamous
    www.littlevisuals.co Little Visuals
    www.splitshire.com Split Shire
    www.pixabay.com Pixabay
    www.imcreator.com/free I’m Free
    www.nos.twnsnd.co New Old Stock
    wefunction.com/category/free-photos Function Free Photos
    pjrvs.com/a/photos Paul Jarvis Free Photos ]
    www.sxc.hu - hi-res free clipart photo
    www.photl.com - hi-res free clipart photo
    getty.edu - photo history
    www.firestock.ru
    www.photogen.com
    www.everystockphoto.com
    www.stockvault.net
    morguefile.com
    freerangestock.com
    www.dreamstime.com/free-photos
    picjumbo.com
    getrefe.tumblr.com
    pixabay.com
    join.deathtothestockphoto.com
    littlevisuals.co
    superfamous.com
    www.coolwebmasters.com/engine/go.php?url=aHR0c..
    compfight.com
    www.coolwebmasters.com/engine/go.php?url=aHR0c..
    www.imcreator.com/free
    nos.twnsnd.co
    photopin.com
    wefunction.com/category/free-photos
    pjrvs.com/a/photos
    allthefreestock.com — все бесплаьные стоки
    www.pexels.com
    ru.photl.com
    https://stocksnap.io/ — CC
    Ответ написан
    6 комментариев
  • Как сделать серверный рендеринг на React?

    alexfedoseev
    @alexfedoseev
    React & Rails Dev
    index.html — его быть не должно.

    Должен быть шаблон (jade, handlebars, whatever), в который:
    • через переменную вставляется DOM от реакта (результат React.renderToString);
    • после него через тег script подключается файл приложения (bundle.js)


    Сервер рендерит этот шаблон и отдает html с клиентским приложением на клиента.

    bundle.js.map — это SourceMaps, их в production быть не должно, оно убирается через настройку Webpack.

    Роутинг

    Если это SPA:

    import express    from 'express';
    import React      from 'react';
    import Router     from 'react-router';
    import Location   from 'react-router/lib/Location';
    
    import App        from '/path/to/App';
    import routes     from '/path/to/routes';
    
    
    const app = express();
    
    app.use(express.static(path.join(__dirname, 'public')));
    
    app.use('/', middleware);
    
    function middleware(req, res, next) {
      
      const location = new Location(req.path, req.query);
      
      Router.run(routes, location, (error, initialState, transition) => {
        
        const body   = React.renderToString(<App {...initialState} />);
        const layout = `${process.cwd()}/path/to/layout.jade`;
        const html   = Jade.compileFile(layout, { pretty: false })({ body });
        
        res.send(html);
        
      });
      
    }


    Если это статика:

    import express  from 'express';
    import React    from 'react';
    
    import Main     from 'components/Main';
    import About    from 'components/About';
    
    
    const app = express();
    
    app.use(express.static(path.join(__dirname, 'public')));
    
    app.get('/', (req, res) => middleware(req, res, Main));
    app.get('/about', (req, res) => middleware(req, res, About));
    
    function middleware(req, res, Component) {
      
      const body   = React.renderToString(<Component />);
      const layout = `${process.cwd()}/path/to/layout.jade`;
      const html   = Jade.compileFile(layout, { pretty: false })({ body });
      
      res.send(html);
    
    }


    /* Jade Layout */
    
    doctype html
    html
      
      head
        // head stuff...
    
      body
        #app!= body
        script(src="/bundle.js")
    Ответ написан
  • Как всё успевать и не быть роботом?

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

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

    Какая там музыка, 1-3 часа? Реально? С чем, а с музыкой (и с творчеством вообще) это точно не работает. Я недавно решил накидать ударку для демки, потратил порядка 5 часов на 16 тактов, расставлял всякие крутые фичи, думал, как будет качать. Здоровая еда и спорт - это не про вас, если вы хотите, чтобы музыка качала. Образно, конечно, я говорю.

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

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

    Обычно человек чем-то занимается профессионально и чем-то для хобби (в свободное время). Причем хобби вполне может быть профессиональным, но "для себя". Что касается профессиональной деятельности, то можно особо никуда не бежать и при этом развиваться. Уроки по разработке 1-2 часа в день после 8 часов работы? Да ладно, это не работает)) Не бегите так сильно: просто хорошо работайте, старайтесь брать интересные проекты, периодически "горизонтально ходите" по своей области. И все будет хорошо. Вы разработчик? Читайте алгебру по фану, она очень мышлению помогает. Скажите в субботу всем, что вы решили "посидеть за компом", и посмотрите интересный фреймворк или допилите что-то в опенсорс. Делайте главное все это систематически или относительно систематически. И через какое-то время вы поймете, что развитие идет. Главное делайте все круто, что касается работы (чувствуется кривой подход? надо это поправить, это будет и скилл и проекту лучше). И мониторьте разные хабры, модные течения, но не пристально. В общем, кто-то бежит очень сильно, а кто-то медленнее. К качеству это вряд ли имеет какое отношение.

    А что касается того, что хочется делать хобби и делать его круто... Здесь выхода нет, придется отставить спорт, правильное питание, не тратить на это время, да. Переехать поближе к работе, возможно, сменить город на поменьше и делать весь вечер игры или музыку, чтобы качала. Мешать соседям, все это не важно... Как и сердечно-сосудистые заболевания (у меня, кстати, есть зачатки, так что я очень хорошо знаю, что такое аритмии/экстрасистолия, повышенное давление, частые головные боли и так далее).

    Семья? Говорят еще, что надо семью. Это все чуть позже (имею в виду детей, т.к. именно они реально обременяют). Не могу представить, как можно жить одному (давно не жил), но если человек рядом понимает, то проблем быть не должно быть.

    В качестве вывода:

    1) Найти свой темп. Пусть он медленнее, чем у самого медленного человека в мире, но главное - быть качественным.
    2) Не гнаться за всем, сделать акцент на самом важном. Обычно, кстати, у человека все интересы смежные или их не более двух (больших таких категорий/классов интересов), так что тут легко сделать акцент на самом важном. Это чувствуется всегда (мой субъективный опыт, исключения вижу оооочень редко).
    3) Забить на модные штуки 21 века а-ля спорт, ЗОЖ. Делайте зарядку по утрам и не всегда ешьте фастфуд, и все будет хорошо.
    4) Работа... Не то, чтобы это центр вашей жизни. Я для себя уяснил одно только правило: делайте круто то, что вы делайте. Вы можете не брать много проектов/ответственности, уходить с работы строго в 6 и ни минутой позже, в общем, в разное время относиться к работе по-разному. Когда-то стрелять там и блистать идеями, когда-то просто работать, когда-то особо не развиваться и заниматься хобби. Относитесь к ней проще. Такая идея лично мне дает свободу, я лучше работаю так. Тем более, что мы с вами в мире IT. У нас работа совпадает с тем, что интересно по-настоящему. Вы же не пьете чай каждую минуту, потому что он очень крутой? Иногда можно не пить его целый день, но это не важно, вы все равно вернетесь к нему через день или два, потому что он нравится. :)
    5) Как успевать все и не быть роботом? Никак :)

    p.s. Я старался вас успокоить немного, у вас больше психология, нежели реальные проблемы. Не то, чтобы надо всегда быть таким спокойным, нет. Можно адско побегать неделю или месяц. Вы слишком сильно подвержены влиянию разных течений в обществе, они конфликтуют с видением мира настоящего внутри вас. Надо всегда что-то терять. Нельзя повысить уровень абстракции и не усложнить систему (= повысить входной порог). Нельзя очень напрячь руку и сохранить ее мобильность. И да, нельзя повысить количество занятий, не потеряв в качестве (есть какой-то порог, но ваш план перешел порог нормального человека после 3.5 пункта).
    Ответ написан
    1 комментарий
  • Карьера программиста после 30+. Миф или реальность?

    max-kuznetsov
    @max-kuznetsov
    Главный IT-архитектор
    Боже, сколько страшилок понаписали!

    Дай-ка и я своё слово вставлю.

    Я начинал свою профессиональную карьеру дважды. Первый раз в 2002-м году. На тот момент мне было 26. Работал с Delphi. Дослужился до ведущего разработчика. Но пришлось сменить направление деятельности. И второй раз снова начал с простого программиста, осваивающего Java и .NET. Это было уже в 35. Сейчас работаю архитектором.

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

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

    Юность имеет свои преимущества, но они не решающие. И недостатков у молодых программистов тоже много. Так что я бы не стал говорить, что у Вас всё плохо. В 30+ жизнь только начинается. Это я точно знаю!

    P.S. У нас в проектах работают люди разного возраста и пола. Программисты в 30 и старше - хорошее ядро команды. Они вносят стабильность. В том числе и в код. Но иногда нужно их мотивировать на то, чтобы пробовать что-то новое. И тут важно присутствие молодёжи.
    Ответ написан
    2 комментария
  • Как разрабатывать в жару без кондиционера и не сойти с ума?

    @lotse8
    График работы поменяй. Вставай в 4 часа утра и работай до 11 - это 7 часов, если надо еще вечером добирай с 20 до 22. Днем в жару можно час-два спать. Так все селяне работают. И я так работал, несмотря на то что был всю жизнь совой. Через неделю привык. В утренние часы продуктивность намного выше, чем ночью.
    Кондиционер плохо влияет на производительность, воздух у него не здоровый.
    Ответ написан
    1 комментарий
  • Получение опыта!? Замкнутый круг или безвыходная ситуация?

    newross
    @newross
    Product owner
    Что за надуманная проблема? Где тут замкнутый круг? В 99.99% случаев банальная лень мешает получить опыт.
    Ведь реально существует 100500 вариантов получить опыт и иногда даже заработать:
    - банальные стажировки;
    - многие крупные компании имеют свои учебные центры, некоторые даже стипендию платят;
    - фриланс помогает набить руку на мелких проектах и наработать портфолио;
    - низкооплачиваемая работа разработчиком во всяких НИИ и на заводах может быть первым шагом к большим компаниям;
    - коммиты в открытые проекты;
    - свои проекты в конце концов.
    Ответ написан
    5 комментариев
  • Зачем писать в паттерне "декоратор" название конструктора?

    Ashlst
    @Ashlst
    Фанат эстетики и красивых решений.
    При создании своего прототипа,свойство constructor будет указывать не на Ball,чтобы эта связь не потерялась создается новое,одноименное свойство в прототипе.
    Ответ написан
    Комментировать
  • Префиксы flexbox?

    Используйте Autoprefixer и не задумывайтесь о префиксах вообще.
    Ответ написан
    Комментировать
  • Какие существуют сервисы для создания презентаций?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    lab.hakim.se/reveal-js/# - вам сюда.
    Ответ написан
    Комментировать
  • Как создать такую фигуру на css?

    Petroveg
    @Petroveg
    Миром правят маленькие с#@&ки
    Используя обычные подручные рамки, linear-gradient и и transform:rotate получаем искомое.
    Можно поизвращаться с perspective и rotateX, но полученный результат ужасен в FF.

    И, по обыкновению, кладём фон с помощью SVG.
    <svg xmlns="http://www.w3.org/2000/svg" width="60" height="20" preserveAspectRatio="none" viewBox="0 0 60 20">
    	<path fill="#ffb600" d="M 0,20 L 10 0 54 3 60 20 z"/>
    </svg>
    Ответ написан
    7 комментариев