• Где можно скачивать макеты PSD?

    Ivnika
    @Ivnika
    Например здесь: allday2.com/tpl
    или здест большая подборка: habrahabr.ru/post/250621
    Ответ написан
    Комментировать
  • Есть ли такие ресурсы на которых разбирают базовые проблемы вёрстки?

    @President42
    Как делается сетка: тыц, тыщ, тыдыщь

    Как делается меню: раз, два, три

    SVG: адын, два, три, четыре

    Parallax: вот, и вот, и ещё вот. И вот тут почти Parallax, думаю тоже пригодится

    Бонус:
    • JavaScript Garden -- тонкости JavaScript
    • Learn X in Y minutes -- краткие туториалы по куче языков (там и JS, и CSS и много чего ещё есть), некоторые с русским переводом (но не все)
    • Material Design -- гайдлайн по Material Design
    • PrimerCSS -- стайлгайд Github + их CSS фреймворк
    Ответ написан
    7 комментариев
  • Есть ли такие ресурсы на которых разбирают базовые проблемы вёрстки?

    @tef
    Вёрстка, это всегда проблема. Потому что html и css это одна большая проблема сама по себе.
    Всё что вы перечислили это мейнстримовый абстрактный кич. Я бы вообще не стал рассматривать это в отдельности, как что-то реально существующее. Всё что вам нудно это усвоить основные базовые понятия: строчный и блочный элемент, поток, позиционирование, z-index. А дальше уже делаете дизайн какой захотите с паралаксами, сетками и тд.
    По поводу ресурсов где рассматриваются проблемы вёрстки. Скажите, зачем вам чужие проблемы? Их на самом деле столько, что пером не описать.
    Просто верстайте. И когда натолкнётесь на проблему, либо изначально задумаете какую-нибудь конструкцию, которую не знаете как сверстать, то там уже можно будет и погуглить, почитать или задать конкретный вопрос.
    Всё дело в том, что сама по себе технология html и css, да и js, не идеальна. Причём далеко не идеальна. Скажем если мы возьмём идеальность за 100%, то нынешняя ситуация будет где-то процентов на 15-20, ну максимум 30.
    Ответ написан
    1 комментарий
  • Музыка для кодинга, под что вы программируете?

    @DeScWD
    под Ханса Зиммера
    Ответ написан
    Комментировать
  • Альтернатива Photoshop в Ubuntu для front-end разработчика?

    jidckii
    @jidckii
    system administrator
    В виртуалке на убунте гоняю вин7 на ней фотошоп. Лучшего решения нет ))
    Ответ написан
    Комментировать
  • Когда изучать npm, grunt, bower, git и т.д?

    @flor_master
    Могу верстать, могу не верстать.
    На самом деле все очень просто.
    NPM - это пакетный менеджер который идет вместе с node.js, С помошью него можно устанавливать все что вы перечислили выше и другие модули, программы.

    Gulp, Grunt - это консольные утилиты. Они взаимозаменяемы. Они делают рутинную работу за тебя: компилируют Less Sass, склеивают скрипты, минифицируют скрипты, стили, делают спрайты, оптимизируют картинки и даже поднимают свой простенький вебсервер и LiveReload.

    Gulp или Grunt - Дело вкуса. Мне понравился больше Gulp. Он быстрее.

    Git - Система контроля версий твоего кода. Она позволяет организовать совместную работу нескольких разработчиков над ним проектом.

    Bower - просто утилита, которая быстро тебе скачивает необходимые библиотеки и из хависимости. Что бы ты не лазил по сайтам разработчиков. Например тебе надо установить jquery - ты просто в консоли пишешь Bower install jquery и тебе скачивается Jquery.

    Я считаю что Git в современной работе просто необходим как воздух.
    Gulp или Grunt и Bower сильно облегчили мне жизнь.

    Думаю что для устроиства на работу ключевым знанием будет Git. а потом уже все остальное.

    Gulp или Grunt и Bower - очень легкие программы для первичного использования. Их Можно попробовать и решить нужны ли они тебе или нет - за очень короткий промежуток времени.
    Ответ написан
    1 комментарий
  • Комфортная Frontend разработка. Или как правильно совместить Windows и Linux?

    IonDen
    @IonDen
    JavaScript developer. IonDen.com
    Не вижу ни одной причины не поставить Windows на виртуалку.
    Ответ написан
    1 комментарий
  • С чего начать обучение для фриланса?

    kumaxim
    @kumaxim
    Web-программист
    И так, с чего начать обучение:
    1.Самый низкий порог вхождения у языка PHP. Начинайте именно с него
    2.Изучите популярные CMS: WP, DLE, Joomla и т.д. Очень много заказов есть типа "Создать сайт", причем экзотики в 2 из 3 проектах не нужно. Здесь минус в том, что школоты тут полно и цену они сбивают весьма сильно...
    3.Далее категория заказов "А можно ли сделать вот так". Сводится все это к разработке/переработке модулей на все тех же CMS. Нужно учить PHP + API этих самых CMS. Возьмите один движок и копайте по нему в эту область, не рвитесь сразу за всеми. Порог вхождения тут тоже не велик, но здесь больше голодные студенты обитают
    4.Когда перерастете уровень дополнений/модулей, переходите к фреймворкам. Сейчас самый популярный Yii. Фреймворк позволяет Вам делать какие-то уникальные приложения, которые достаточно тяжело реализовать на готовых системах. Здесь ценник по существеннее, чем в первых двух, т.к. школота в силу своих умственных способностей сюда влезть не может.

    Теперь расскажу как вообще этому обучаться на своем примере. Я делаю так:
    1.Открываю тоненькую книжечку по языку(листов 100, не более), смотрю на основы
    2.Делаю примеры из этой книжке в IDE/блокноте. Это дает мне определенную базу
    3.Далее у меня есть список из примерно 20 задач(любую методичку по программированию откройте), которые я всегда делаю на новом языке. Это позволяет мне "привыкнуть" к новому коду и начать изучать стандартную библиотеку языка
    4.Затем я начинаю брать низкобюджетные заказы на фрилансе по этому языку
    5.После этого начинаю учить самый популярный фреймворк языка, опять же на низкобюджетных проектах.
    6.Сделать с 12-15 проектов я могу уже браться за что-то более менее серьезное с почасовой оплатой на фултайме.

    Вот это мой путь. По срокам - базу я себе нарабатываю за 1,5-2 месяца, на это время у Вас должна быть какая-то "подушка".

    P.S. надеюсь помог. ))
    Ответ написан
    7 комментариев
  • Каков путь разработчика web-страниц?

    fodoyko
    @fodoyko
    DevOps и Infrastructure консультант
    Спойлер: я автор книги Самообразование веб-разработчика, указанной по ссылке выше, и путь изучения технологий, описанный в ней – это, по сути, мой путь (точнее, первые пару лет моего пути).

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

    Технически я начал с изучения HTML/CSS, на которых написал сначала свою первую домашнюю страничку, а потом сверстал простой сайт для друга и ещё несколько небольших статичных сайтов. Полученных таким образом знаний мне вскоре хватило, чтобы получить первую оплачиваемую работу. Это был проект по переделке вёрстки одного крупного интернет магазина с таблиц на дивы. Сайт при этом должен был выглядеть чудесно в IE6 (были времена :( ) – слава богу, перед вами такой задачи не встанет в наши светлые дни.

    На том же интернет магазине я впервые получил деньги на JS код: писал небольшие скрипты на jQuery.

    Затем я перешёл к изучению всяких CMS типа ModX, ExpressionEngine, OpenCart и прочих штук. Изначально мне нужна была CMS для своего личного сайта, но в конечном счёте эти навыки помогли мне найти заказы в небольших фриланс-конторах в Перми. Дополнительно было много заказов по вёрстке с фриланс-бирж. Верстал я неутолимо, быстро и предельно качественно. Проблема заключалась в том, что на вёрстке я бы со своей целью "делать свои веб-приложения" далеко не уехал, поэтому писать html/css меня быстро задолбало. Тем не менее, навыки фронтенд-разработки пригодились в будущем не раз.

    Поэтому я взялся за изучение Ruby on Rails. Писал сначала для себя: сначала библиотеку рок-музыки, потом менеджер личных финансов (которым всё ещё пользуюсь). Затем кинул сообщение в ror2ru и получил несколько предложений о работе. Одно из них принял, где и познакомился со своим ментором на следующие много лет, вплоть до сегодняшнего дня. Так я попал в аутсорс компанию, в которой работал на вынос полтора года, совмещая это с универом. Задач было много, проектов много: постоянно приходилось учить тонны новых вещей. Желания тоже было много, поэтому необходимость мало спать и много мучиться над кажущимися невозможными задачами была в радость.

    Это были настолько интенсивные полтора (или два?) года работы, что под конец моих навыков, рекоммендаций и портфолио хватило для того, чтобы в 19 лет без высшего образования получить работу в Берлине, куда я успешно и перебрался, получив визу. А потом успешно сменил работу и теперь делаю крутые штуки в Babbel.com. High load, DevOps, автоматизация и всё такое прочее :-)

    Добавлю, что на всём моём пути у меня всегда был ментор. Сначала это был админ сайта любимого журнала по видео-играм и один из разработчиков того интернет магазина. Затем это был владелец той аутсорс фирмы, который перевернул моё представление о работе, научил работать и "довёл" меня до переезда в Берлин. И сейчас, на текущей работе, моим ментором считаю архитектора компании и некоторых разработчиков.

    Менторы + неутолимое упорство в самообразовании + определённый процент удачи – это та формула успешного хождения по пути веб-разработчика, которая идеально работает для меня и для многих других.

    PS.
    В прошлом году я опрашивал своих знакомых матёрых программистов о том, каков был их путь, какими были первые проекты и т.п. В итоге получилось 13 подробных интересных интервью, думаю вам будет интересно ознакомиться: mkdev.me/categories/byt-razrabotchika/posts/kak-st....
    Ответ написан
    Комментировать
  • Каким должен быть собственный проект для устройства на работу?

    5angel
    @5angel
    Фронтенд-лид
    Свои проекты показывать можно и нужно. А лучше всего – не просто показать, а рассказать о том, как шла разработка, с какими проблемами вы столкнулись и как их решали. Если вы таким образом хотите повысить свои шансы на получение работы, то проект должен показать, что вы хорошо владеет предметом как с теоретической, так и с практической точки зрения. Я говорю здесь даже не о Ruby, интересные вещь можно написать на любом языке.

    На что нужно обратить внимание:
    Архитектура. Грамотно спроектированная система – залог успеха всего предприятия.
    Производительность. Здесь можно показать как алгоритмическую подготовку и умение работать с базами данных, так и знание особенностей конкретного языка.
    Тестирование и документация. Покрытие тестами и описание функционала, начиная от основных модулей и заканчивая отдельными функциями – тот идеал, которого стараются (но не могут) достигнуть во всех уважающих свою разработку компаниях.

    Если у коллег есть какие-либо дополнения, прошу (:
    Ответ написан
    11 комментариев
  • Фрилансеры, какие способы продвижения себя вы используете?

    5angel
    @5angel
    Фронтенд-лид
    Основной способ продвижения себя – это создание репутации, повышение узнаваемости собственной персоны в профессиональных кругах.

    Добиваться этого можно разными способами. Самый очевидный вариант – хорошо выполнять свою работу, зарабатывать рейтинг и отзывы на разнообразных фриланс-биржах. Помимо того, что вас будут находить в основном каталоге, ваши бывшие клиенты будут в том числе рекомендовать ваши услуги своим знакомым, это и есть так называемое «сарафанное радио».

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

    Ведение блога и написание статей об интересующей вас сфере также помогает представить себя в качестве профессионала своего дела, что, опять же, повышает доверие к вам и вашему труду.
    Ответ написан
    Комментировать
  • Как программисту быстро научиться качественно верстать?

    nanomen
    @nanomen
    front-end разработчик
    Может пригодиться. Страничка с тестовым заданием в Яндекс. Ниже они дают ссылки на ресурсы по теме.

    alexbaumgertner.github.io/testworks/yandex
    Ответ написан
    1 комментарий
  • Как научиться вёрстке сайтов с нуля?

    @mishapsv
    Из собственного опыта:
    начинал с книг, статей, htmlbook - дало начальную базу, позволяло с большего править готовые шаблоны.
    Потом появились интерактивные курсы:
    - codecademy.com показались слабыми: пройти лишним не будет, но особо не продвинетесь.
    - teamtreehouse.com - неплохие курсы, активно развиваются, но платные.
    - htmlacademy.ru - очень крутые: отлично подается теория, много практики, основной раздел бесплатный. К тому же сервис русскоязычный.

    У этих же ребят есть интенсив по верстке сайтов с нуля. Прошел его.
    Если есть возможность оплатить - очень рекомендую. Реально вырастете за месяц. Плюс у вас останутся записи вебинаров и бесплатный доступ на все последующие интенсивы.
    Могу поделиться промо-кодом "344a1a5b"(без кавычек) - скидка 800р.

    Успехов!
    Ответ написан
    1 комментарий
  • Возможен ли полноценный photoshop и illustrator под вайном?

    @oleksandr_veles
    В своё время скачанный в момент альтруизма адобы полулегальный photoshop cs2 без проблем поставился под системный wine ubuntu 12.04 и работает без проблем.
    Поставте playonlinux -там есть готовые конфиги wine для установки более свежего.
    Ответ написан
    Комментировать
  • Как копировать тени, градиенты и т.п. из PSD в CSS3?

    IonDen
    @IonDen
    JavaScript developer. IonDen.com
    Как указали выше, вот такой вот есть плагин: pnghat.madebysource.com
    но он платный.

    Либо можно за несколько секунд сделать нужный градиент здесь: www.colorzilla.com/gradient-editor
    Ответ написан
    Комментировать
  • Как научится верстать из PSD макетов в html+css?

    lexxpavlov
    @lexxpavlov
    Программист, преподаватель
    Посмотрите вот эти две статьи с хабра:
    Как сверстать веб-страницу. Часть 1
    Как сверстать веб-страницу. Часть 2 — Bootstrap
    И прочтите все комментарии к этим статьям (впрочем, как обычно на хабре:)
    Очень хорошие статьи, пошагово расскажут, что делать с макетом.
    UPD. Ещё одна статья от того же автора:
    Как сверстать тему для WordPress
    Ответ написан
    Комментировать
  • Как понять принципы ООП?

    onqu
    @onqu
    weasy
    Чтобы понять принципы ООП, книги не требуются. Взгляните вокруг себя. Всмотритесь в любой объект в реальном мире, опишите его наиболее подробно (материал, размер, цвет, вес, плотность, составные части и т.д.), это будут его свойства. Опишите, что и каким образом этот объект умеет делать (включаться, складываться, кушать электроэнергию, взаимодействовать с другими объектами или окружающей средой и т.д.), это будут его методы. Подумайте, для чего используется этот объект, что ему нужно изменить или добавить, чтобы использовать в других условиях или целях, и на основе всех собранных знаний создать более удобный экземпляр, это будет наследование и полиморфизм. Теперь немедленно забудьте обо всем, используйте объект по назначению, это будет инкапсуляция. Дальше останутся только тонкости выбранного Вами языка, шаблоны, методологии и прочаяие ересь тренды.
    Ответ написан
    2 комментария
  • Что изучать и в каком порядке?

    @andymitrich
    Software Developer
    Вопрос неоднозначный, потому как что-то изучать вы уже начали. Выражу своё мнение, если выберете php:
    1. Ознакомтесь внимательно с мануалом по php: www.php.net/manual/ru - это очень полезно и нужно; прочитайте основные моменты хотя бы раз, постарайтесь понять. И далее, не забывайте туда поглядывать.
    2. Изучайте мануал по БД. Уясните как писать запросы к БД, что такое JOIN, как он работает, зачем нужны индексы.
    3. Прочитайте, хотя бы в общих чертах, как работает веб-сервер, Apache или Nginx.
    4. Выберите какой-нибудь php-фреймворк, например Yii, открывайте документацию по нему и исходный код и смотрите как что сделано. Поймите, как генерится страница, как работает роутинг, как парсятся шаблоны и происходит работа с БД.
    5. Не зацикливайтесь только на языке программирования. Есть еще теория алгоритмов, дискретная математика и т.д. - потихоньку ковыряйте и это тоже.
    6. Если вдруг поймете, что php вам идет, попробуйте python - для всё приведенное выше также актуально.
    7. Не стесняйтесь задавать вопросы, но только пробуйте всё-таки вначале гуглить, чтобы не получилось как в это случае: puu.sh/9h6Fs/61bc05ecb7.png.
    Ответ написан
    Комментировать
  • Каков план личностного развития PHP программиста с нуля?

    konst20
    @konst20
    Программист, преподаватель, немного электронщик
    Есть опыт помощи таким начинающим.
    реальный срок до запуска джуниора - полгода, никого не слушайте.

    Важные моменты
    веб-программирование на базе PHP - это стек технологий: PHP/SQL/CSS/HTML/JS + Linux хотя бы азы + знание важных инструментариев (FTP, Git/SVN, работа с БД)
    чистый PHP плюс даже все перечисленное выше - не особо нужно и не интересно. Нужно знание конкретных платформ: фреймворков и/или CMS. (Почитайте вакансии на Хантиме по запросу PHP, обратите на это внимание). Навскидку самые востребованные (спорно конечно): Yii фреймворк, CMS Битрикс и Wordpress.

    Как начать?
    Смело на амбразуру!
    1) Установите у себя рабочую среду LAMP/WAMP - Apache, PHP, MySQL. Для этого возьмите пакет Denwer или OpenServer, что больше понравится. Сделайте Hello World просто как HTML, потом на PHP, потом алертом на JS. Порадуйтесь.
    Установите все редакторы кода. Кто там вам будет рекомендовать блокнот или notepad++ - не слушайте. Варианты: если машина мощная (4+ Гб памяти и пр.), берите редактор phpStorm (для php/html/css/js). Если не очень мощная - берите komodo edit. Для работы с БД инструмент встроен в Denwer/OpenServer, это phpMyAdmin
    2) Идеально, если вы договоритесь сделать кому-нибудь сайт. Бесплатно или за небольшую плату. Если нет - сами себе поставьте задачу: сайт про котиков/про детей etc. Красивый сайт, с галереей, с эффектами, с материалами
    Возьмите CMS Wordpress и попытайтесь сделать сайт у себя на компьтере. Настоящий сайт, во всей красе, как вы хотите. Правьте его, смотрите код, экспериментируйте. Сообщество огромное, вы найдете ответы на все свои вопросы
    Потратьте чуть денег, купите себе домен и хостинг, залейте сайт на хостинг.
    Порадуйтесь. Похвастайтесь.
    3) Ищите в сети тестовые задачи и решайте их, изучайте материалы собеседований, вопросы - их много.
    4) Зарегистрируйтесь на odesk.com под каким-то фейковым email, пройдите тесты по PHP, CSS, HTML, jQuery, Wordpress, а во время прохождения делайте скриншоты вопросов. Потом изучайте эти вопросы, ищите ответы, далеко не обязательно на все. Тесты вы, конечно, не пройдете, но вам нужны только вопросы.
    5) Постоянно следите за вакансиями "PHP-программист", "веб-программист" на Хантиме, на hh.ru и подобных ресурсах.

    И да, как только напишете первую строку кода - начните читать про Git. Как будете готовы - сразу внедрите у себя Git, вы будете очарованы его возможностями.

    Вот как раз на полгода.
    После этого у вас появится масса информации, и дальше вы сами сориентируетесь.
    Ответ написан
    11 комментариев