аноны пользующиеся галпом подскажите, как его установить с одного проекта в другой. Не хочу по новой все расписывать, чтобы все подключилось.
1. Переноси файлы package.json и gulpfile.js в новую директорию.
2. Переходи в консоли в новую папку.
3. Выполняй команду npm install.
А я бампану вопрос, как сделать такие треугольнички, кроме очевидного абсолютно спозиционированного псевдоэлемента с пнгшным фоном или все так и делают?
папки app и dist я сам должен получается делать? Вместе с содержимым в них?
Да
Напиши шелл-скрипт, если руками лень. Или сделай бойлерплейт проекта и копипасти его.
Именно так, только лучше делать с помощью свг, а не пнг.
yeoman.io
>лучше делать с помощью svg
ясно. Как думаешь, анон, фронт-енду стоит на базовом уровне овладеть иллюстратором, чтоб уметь самому рисовать там те же треугольники?
Ну если у тебя времени много, то можешь. Но я бы лучше использовал Inkscape. Он отлично трассирует такие вот незамысловатые растровые фигуры.
Стоит держать на гитхабе свой говнокод? Вдруг работодатель когда будет смотреть, посмотрит какой у тебя пиздец. Я бы публично
Сука, я бы публично выставлял только лучшие работы*
Не пиши говнокод
Если ты на протяжении достаточно долгого времени считаешь один из своих тренировочных проектов лучшим, значит ты деградируешь. Репозитории можно удалять, как напишешь что-то гораздо круче, снеси. Для работодателя хватит 2-3 грамотных штук на гитхабе.
Подскажите, какие файлы бутстрапа формата .sass надо кидать в папку со своим проектом?
А иллюстратор в трассирование растровых фигур неспособен?
Я хз. Мне он нафиг не сдался. Я планирую развиваться в сторону хардкорного JS, а не вебдизайна.
это как хардкорный JS? ЧТо для этого нужно?
Знать больше чем подключение свистоперделок JQuery.
Ну хули, кому нужен обычный верстала? Ты либо на фрилансе человек оркестр, который сам рисует, верстает и подключает плагинчики JQuery.
Либо верстала + JS джедай, который способен запилить SPA.
Кто нибудь конкретно объясните что не так в мануале адаптивности от Першина. Насколько я понимаю есть два типа вёрстки - резина и простой адаптив. Как правило, резина используется на всяких сайтах с дизайном а-ля windows 8 (напр. всякие магазины ювелирки). Для обычных же (которых большинство и новичок с вероятностью 70% возьмёт именно такой проект) интернет магазинов (которые я уже делал) хватает простого адаптива, да и платят за это нормально, аналогично и с обычными интерфейсами / веб приложениями, которым нахуй не нужна резина, т.к. в основном они юзаются на десктопах, вопрос в том что за кукареканье тут раздаётся? Или это свидетели секты БЭМ'а?
>вебдизайн
>иллюстратор
совсем долбоёбы тут?
Мянь, а где по твоему дизайнеры рисуют всю векторную хенрю?
Ебать ты дебил. Я в вебдизайне 5 лет и могу тебе с уверенностью сказать что владение иллюстратором в нём нужно минимальное. Так как всё что касается вектора и иллюстраций покупается на стоках/воруется.
>Я в вебдизайне 5 лет
С твоей риторикой, ты скорее 5 лет в первом классе.
Ты можешь и дальше воровать вектор, но когда-нибудь тебе понадобится что-то нарисовать самому и ты соснешь.
>у отброса порвало пердак и он перешёл на личности
зачем мне что то рисовать самому, лол
тем более я перекатываюсь во фронтенд и интерактивный дизайн
просто иди нахуй
В скетче, конечно. Или в ФШ.
Класс элементу меню вешать на лишку или ссылку? Или туда и туда?
Резина - это отсутствие фиксированных размеров. Я допускаю, что можно изъебнуться раком кверху и захуярить чисто резиновую верстку на флексах, например, но тут нужен хороший дизайнер, который понимает, что к чему.
Адаптив - перестроение сетки/размеров/шрифтов в зависимости от девайса (плотность пикселей, ориентация, разрешение и т.п.). "Обычный" адаптив, в твоем понимании, это подгонка страницы под стандартные вьюпорты (разрешения х480, х760, х920+).
Адаптив+резина = респонсив.
Маленькое, озлобленное, агрессивное дитя.
Мне похуй куда ты там перекатываешься.
То что ты сам не можешь ничего нарисовать, не значит что другие должны поступать как ты.
Попросит заказчик нарисовать красивый, тематический логотип для сайта, а ты ему скажешь: "Извини, я только воровать умею".
Смотрю вот, как верстать иконочки из седоны и думаю - либо взять всё из макета и слепить из этого спрайт, либо взять уже нарезанные svg-иконочки. Какой вариант лучше? Как я понял, в первом я получу лучшую производительность, во втором - оптимизацию количества запросов.
Я об этом же и говорю, вопрос в том что не так в гайде от першина. Понятно что бэкграунд всегда будет резиновый. А то что ты написал про адаптив першин в последующих частях рассказывает.
Делай свг.
Спрайтами намного проще, но это тренировочный макет, плюсик в резюме и все такое.
Я пошел третьим путем и подключил фонтавесоме, лол.
А что там не так? Я упустил нить разговора.
Никакого особого гайда по адаптиву у академии нет.
Олсо, вот многие ругают грант за его уебанский конфиг. Но ведь конфиг вебпака еще более уебанский. Особенно после мимимишного и понятного галпа.
Создаешь свг спрайт с помощью галп таска. В итоге будешь иметь 1 запрос, нормальное кэширование и конечно манипуляцию цветом, размерами в css.
Ссу тебе на ебало, убогий.
Веб-дизайнер не должен рисовать иконки в 2016 году.
Потому что этим занимаются иллюстраторы.
И да, я умею рисовать "логотипы". Но как правило эти задачи разделены в норомальных проектах, и если заказчик просит нарисовать лого у веб-дизайнера, то это вася из мухосранска который продаёт голубцы.
>спрайтами намного проще
Я бы не сказал. Если свгшками, надо будет просто их перекрасить и подключать как обычные файлики. Если спрайтами, там тоже ничего сложного, но таки использование спрайтов требовало от меня настройки специального плагина, да и каждую фоновую иконку теперь надо помещать в отдельный див.
Или ты имел в виду склеить из svg спрайт?
Ну, я имел в виду:
> взять все из макета и слепить из этого спрайт
А так да, ты прав.
Блин, я тебя так и не полнял :)
Взять из макета пнгшки и слепить спрайт из них?
Или просто взять svg, которые предоставила академия, и вставлять их не склеивая?
уиии, верстка, фронтенд))) буду получать 100к))) поеду в мацквуу)))) я на ютубе видел, это ж любой дурак сможет)) уже два макета сделал))) кстати аноны подскажите, кароч отступ менюшке написал и все чот развалилось((( эт че за дела ваще, а?(((
Этот копирайтер порвался, несите нового.
Ты болен. А знаешь почему? Да потому что ты пытаешься навязать свои взгляды как единственную возможную истину.
Вебдизайнер не должен...., вебдизайнер не делает это...
Чувак, если это принесет ему дополнительную прибыль, то почему бы ему это не сделать?
Не все живут по шаблонам. Не все дулают и поступают в точности как ты. И только гнилой-долбаеб будет за это упрекать их и оскорблять.
Граждане, узбагойтесь. Оба ваших постулата верны. И один прав в том, что чем дальше, тем больше идет узкое специализирование по задачам - аля конвейер Форда. И другой в том что люди-оркестры всегда будут более ценны даже в рамках конвейерного производства.
Вообще, не понимаю, зачем нужно сраться? Если с чем-то не согласен, можно же нормально, вежливо, без наездов это с одной стороны донести, с другой - выслушать, и в ходе обсуждения прийти к чему-нибудь или обоим остаться при своём мнении.
я еще друзьям всем рассказал)))) у меня сосед как узнал что за это деньги платят, сразу полез редактор ставить))) как в студию устроюсь, говорит, жене сапоги куплю)))
font-weight: bold !important;
Иди пиши дальше свои тексты про $купить говяжьи анусы Калуга недорого$ по 16 рублей, и не отвлекай успешногоспод.
смотрите какая красота, по итогу scss скомпилится в 8к строк css кода
Ты lorem то убери. А то я тоже могу текст на 9к символов в переменную вставить и сказать что у меня 3 строки в 9к компилируются.
я ж про scss говорил, html вообще не компилируется
Мне даже интересно, как ты умудрился соотнести лорем-наполнение хтмл и цсс код?
другой анон
Ошибся, сорян. И да, html компилируется.
вы о чем наркоманы ? Я грю что scss файлик скомпилируется в css 8к строк кода, html случайно заскринил
А сколько в scss строк?
7 наверное мож чуть меньше, я прост показываю силу модульности scss и bem,
пацаны https://github.com/LitvinenkoEvgeny/cdevs/tree/gh-pages че за нахуй ? почему не работает ? https://github.com/LitvinenkoEvgeny/cdevs/tree/gh-pages
на мыло пришло:
The page build failed with the following error:
Page build failed. For more information, see https://help.github.com/articles/troubleshooting-github-pages-build-failures.
For information on troubleshooting Jekyll see:
https://help.github.com/articles/troubleshooting-jekyll-builds
If you have any questions you can contact us by replying to this email.
а есть еще места куда можно залить проект ?
Разбирайся с gh-pages, тряпка.
Не работает потому что код в ветке master, а не gh-pages.
git checkout --orphan gh-pages
бля --orphan забыл че енто вообще за говно ?
ПАцаны начинать с хтмл/цсс это стандарт? Заканчиваю бесплатные курсы, будуначинать интенсив хтмлакадемии. Потом понимание само прийдет что учить или сейчас можно посматривать на питоны, пыхи и прочие джавы? Пока время есть, а то потом опять учеба начнется.
Какие джавы, питоны, пыхи? Это тред про фронтенд! У нас есть только три столпа - Отец Html, Сын Css и Святой Дух Js. А про прочее в нашем Храме не упоминай даже.
Анон, а на гитхабе можно держать только одну страницу, или несколько? Страницу с именем своего аккаунта я уже запилил, можно ли с этого же акка запилить ещё одну страницу?
Ты бэкендовскую ересь подальше оставь, у нас фронтотред.
Можно сколько угодно вида http://username.github.io/repository
Прошел тут блочную модель и мозги немного сломались.
Везет тебе. Я тут реактом обмазываюсь после ваниллы, и у меня мозги вспотели уже на этапе настройки вебпака.
Почему везёт? Ты отмучаешься в ближайшие пару недель, а ему ещё несколько месяцев страдать.
А вот мне хорошо - работу искать не надо, поэтому забил на реакты и ангуляры, автоматизации вёрстки и прочую поебень, а просто обмазался жкверей и пхп, чтоб ненапряжно кодить в своё удовольствие.
Хобби или фрилансер?
Хобби. Я тот анон, что вкатился для того чтобы запилить браузерку.
Я бы тебе посоветовал забить на жиквери и перейти на "ванильный" ES6. Намного приятней и красивее, никаких особых трудностей при переходе да и настройка занимает пару минут. Жиквери какое-то черезчур говно, особенно если "для себя". Хотя не знаю, может тебе нравится.
Так, аноны, перекрасил svg и у неё почему-то изменились размеры, представляете! Полез в код и увидел, что иллюстратор или что-то ещё округлил кое-какие значения. Что это за фигня? И это векторная графика?
Чот у тебя там магия какая-то прям.
Попробовал перекрасить голубые иконочки (те, что были предварительно обработаны в иллюстраторе) обратно в чёрные. Желаемого эффекта достиг. Получется, при обработке иллюстратор округляет некоторые значения.
Ребзя, поздравьте меня защитился сегодня в институте!
N-день-кун, поздравляю, дальше пойдёт по накатанной.
Продажник-кун
N-день-кун, поздравляю, дальше пойдёт по накатанной.
Продажник-кун
Верстаны, кто-нибудь добавлял гугл-карты при локальной разработке? Попробовал подключить по инструкции отсюда https://habrahabr.ru/post/110460/ , выдаёт ошибку пикрелейтед.
В базовом посмотри. Лично у меня с седоной очень легко все подключилось.
Получилось сделать через гугл карты, но это и раньше получалось. Просто нужно как-то убрать с карты все украшения вроде иконки гугл-пользователя, или иконки изменения масштаба, вот это всё.
А вот это уже не верен что вообще реально. Или придется с обычной картой как-то заморачиваться.
Как эту хуету сверстать? Это одна (стартовая) секция лендинга. Она должна быть высотой на весь вьюпорт? Если так, то какого хуя в ней всё такое огромное. У меня монитор 1378 * 768 и одно только лого в таком размере занимает почти весь вьюпорт.
Это реально и довольно просто. Давай что ли вместе погуглим "google maps убрать элементы управления"
Вот этот гигантский пиздец в браузере. Я не знаю, может это дизайн под ретину или еще что. Я прост ньюфаг.
Двачую этого. JQuery многие используют, так как там очень высокая поддержка динозавров.
Тебе оно нахуй не нужно, так как пока ты сверстаешь свою браузерку, большинство динозавров попросту вымрут.
Такс, после попытки хитрожопого решения с скрытием всех элементов управления карты через css понял, что гугл не даёт блокам этих элементов классов.
Второй вариант, похоже - включаться в сложную систему гугла и пилить аккаунт разработчика для доступа к их апи.
Я не понял, ты загружал свг в иллюстратор, что бы изменить цвет?
Если да, то зачем? В коде же можно поменять цвет.
блин, только сейчас понял, что можно было не качать иллюстратор, а открыть файлик в сублайме, поменять цвет и сохранить уже под новым именем. Ну я и дурак.
Оффтопну мальца: гигбрейнс высрали новый курс по тестировке. Последняя "темная" лошадка околоайтишной сферы официально зашкварена толпами дебилов, лол.
ХЫЫЫЫЫ!!! А курсы по микропроцессорам у них уже есть?
Не, для этого же нужно шарить в матане и вышку техническую желательно иметь, среднестатистический гуманитарий не осилит.
Да ладно. Там же прост жаба?
Насколько я знаю, там Сишечка. Ну или ассемблеры.
Ну кароч есть еще айти-форпосты, которые стойко держат оборону перед натиском гигбрейнс.
Вот первая ссылка в гугле, например:
https://habrahabr.ru/company/efo/blog/303350/
Лично я даже не рискнул вникать.
Вангую, что через полгодика они захуярят курсы по реакту/второму ангулару/чему-нибудь еще.
Надо успевать, анон. Пока еще не поздно.
Толку с этих курсов? Не у всех есть чугунный зад и прочие предрасположенности к этой профессии. Не у всех есть банально усердие и методичность. Ответственность в конце концов, аккуратность и все в этом духе. Так что пущай хуярят.
Бамп
Да, эта секция должна быть на весь экран. Можешь использовать height: 100vh и background-size: cover;
Но кажется лучше это на JS запилить, так как vh не очень хорошо поддерживается.
Двачую этого
Как минимум усилением нагрузки на эйчаров потенциальных работодателей. Сейчас "выпускники" тыкают в резюме "знаю адаптивность, свг, лесс/галп, жиквери))", а будут еще и реакт приписывать.
Это модный дизайн. min-height: 100vh в помощь. А еще флексы. Размеры задавай по макету, ничего страшного, что не влезает. А вообще от верстки таких макетов толку особого нет, если только ты не собираешься самостоятельно JS-интерактив писать для тренировки.
Такс, аноны. Я вот разбираюсь с созданием гугл-карт без элементов управления и всё не могу понять, как нахаляву получить ключ к google maps API. Возможно ли это? Кто-нибудь решал эту проблему? или я вообще не по тому пути иду?
Анон, так ты делай по размерам макета. Что значит, "всё такое огромное"? В макете какого она размера точно в пикселях? Вот и сделай такую. А потом уже, если это адаптив, то уменьшай по обстановке.
>Ребзя, поздравьте меня защитился сегодня в институте!
>N-день-кун, поздравляю, дальше пойдёт по накатанной.
Поздравляю, анон, это здорово! Спасибо тебе за поздравления тоже. А я ЕГЭ в этом году сдавал тянка верещит, чтобы я поступал на заочку , но, чувствую, хуёво сдал математику и физику, хотя русский сдал на 73, поготовившись всего неделю, лол.
В студии пиздец творится. Кодер опять ебанул бутстрап на мою вёрстку, ебанул Woocommerce, перемешал все стили, всё поехало. Я выкатил руководству нехилый такой список того, как можно организовать и оптимизировать работу, потому что, реально, творится хуйня какая-то, а не налаженный рабочий процесс. Ну они посмотрели, сказали, всё классно, карты тебе в руки, если реализуешь, можешь ебашить как проект-менеджер, а версталу ещё одного мы наймём.
Вот, короче, буду на выходных этим делом заниматься.
Алсо, по баблу, вроде, ничего так выходит. Трёшку мне задолжавший заказчик вернул, ещё штуку сегодня поднял, сверстав хуйню за джва часа и, думаю, сейчас сдам проектик на 4К. Плюс ещё з.п., которую ждал сегодня, но, видимо, уже будет на следующей неделе.
Так что, друзья, не унывайте, если ваша жизнь идёт по синусоиде. В какой-то момент всё может OCHE хуёво, но всегда после этого наступает улучшение и профит. Ебашьте флексы, собирайте спрайты, посылайте неадекватных заказчиков прямо в лицо, ТОЛЬКО ФРОНТ-ЕНД, ТОЛЬКО ХАРДКОР.
Ананы, сижу тыкаюсь, не могу понять почему свойсво list-style-image не работает для списка. Не работает только в определеном файле. Может это быть из за того что применяю reset(сброс все настроек)?
Добра анон, молодца.
Попробую вписаться на какой-нибудь фл.ру пока что. А то уже жрать нечего, а я все надрачиваю, сначала думал: ну JS осилю и начну искать работу. Сейчас думаю: ну реакт осилю и начну искать работу.
бамп вопросу.
Да блять это из за reseta. Как его отменить для определеного тега?
Никак, ручками прописывать. Нахуй ты этого динозавра вообще используешь? Даже нормалайз особо не нужен.
А фл хоть есть заказы на верстку? Ну там html, css?
Ресет же от дьявола.
О, спасибо! Со мной заговорили! А что имено прописать надо, анончик? Как разрешить применение?
Большое спасибо, анончики! Просто было подозрение, что как-то оно слишком большое, но видимо это я просто за своим микроскопическим монитором с искаженным восприятием сижу.
Не знаю, я даже не смотрел. Портфолио на выходных забацаю, буду уже искать, что и где есть.
Ресет сбрасывает вообще все, в т.ч. и дефолтный лист-стайл. Соответственно, надо смотреть и прописывать. Никогда сам лично ресет не использовал. Проще его нахер удалить и воспользоваться нормалайзом.
Вот нашел, например:
... ol, ul, li ... {
vertical-align: baseline;
font-family: inherit;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
outline: 0;
padding: 0;
margin: 0;
border: 0;
}
ul {
list-style: none;
}
Макет уже практически сверстан. Прийдется все переделывать.
Заглянул в ресе, там есть строка list-style: none. А вот как ее включить хуй его знает.
>буду уже искать, что и где есть
Чует моя жопа, нихуя там работы нет. Один битрикс, да задачи с которыми справиться только студиям под силу.
вечер в хату, двощ
Тут такая постанова - изучаю JS на learn.javascript.ru, дошел до замыканий и не могу в них въехать. Вопрос: стоит ли задрачивать их до талого, или лучше пропустить, а потом вернуться? Заодно буду рад анонам, которые смогут объяснить эту тему на пальцах
Тут такая постанова - изучаю JS на learn.javascript.ru, дошел до замыканий и не могу в них въехать. Вопрос: стоит ли задрачивать их до талого, или лучше пропустить, а потом вернуться? Заодно буду рад анонам, которые смогут объяснить эту тему на пальцах
Удалить эту страку, очевидно же.
> нихуя там
Ну, посмотрим. Я пока даже не задумывался особо.
Ну там просто удали в ресет файле эту строку.
Продвинутый html интенсив от академии. Там очень хорошо обьяснили что такое замыкания и для чего они нужны.
7 урок, 28:20 если что.
Замыкание это свойсто языка использовать переменные находящиеся из внешней области видимости. Что тут понимать.
С практической точки зрения: ты определяешь переменную во внешней функции, но можешь её использовать во внутренней функции.
Разобрался. В начале всех своих изыканий я получил ключ, даже схоронил его, но так и не понял, зачем он нужен. В итоге гугл не давал мне создать новый, так как он у меня уже был.
И всё-таки, опять она не хочет работать так, как хочу я. Анон, почему консоль выдаёт мне вот такие ошибки?
main.js:8 Uncaught TypeError: document.getElementByTagName is not a function
main.js:8 Uncaught TypeError: document.getElementByClassName is not a function
Только когда использую айди (а я не хочу этого делать) всё работает как положено.
Гуглить не пробовал? Там подсказка.
Олсо, эти методы возвращают коллекцию элементов, которые тебе надо как-то перебрать.
Замыкание - если коротко это функция в функции. По факту все твои функции это замыкания в объекте window
Так до конца и не понял, но взял на вооружение - с яваскриптом использовать только айдишники.
Сними эту мысль с вооружения и пиздуй читать Кантора. querySelector в помощь
Хотя только что, взглянув на код, всё понял.
1. Присваиваем значение функции левой переменной. Теперь эта переменная содержит массив (в моём случае из одного элемента).
2. Затем присваиваем тому, чему я хотел присвоить результат вывода функции изначально, присваиваем нулевой элемент этого массива.
Вот примерный код: http://codepen.io/anon/pen/mERmQr?editors=0010
Строку удалил, но один хуй не работать. Ебись оно конем, прийдеться делать через бакграунд. Хуй я больше буду применять reset, воистину пока себе ноги не поотсреливаешь, хуй поверишь что ружье стрелает. Пизда.
Нахуй этого кантора. Может он и спец, но учебник его гавно полное. После типов данных можно смело бросать. Про замыкания, прототипы и всю эту лабуду Head First заткнула Кантора за пояс.
Пожалуй, пора спать.
Кстати, аноны, кто-нибудь осиливал убрать и это?
В документации вроде инфы по этому нет, да и по логике, убираться это не должно, копирайты как-никак.
Кстати, аноны, кто-нибудь осиливал убрать и это?
В документации вроде инфы по этому нет, да и по логике, убираться это не должно, копирайты как-никак.
Хай гайс, сижу тут уже достаточно давно и складывается впечатление, что я тут один унтерменш без знания английского. Читаю тред и жопа горит после каждой сылки на английский ресурс. Сейчас досмотрел базовый, думал дальше сам поосваивать всякие инструменты, но вся блядская документация на инглыше. Видимо пойду смотреть продвинутый. Или сразу идти нахуй с такими скилами?
Учи инглиш. Без вариантов.
Мало кто владеет инглишом в совершенстве, но чтобы читать доки, это и не нужно. Гугл транслейт тебе в помощь.
недавно вот проходил курс по гиту, так там вообще почти читать не надо было, всё было понятно по коду.
Гугл транслейт кривой же, половину терминов переводит в абсолютно не том значении или это я чего-то не догоняю
Всё таки пиздец в верстке много мелочей. Да, работа не шибко высоко-интеллектуальная, но знать нужно много всего. Смотришь на какого нибудь Першина и думаешь "ебать как элементарно", начинаешь сам и гуглишь каждую деталь по пол часа.
Параллельно выучишь. Загляни в тред английского в /fl, там в шапке есть инфа с ресурсами для обучения.
>> не шибко высоко-интеллектуальная
>> но знать нужно много всего
Что тогда сказать про программирование? Или про администрирование баз данных?
Фигня это все.
А ты думал, в сказку попал?
Почему когда я тестю респонсив в браузере (типа Ctrl+Shift+M в мозилле, например) меняя ширину экрана, то все норм, а если меняю ширину самого окна браузера, то верстка в каком-то диапазоне пикселей по ширине ломается? Это норма?
Ну да, на Ctrl+Shift+M в мозилле просто популярные разрешения экранов, а ломается верстка на промежуточных разрешениях
Аноны, напомните, какой символ нужно добавить в конце к селектору icon чтобы в итоге он сработал и для классов icon--facebook, icon--twitter и icon-youtube?
Разобрался.
Нашёл баг в scss.
Символ &, написанный после того, как был использован селектор вида [class^='hotel-form__input'] , не работает.
Там не просто популярные, там справа есть ползунок, за который тянешь и все меняется плавно, как если бы ширину окна изменял. Но там такого не происходит.
Программирование больше подчинено законам логики, а не знанию того как кружочек правильно нарисовать, что бы во всех браузерах норм выглядел.
Анон, а можно ли задать псевдокласс hover псевдоэлементу? Пытаюсь вот сделать, не получается.
a:hover:before
В такой последовательности попробуй
В такой последовательности заработало, в другой - нет, а нужно именно в другой :(
Анон, если не так, то как создать плюсы, минус и календарики на пикрелейтеде? Абсолютно спозиционированными дочерними элементами label'ов?
Ессно отдельными элементами. Это ж не декорации. Календарик, насколько я понимаю, должен разворачиваться по клику.
Как ты его или плюсики/минусики таргетить будешь, если они псевдоэлементами сделаны?
Псевдоэлементы джаваскрипт пока что ловить не умеет.
>Как минимум усилением нагрузки на эйчаров потенциальных работодателей. Сейчас "выпускники" тыкают в резюме "знаю адаптивность, свг, лесс/галп, жиквери))", а будут еще и реакт приписывать.
Тыкают-то тыкают, но кто реально все это знает и умеет применять?
Все думают, что если ты посмотрел видео на полтора часа в интернете и тупо перепечатал код себе в редактор, то уже умеешь инструментом пользоваться.
Другое дело придти на работу и разобраться в готовом уже проекте, как там там все устроено, еще происходит интернационализация, вникнуть что часть страницы генерится в gulp, часть берется из документации, что-то компонентами через mustashe.
Повторюсь, если ты сверстал барбершоп и настроил автоматизацию по гайду, это нихуя не значит, что ты шаришь. Максимум, конечно, можешь галочку ткнуть, но по сути ты нихуя не умеешь и жопу тебе порвет на первом же тикете в жире.
Да и с гитом охуеешь сколько заморочек на самом деле - это тебе не пушить в мастер-ветку на свой аккаунт. Это если ты запушишь куда-нибудь не туда, тебе придется просить тимлида, чтобы он разбирался. А у тимлида итак головняка много и ходить тебе попу подтирать ему не очень хочется.
Это я пишу как отработавший неделю джун, вынужденный ежедневно зашивать свой пердак от сложностей реальной работы. Но вообще мне пока все нравится.
Ясно. Спасибо.
Запили на календарики JQuery Datapicker и застилизуй его под Седону.
Парни, кто-нибудь копался в стартовом проекте Громова, который у него на гитхабе? Я ставлю эту херь, она ровно 2 раза нормально работает, а потом начинает крашится, да так, что я вообще не могу понять в чем дело. им кто-нибудь пытался пользоваться/настраивать под себя? Это имеет смысл?
Нахуя? Делай как тебе удобно, настраивай все под себя.
Спсибо. Взял на заметку.
Ну, я примерно так и делал, но подумал что с чужой сборкой тоже поезно поиграться.
Закончил верстать седону, решил минифицировать файлы, но сломались скрипты. Как я понял, галп поменял имена переменных, и где-то он поменял их так, что вышла ошибка. Кто сталкивался с такой проблемой? Как можно её решить?
F12
Как такое в продакшн проскакивает?
Не все же такие виртуозные верстальщики, как ты.
Ура, доверстал статичную седону. Можете глянуть на мои труды. Сейчас буду думать, как всё то говно, что я написал, сделать адаптивным.
http://frollodecol.github.io/sedona/dist/index.html
алсо, как пофиксить то, что при наведении изображения, пока подгружаются, мигают? Как загружать их все?
Все похуй на недоязыки, очевидно.
https://github.com/frollodecol/frollodecol.github.io/tree/master/sedona
вот исходники, если кому интересно.
Уволен.
Имхо для лучшей юзабилити нужно, чтобы кнопки +/- были блочными.
Поясню, гораздо удобнее кликать по блоку, чем пытаться попасть на сам знак + и уж тем более на -.
Сорян, в глаза долблюсь, они итак блочные. Ну сделай их шире, вощем. Бухой я, поэтому сумбурно
>+/- должны быть блочными
всмысле? Там у меня и так блоки, 30 пикселей в высоту и 10 в ширину (если бы сделал в ширину больше, свгшная картинка бы растянулась.)
Алсо, возник вопрос, существуют ли плагины, преобразующие вставленные как файлы cduirb в код?
>cduirb
свгшки
ты бы и за щеку взял
>Алсо, возник вопрос, существуют ли плагины, преобразующие вставленные как файлы свг в код?
Не понял, ты что не склеиваешь все свг файлы в один свг спрайт?
>ты что, не склеиваешь все svg-файлы в один спрайт?
так можно? А как же масштабирование? Не возникнет проблем при создании фона?
Я имею в виду, что, допустим, запилю я огромный большой svg-спрайт и потом запилю его фоном. Там же не получится отловить картинку, браузер просто сделает фон из всего спрайта и порежет его размеры.
Это работает не так как растровый спрайт. Тут ты указываешь путь к сфг файлу и заодно ID нужной тебе картинки. Профит от этого способа - 1 запрос на сервер, так как 1 файл. ВОзможность изменять цвет, размеры в css. И кэшширование.
Здорово. Дай пожалуйста ссылку на гайд и на плагин, просто насколько я помню, в продвинутом этого не было.
Алсо вот пример.
img/svg.svg - сам свг спрайт
#apple-logo - id нужной нам картинки в этом спрайте.
Ты неправильно сделал + -.
Нахуя ты их сделал через <i> и прицепил позиционирование к лейблу? Это максимум уебищно. Они должны быть сделаны через ссылки.
Грубо говоря, это два квадрата внутри или снаружи дива с цифрой-количеством.
>Алсо, возник вопрос, существуют ли плагины, преобразующие вставленные как файлы cduirb в код?
Какие плагины, ты о чем? Если тебе нужен код свг-шки, просто перетаскивай ее в редактор драг'энд'дропом и вставляй этот код в хтмл.
>Дай пожалуйста ссылку на гайд и на плагин, просто насколько я помню, в продвинутом этого не было.
Парень, 90% работы фронт-энд разработчика - поиск в гугле готовых решений. Поэтому учись делать это уже сейчас.
Уфф, сегодня сетки буду проходить. 32 задания на академии говорят, что будет жарко.
Вроде вебинар посмотрел четвертый по сеткам, а все равно стремно.
Господам, которые сейчас трахаются с галпами и джс, наверное, мои ньюфажеские терзания покажутся смешными. Лол.
Вроде вебинар посмотрел четвертый по сеткам, а все равно стремно.
Господам, которые сейчас трахаются с галпами и джс, наверное, мои ньюфажеские терзания покажутся смешными. Лол.
>вставляй в html
А если фон задать при помощи svg-кода? Возможно ли вообще это?
Нет, так не получится. Только если вручную править свг в редакторе, если тебе допустим какую-то часть не надо. Потом снова сохраняешь как новый свг и вставляешь фоном.
Ясно. Получается, если кнопочки я делаю при помощи svg, их стоит делать, используя теги img, да?
https://www.youtube.com/watch?v=kBgHdSOj33A&t=0s
Хороший доклад про БЕМ, объясняют лучше Першинов всяких
Аноны, делюсь хаком, может кому пригодится. Многие думаю знают, что background-size: cover и background-attachment: fixed не дружат друг с другом и когда их используешь вместе, то все стремно выглядит и ведет себя не так, как ожидается.
Долго гуглил на эту тему, но так и не нашел нормального решения, пока не включил СМЕКАЛОЧКУ и сам до него не допер. Делается все так: для блока с фоновым изображением добавляем враппер и прописываем ему абсолютное позиционирование, а так же clip: rect(auto, auto, auto, auto). А самому блоку с изображением прописываем фиксированное позиционирование. Все, background-attachment: fixed писать не надо. Работает заебись, правда подводный камень в том, что clip считается устаревшим и возможно его выпилят когда-нибудь. Но пока пользоваться можно.
Долго гуглил на эту тему, но так и не нашел нормального решения, пока не включил СМЕКАЛОЧКУ и сам до него не допер. Делается все так: для блока с фоновым изображением добавляем враппер и прописываем ему абсолютное позиционирование, а так же clip: rect(auto, auto, auto, auto). А самому блоку с изображением прописываем фиксированное позиционирование. Все, background-attachment: fixed писать не надо. Работает заебись, правда подводный камень в том, что clip считается устаревшим и возможно его выпилят когда-нибудь. Но пока пользоваться можно.
Не знаю что там за кнопочки у тебя, я не экстрасенс.
Лучше бы ты вместо обьяснений кинуд ссыль с кодом на codepen
Что это за адовые костыли, нахуя это надо?
>я делаю при помощи svg
мне кажется, что ты что-то не то делаешь
Лень заморачиваться, если честно.
Чтобы можно было использовать parallax с такой охуенной штукой, как background-size: cover. Частенько может пригодится для всяких баннеров.
Вот такие, например.
Это же иконочный шрифт простой, свг тут вообще не нужен.
Неплохо, но меня честно заебывает много hover псевдокласса на кнопках еще ладно, но на формах нахуя. Ну пиздец, все мигает в глазах рябит. На форме можно просто оставить :focus,
Еще там где + и - рядом с кнопками курсор меняет вид на "ввод", тоже как-то неочень. Т.е визуально кнопки вроде бы большие но по факту - маленькие. Сделай эти элементы блочно-строчными и укажи размеры.
Бля, анон раньше меня заметил. Тем более знак автору все переделать.
Да он вообще наеебенил там, посмотри в коде. Он их спозиционировал абсолютно относительно лейбла.
Да я уже тогда знал. Но если я даже закину поле в див, то потом позиционировать придётся просто относительно этого дива, точно так же абсолютно, цифры просто другие будут. Но вообще да, там очень много всего надо переделать.
Пиздец я уже поехал со своим ПЕРФЕКЦИОНИЗМОМ. Как ебанутый смотрю разные доклады, гуглю, что бы узнать как какая-то мелочь делается идеально. Потом уже нахожу, что даже чуваки из гугла в это не сразу врубились, похуй, всё равно нужно сделать идеально. Подозреваю у себя ОКР, лол.
Хорошо тебе. В мне лень переделывать в своей седоне иконки на иконочные шрифты, чтоб не мигали, и вместо этого я тупо подключил костыль - блок с множественным фоном из всех картинок проекта.
Много куда надо дописать cursor:pointer
Либо убрать всякие подсветки от ховеров если они не нужны (например на главных иконках по середине)
Алсо где адаптив? Без адаптива это все оторвано от реальности пиздец
>убрать подсветки у ховеров
Делал как в стайлгайде.
>где адаптив
поборю прокрастринацию и сделаю.
Во, заодно и расскажешь как пиздато работать desktop first методом
а то в прошлом треде были кудахтанья что он НИНУЖИН
Это какой-то пиздец, чувак.
23 ебаных запроса, когда всё это можно реализовать одним, с помощью свг спрайта. Да и не нужно дублировать картинку, изменяя только ее цвет. Все это меняется через css.
Я знаю, что нужно переделать и запилить иконки иконочным шрифтом. Но я ленивая мразь. Сам не знаю, как с этим бороться.
Нахуя? Откуда ты брал эти свг файлы? Из макета?
Если да, то кто мешает тебе собрать свг спрайт?
Разве свг спрайт можно нормально добавлять в фон элемента?
Иногда требуются перфекционисты кстати, видел в вакансиях pixel perfect.
Но вообще делается обычно хуяк-хуяк и в продакшн. Я как-то тимлиду говорю: "здесь вообще хуйня, хорошо бы все это отрефакторить", он такой: "хуевый ответ, давай накостыли тут, чтобы работало и побыстрее".
Ну хуй знает, на самом деле, стоит ли ковыряться во всем этом говне. Я седону адаптивную наговнокодил и забил, поправил только совсем уж уебанские костыли. Все равно этот макет даже стыдно кому-либо показывать, у каждого первого он в "портфолио", лол. Потом наверстал более симпатичные макетики на флексах и прочих йобах и уже окончательно забил на верстку.
мимо пердолюсь с реактом
тоже думаю так сделать. Запилил вот худо-бедно планшетную версию, даже с мобильной заморачиваться неохота.
Да многие этот пиксель перфект пишут только потому, что услышали где-то. На самом деле всем похуй.
>мимо пердолюсь с реактом
Как успехи? В ES6 синтаксисе надеюсь?
Ужасно, если честно. Да, осваиваю ЕС6 и реакт одновременно. После ваниллы очень непривычно, совсем другой уровень мышления нужен, хех.
Думаю еще потом сразу ноду зацепить, уж очень интересно стало.
Первые твои проекты в 95% случаев будут почти полностью состоять из верстки. Если заказчик в адеквате, то он попросит полный адаптив. И не просто адаптив типа, вот эта хуйня не влезает, править лень, уберу нахуй.
А полноценный адаптив, когда каждый элемент видоизменяется на разных разрешениях, вплоть до полной транформации всей структуры. Плюс вся страница должна без перезагрузки при любом ресайзе втч мобильном ресайзе, идеально подстраиваться.
У меня даже с хорошими навыками на разработку первых проектов ушло на процентов 40 больше времени чем планировалось. Оно ессно не оплачивается, потому что цену ты называешь сразу, исходя из личной оценки.
Так что ты хорошенько подумай, действительно ли тебе лень. Чтобы потом бесплатно с горящей жопой не править кучу косяков.
Вангую что не разбираясь в базе и мвисишках прыгнул на такую высокоуровневую йобу как реакт, вот и сложности появились.
Какой уровень в нативе? Успел написать мелкую спа?
>Все равно этот макет даже стыдно кому-либо показывать
Потому не сверстал ни одного макета от академии, лол. Нет ни малейшего желания притрагиваться к этому говну как будто из 90-х годов.
Ну мвс мне знаком еще с пэхапэ, а так я поковырял модульность, коммонджс вот это вот все. СПА не писал, только собственные велосипеды уровня стики хедера и слайдера. Хотел еще поуглубляться, но мне тут посоветовали сразу в реакт. Я и подумал: "а почему бы и нет?"
Мне нравится, просто пока путаюсь вот в этих вот компонентДидМаунт, компонентШудАнмаунт и прочем. А ЕС6 охуенен, никаких тебе var _that = this и прочей ереси.
Вот как-то так вышла планшетная версия. Пытался поколдовать, но в инструментах разработчика с мобильными устройствами работает весьма херово.
http://frollodecol.github.io/sedona/dist/index.html
https://github.com/frollodecol/frollodecol.github.io/tree/master/sedona - исходники
http://frollodecol.github.io/sedona/dist/index.html
https://github.com/frollodecol/frollodecol.github.io/tree/master/sedona - исходники
Про flux уже в курсе?
Только теоретически, я меньше недели сижу.
А зачем ты контейнеру прописал одновременно width и max-width? Текст выезжает, кстати.
Вообще то, что ты сделал можно и без медиа-запросов оформить. Вернее даже нужно, у тебя сейчас фактически простая резина, только без резиновости.
Господа, сегодня в 20:00 по Москве мы планируем соорудить некий воркшоп по React.js. Будем собирать калькулятор.
Запиливаем стрим по адресу https://www.livecoding.tv/webtalks/
Используемые инструменты:
Node.js
npm
React.js
Обсуждаем jsx, CSS модули, синтаксис ES6. Рассматриваем зависимости и структуру директорий проекта.
Подойдёт для начинающих.
Запиливаем стрим по адресу https://www.livecoding.tv/webtalks/
Используемые инструменты:
Node.js
npm
React.js
Обсуждаем jsx, CSS модули, синтаксис ES6. Рассматриваем зависимости и структуру директорий проекта.
Подойдёт для начинающих.
Анон, подскажи, как стать top-tier во фронтенде? Вкатился пол-года назад, осилил базовую верстку, jquery и реакт с экосистемой, написал пару приложений. Но нету чувства собственной охуенности. Куда идти дальше, где брать вау-эффекты? Смотрю в сторону d3, что еще? Думаю, что смог бы закодить любое говно, но подводит чувство прекрасного. Неужели надо вкатываться параллельно в дезигн?
мимовоннаби фуллстек
мимовоннаби фуллстек
Спасиб, анон, переделал.
Кстати, как раз сейчас всплыла хуёвость той идеи с абсолютным позиционированием управляющих иконок относительно label'a. Завтра подправлю это, да и доведу таки хоть что-то в своей жизни до ума и запилю мобильную версию. Всем спокойной ночи.
По секрету скажу, у тебя никогда не будет этого чувства. И это хорошо на самом деле.
Бля, неужели тред настолько популярен, что тут даже webtalks всякий рекламируют?
>тред каждые два дня стабильно уходит в бамплимит
>неужели тред настолько популярен?
У нас работает пара сеньеров. Но им всем под 30+ лет, у одного образование какое-то там забугорное.
Ага, еще у видосов по фронту по 100+к просмотров на ютубе. Короче, пизда профессии.
Серьёзно? Бля, надо выкатываться и идти на стройку.
У вас там что-то непонятное происходит.
Да ладно, шучу я, профессия резиновая, влезут все. Хотя ладно, не будем начинать этот срач, который начинается в каждом втором треде, он уже всех заебал.
Иди нахуй. Мы на дваче.
Кто-то смотрит? У меня постоянно прерывается.
Да походу интернет броадкастера не тянет сотни тысяч набежавших анонов, опромечтиво он сюда ссылочку вбросил, лол.
Сейчас уже нормально всё.
Прежде чем поступать в институт хорошо подумай о направлении.
>Кодер опять ебанул бутстрап на мою вёрстку, ебанул Woocommerce, перемешал все стили, всё поехало
Какой-то он ебанутый у тебя там.
Скажи, на нашей бирже или зарубежной видишь? Когда скатился туда и с чем?
>сидишь
фикс
Четыре часа проходил "Сетки", думать сегодня больше не хочу.
Такое ощущение, что там костыль на костыле.
Утешьте меня, скажите, что флексы логичнее, чем флоаты.
Такое ощущение, что там костыль на костыле.
Утешьте меня, скажите, что флексы логичнее, чем флоаты.
Ниет. Флексы сложнее. Но в чем-то логичнее да.
Ваш стрим полностью иллюстрирует то, как я сам пердолился с вебпаком и сборщиками (дольше, чем с самим реактом), лол.
Олсо, поясните, почему вы именно так запускаете? Неудобно жи, я через вебпак-дев-сервер запускал.
Флексы обширнее, по-началу непривычно.
>Так что, друзья, не унывайте, если ваша жизнь идёт по синусоиде. В какой-то момент всё может OCHE хуёво, но всегда после этого наступает улучшение и профит. Ебашьте флексы, собирайте спрайты, посылайте неадекватных заказчиков прямо в лицо, ТОЛЬКО ФРОНТ-ЕНД, ТОЛЬКО ХАРДКОР.
Бро, у меня все очень хуево в жизни, вот недавно вкатился на работу фронтом-джуном. Но чувствую, что пиздец как сложно идет, нет какой-то предрасположенности у меня к программированью, что ли. А фронт-енд по большей части из него и состоит.
Я много учусь, но иногда хочется просто заплакать и бросить это дело, иногда прямо на работе.
Может у кого найдется для меня совет?
Как ты попал на работу фронтом-джуном, если тебе это не нравится?
Там же надо перед этим несколько месяцев учить всё это.
Брось и займись тем, на что стоит. Серьёзно. Ты только тратишь своё время, когда мог бы реализовываться в сфере, которая тебе более приятна.
>флексы сложнее
не, флексы легче. И гораздо охуеннее.
Нет. Во многих конторах берут тех, кто может сделать самые элементарные вещи.
мимо брали на работу джуном, но я забил
Бле, чет даже пригорело. Я много что не понял из курса "Сетки", в частности обсирался с испытаниями, на одно из трех вообще скопипастил решение.
И это при том, что я вебинар уже посмотрел, где все это разжевывали.
Ну ключевые понятия запомнил вроде распорки, псевдораспорки, клирфикса, центровщика и прочее.
Но ощущаю себя тупым. Это нормально?
И это при том, что я вебинар уже посмотрел, где все это разжевывали.
Ну ключевые понятия запомнил вроде распорки, псевдораспорки, клирфикса, центровщика и прочее.
Но ощущаю себя тупым. Это нормально?
Если таки доделаете, вбросьте ссыль на репо в тредик, пожалуйста, интересно посмотреть. А то лагающий лайвкодинг у меня вызывает приступы ярости, пойду лучше свой кулькулятор пока писать.
Нормально. Или ты хотел за день-два освоить основы (а это именно сновы)? Сверстаешь свой собственный кривой барбершоп - все станет ясно.
Мне это не то чтобы не нравится. Мне нравится визуальная часть, нравится верстать, очень люблю когда из кода появляется живая и красивая страничка. Но вот когда я вижу огромный проект и кучу непонятного кода в нем, мне дико становится грустно, что я ничего не понимаю в этом.
Я 6 лет на образование потратил, но так и не получил его. Я знаю, что это не мое, но хотел просто получить эту сраную бумажку и заниматься уже чем хочется.
Ну и так все хуево очень - ни друзей, нихуя нет. Еще куча проблем со здоровьем и долги по деньгам.
В общем, тред ни для того, чтобы здесь сопли распусктаь. Но просто я за фронт держался как за ниточку последнюю и горько будет, если она оборвется.
А почему бы и не уйти в вебдезигнеры+верстальщики? Конкуренция там, конечно, вообще пиздецовая, но если тебе нравится и есть способности...
Аноны, сколько времени мне надо потратить на учебу чтоб начать получать хотя бы 15к?
http://codepen.io/anon/pen/xOgWmE?editors=0010
Аноны, функция, присвоенная событию window.onload и window.onresize, срабатывает только один раз. При этом, когда я присваиваю им анонимные функции, всё работает нормально. Что я сделал не так?
Аноны, функция, присвоенная событию window.onload и window.onresize, срабатывает только один раз. При этом, когда я присваиваю им анонимные функции, всё работает нормально. Что я сделал не так?
От тебя зависит. Можно и за пару недель освоить и пойти фрилансить через знакомых или даже на апворке, если знание языка позволяет. А можно как я, второй месяц барбершоп с седоной верстать.
Да хуй знает, куда уже идти. Мне 23 года уже, начинать с нуля учить что-то некогда особо. Деньги нужны, чтобы жить, чтобы здоровье поправить (зубы), чтобы комнату снимать.
Вся эта мантра про "занимайся что тебе вставляет" работает если ты живешь в развитой стране с высоким уровнем жизни.
Вот я в школе сочинения по литературе охуенно писал и учительница меня хвалила постоянно и говорила, что у меня талант.
А потом меня батя с мамкой на матфак засунули и все пошло хуево.
А куда с литературой сунешься? В журношлюхи разве что или копирайтеры. А я копирайтил немного, никакого творчества там нет это вообще пиздец какой-то.
Вообще хочется взять с собой что есть нихуя и уебать куда-нибудь на край света, подальше от всех.
Да что-то мне кажется даже если я по 14 часов в сутки буду учить хуй что за 2 недели получится. Там же еще и опыт надо набрать где-то, нельзя ж фрилансить только выучив теорию =/
Присвоил функцию без аргументов и всё заработало. Но так как-то неинтересно. Хочется с аргументами. Это возможно малой кровью, или стоит смириться?
Господа, не хочу никого оскорбить или обидеть - но вы бы не могли с психологическими проблемами идти в пси? Тут тред все же не про это.
Вряд ли у тебя получится по 14 часов в день, тут нужна просто колоссальная сила воли. Даже я, не учась, не работая и сидя на шее у мамки в свои 19 лет, неторопливо верстаю ну максимум по паре часов в день, а остальное время страдаю фигнёй.
Зачем тебе таймаут там?
Насколько плохая идея упороться по-хардкору и поставить линух, если я типичный виндузятник? В шинде жуткий пиздец с командной строкой, ни с гитом нормально не поработать, ни с директориями.
Хороший вопрос. При раскрытии окна на всю ширину без таймаута размеры не успевают измениться.
cmder тебе в помощь. Фронт-ендеру лучше работать с виндой.
Лучше с макос.
Всмысле при разворачивании окна.
А что, мак ось свободно лежит на торрентах и спокойно устанавливается на любую пеку?
Серьезному фронтендеру не грех вложиться в покупку мак мини, так как в итоге получится стабильная система с фотошопом и всеми плюсами командной строки линукса, даже лучше, потому что zsh так то поудобней баша для разработчика.
>Серьёзному фронт-ендеру
>Этот тред
На виртуалку поставь погонять
понимаю, что ты прав, но проще не становится
что сказать-то хотел?
двачну. И пхпштром кстати.
да на тот-же атом можно годную консольку прикрепить.
>что сказать-то хотел?
Что топ-тиром ты станешь только спустя n-лет работы. По-другому никак.
Ты просто никогда не пытался разобраться в готовых хардкорных проектах, где разметка в том числе может идти через пыху. А пхпшторм это мощнейший инструмент в котором все есть изкаробки.
Недавно начал заниматься версткой. Собственно, верстаю макет, с помощью бутстрапа. но вот незадача.
2 блока стало на место, как и текст в оных, а с 2 другими что-то невнятное. vertical-align не помогает, как и text-align
В документации по бутстрапу ничего по сабжу нет
Варианты решения
1.Для каждого изображения задать фиксированную ширину\высоту, дабы не было таких съездов
2. ??
Так же проблема с позиционированием вот этой полосочки.
По сути, она должна находится по середине, именно полоска, а не ее начало.
Т.е margin 50% не прокатывает.
Display: inline (inline-block) Тоже не прокатывает.
Text-align:center тоже не прокатывает.
Как решил проблему?
На глаз стал подбирать ширину, вышло около 46-47%(маргин-а). Но вот так вышло, что при сжатии, она совершенно идет по пизде и не соотносится с текстом.
Я ньюфаг, все через костыли, но все же. хотелось бы получить ответ от опытного верстальщик-куна как бы он эту проблему решил.
2 скрин,как это все смотрится в общем.
По сути, она должна находится по середине, именно полоска, а не ее начало.
Т.е margin 50% не прокатывает.
Display: inline (inline-block) Тоже не прокатывает.
Text-align:center тоже не прокатывает.
Как решил проблему?
На глаз стал подбирать ширину, вышло около 46-47%(маргин-а). Но вот так вышло, что при сжатии, она совершенно идет по пизде и не соотносится с текстом.
Я ньюфаг, все через костыли, но все же. хотелось бы получить ответ от опытного верстальщик-куна как бы он эту проблему решил.
2 скрин,как это все смотрится в общем.
Так тебе вряд ли кто-то поможет, когда спрашивают такие вопросы обычно к ним прикладывают свой код на сайтах вроде https://jsfiddle.net/
Я же с бутстрапом верстаю, а не на чистом html\css , jsфидл не одобряет
https://jsfiddle.net/y4azc5s0/
Потому что надо юзать православный кодепен.
Пиздец. Ты хоть базовый ннтенсив смотрел? Какой в жопу бутстрап, если ты нихуя не шаришь.
http://codepen.io/anon/pen/WxRJrq?editors=1100
Посмотрел, добрую половину я и так знал.
:after значит? Спасибо.
Собственно , разобрался. Макет кривой и картинки не 1 размера, соотв. надо каждую картинку подгонять к 1 ширине и к 1 высоте, иили подгонять под каждую отступы для текста.
Поэтому дело в картинках.
Там дальше какие то круги будут, посмотрел, они хотя бы одинаковы.
Как-то так я решил все это дело, изи
Хватит сопли на кулак наматывать.
В африке вон кроки вообще без интернета сидят, спидами болеют и пухнут с голодухи. А у тебя есть компьютер, мозг две руки и ноги. Зубы можешь вылечить бесплатно, а что не лечится - выдерни, вставишь потом. Для карьеры фронтэнд-погромиста тебе не нужно 32 зуба. Инфантильный ты вообще какой-то. Уходи
За целый день забацал один раздел своего будущего портфолио (хедер с менюшкой). А чего добились вы?
пишу псд с гугла, осталось еще 3 колонки. Дальше быстрее пойдет, хотя, только в футере будут проблемы, ибо там ебучие формы с их ебучими дизайнами
вот как это все было
Прошел "Сетки", сейчас думаю размечать ли вторую и третью страницы барбершопа или оставить это дело + их потоки на завтра.
Наверное надо посмотреть допы по этому вебинару и повторить всю теорию на заданиях из курсов вебреф.ру
проблемы ньюфажин
Зря ты сразу бутстрап поставил, это же лютое говно, предназначенное для хуяк-хуяк и в продакшен.
Советую накидать основную разметку сегодня, без особого упарывания наименованиями и прочим, завтра светлым взглядом пофиксишь.
Я когда интенсив смотрел не размечал с ним этот гейшоп, там все просто, вот с техномартом возник затуп, ибо там реально сложно. Я тогда не знал про бутстрап, но все же, даже с ним тяжко.
Почему лютое говно? Сидеть и вручную страдать хуйней?
По моему очень удобно. Да и никто не заставляет использовать его на полную, ты всего лишь можешь сделать сетку или,скажем, кнопку какую, или пошаманить над адаптивностью
Говно потому что у тех, кто пописал вручную не возникает вопросов как изменить размер картинки
Потому что ты превратишься в бутстрапщика. Но дело твое, конечно.
Внезапный вопрос: как можно сделать прозрачный белый, который остается ярко-белым, а не сероватым говном, как если делать через ргба с прозрачностью?
как ты себе это представляешь?
Задаешь класс и меняешь, как я и сделал. Можно в %, можно в px, можно в em
Еще аргументы?
а что плохого ?
скинь пример. А то у тебя какая то белая. но не белая хуйня, но не сероватая, но белая. Не очень понял твой вопрос.
Хрен знает, поставил вебшторм, какой-то он слишком громоздкий. Переехал обратно на sublime.
бамп, продвинутые верстаны
Вырастешь - поймешь.
Мне кажется потому что setTimeout срабатывает только один раз. У тебя один раз отрабатывает функция. А потом уже не работает, несмотря на то, что ее вызывает событие onresize. Попробуй без таймаута запустить.
Годное предложение (хотя когда я с таймаутом запускаю функцию без аргументов, всё пашет), сейчас попробую.
Возможно, ты прав.
Аноны, как отлаживать ретину на обычном дисплее?
>а что плохого ?
Плохо то что бутстрапщики в итоге перестают развиваться в плане верстки, делая элементарные макеты напихивая кучу левых классов.
В итоге во первых теряются знания, любой верстала делающий все ручками по знаниях уделает бутстрапера с разгромным счетом. А именно знания чистого хтмл+ксс спрашивают на собеседовании в контору уровнем выше "Делаем сайты у Петровича".
Во вторых, что следует из первого, если будет заказ на чистую верстку, а за такие платят больше ибо там уровень и сложность повыше, то ты на нем тупо обосрешся. Потеря заказчика, денег и уважения к себе.
Если что, верстать на бутстрапе сложнее. Или, по крайней мере, неинтересней и шаблонней.
Так, справился. Создал собственное устройство с необходимыми pixelratio. Обозвал их makbook ait (1.5) и makbook pro (2.5)
мне наоборот показалось легче.
>чистую верстку.
А как нормально тогда сделать сетку? В интенсиве у него все FLOATами, что, уместно только в случае с тем же гейшопом, в том же техномарте (другой макет) это совершенно не прокатит.
Не, пилить шаблонные макеты, надрочившись, на нём конечно быстрее и проще. Но если нужен больший контроль - он уже никуда не годится.
в каких случаях нужен большой контроль?
>верстала делающий все ручками по знаниях уделает бутстрапера
сука, проиграл с этой маньки. Работодателю вообще похуй умеешь ли ты там в адаптивную верстку или нет. Для него главное бутстрап, но тебе маня я желаю удачи.
Лол. Окей. Давай поиграем с тобой в игру. Как ты думешь, сколько мне заплатили за чистую верстку одной страницы, состоящей из менюшки с дропдаунами, баннера, слайдера, двух блоков новостей и футера?
Ессно что делал я ее по БЕМу, с минимумом классов, делением на отдельные блоки со своими стилевиками, идеальная адаптивность, изменения при ресайзе етц.
От тебя требуется 2 вещи. Цена которую заплатят за такую страницу на бутстрапе, и цена которую заплатили мне.
Я не он, но все же, думаю около 5-8к рупий.
Прикол в том, что результат на бутстрапе будет такой же ( плюс минус) , но ценник хз. Искренне не понимаю, почему хотят именно чистую верстку, за пару тройку лишних килобайт платят меньше или что?
>А как нормально тогда сделать сетку? В интенсиве у него все FLOATами, что, уместно только в случае с тем же гейшопом, в том же техномарте (другой макет) это совершенно не прокатит.
Если ты задаешь такие вопросы, то советую тебе о бутстрапе забыть минимум на 2-3 месяца.
мимо
мляяяя, вот именно из-за таких петушков вроде тебя, я перестал сюда заходить. Помню послушался одного петушка вроде тебя, и в итоге обосрался потом, но сейчас у меня все шикарно, и я бы советовал не слушать подобных петушков в этом треде, как этот даун.
А еще лучше дам такой совет новичкам. Вообще не заходить сюда и учить самостоятельно без всяких подсказок. Потому что подобные петушки только подосрут вам. Вот например сейчас начал жалеть, что зашел сюда в надежде, что тут все поумнели, но я как всегда ошибся.
велком ту табличная верстка? лолкек
>Искренне не понимаю, почему хотят именно чистую верстку, за пару тройку лишних килобайт платят меньше или что?
Ты не понимаешь почему некоторые ставят в приоритет качество кода?
Качество кода? Смотри, код то 1, вопрос в другом, будет ли там 3 класса или 1. Естественно, все нормально размечено и т.д. Так код может быть качественным и с бутстрапом и без него.
Удивительная аргументация. Продолжай в том же духе.
Ты цену то назовешь или как?
При чем здесь табличная верстка?
Так о чем речь тогда?
Он говорит, мол забудь о бутстрапе. Я говорю, что с его помощью можно разметить хотя бы сетку и не переживать по лишнему поводу. Вот и все.
А трахаться с position как-то не очень
Если коротко, то любой проект больше лендинга, со сложными компонентами и претензией на реюзабельность на бутстрапе взоврвет пердак всем в проекте.
Чистая верстка в этом плане куда гибче и качественнее, особенно в умелых руках.
Если подольше, то вот тебе чтиво первая ссылка в гугле, но мне лень искать что-то еще, да и вроде мысль переданаhttps://gist.github.com/iAdramelk/d328b73c72cab92ef95f
>А трахаться с position как-то не очень.
Лол. Дружище ты видимо в сетках вообще не шаришь. А ведь это фундаментальная вещь. Мой тебе совет, подтяни тут знания и сверстай парочку макетов своими руками. Не понравиться, перелезешь на бутстрап, дело твое.
Это нужно хотя бы для того, чтобы на собесе не обосраться. Потому что спросят там тебя не о том как сделать сетку на бутстрапе, а о том как она делается стандартно. Поверь, после упоминания про табличную верстку или не дай бог position в контексте сеток, тебя выпизднут оттуда сразу по окончании.
Сука, какой же ты даун, пиздец. Бутстрап это просто набор готовых решений повседневных задач. Ты в любом случае придешь к подобным решениям, дабы сэкономить время на однотипных задачах. И я не вижу ни одной причины не использовать их, разве что у тебя свободного времени дохуя.
Посмотрел я интенсив по сеткам, он несет какую-то хуйню, везде у него float.
Ну-с, доверстаю этот говноленд на бутстрапе, дабы закончить и буду пытаться сделать чистую сетку.
>position в контексте сеток.
Вот тут немного не понял, допустим сайт содержит рандомно раскиданные блоки с информацией, как их делать тогда, кроме position ?
https://gist.github.com/iAdramelk/d328b73c72cab92ef95f
тут,кстати, написано, почему бутстрап много куда не подходит
>сайт содержит рандомно раскиданные блоки с информацией
Поясни что ты подразумеваешь под этим, лучше если со скрином.
За всю свою практику я позишн для сеток использовал только разрабатывая паралакс, ну и еще пару случаев, но то скорее даже не сетка была, а декоративное раскидывание блочков по блоку карты.
Не много куда, а лишь на небольшую часть специфичных проектов. Но бутстрап и не позиционируется как фреймворк идеальный для ВСЕГО. Понятное дело, что на каком-нибудь SPA он нахуй не нужен, но какой процент этих SPA от общего числа сайтов?
Алсо, для 95% того, что обычно на фриланс заказывают он идеально подходит.
накатал длиннопост, а сука, макака ввела какой то спам лист и не получается скинуть с примерами
вот , например. Как ты разметишь все это дело?
У меня вариант такой(как бы я делал) :
1. без бутстрапа.
2. для каждой картинки свой div , там вроде одинаоквые отступы, поэтому задам их и буду 1 за 1 размечать. Но, вангую , что то как обычно не станет и поплывет.
может ты и прав. Нужно различать верстку сайта для контора %хуйпойми% , где нет особых требовании, просто чтоб КРАСИВА , НУ ТАМ НАРМАС БЫЛА и верстку в серьезной конторе, где с тобой еще человек 10 работают над каким то заказом, уровня сайта Тинькоффа того же(недавно была статья , как писали фронтэнд для нового сайта)
Напоминаю, что бутстрап использует устаревший подход с флоатами и инлайн-блоками, это в 2016-то. Нормальный человек, если будет пилить все с нуля сразу будет использовать флексы. Так что ни о каком повторении бутстраповских решений даже речи не идет.
пикрл
Блять, почему оно не загрузилось. Ладно, дубль 2
доставь информации почитать по этим вашим флексам? в чем их суть и как их применять?
Вы заебали, пидоры.
Бутстрап это инструмент. Джиквири это инструмент. Реакты ваши, ангуляры и иже с ними.
Инструменты подходят для определенных задач, делая их легче, решая какую-то проблему.
А потом приходят петухи и спорят реакт вс ангуляр, бутстрап вс флехбох, жиквири вс подрочить сегодня на трапов.
Идите нахуй.
Бутстрап это инструмент. Джиквири это инструмент. Реакты ваши, ангуляры и иже с ними.
Инструменты подходят для определенных задач, делая их легче, решая какую-то проблему.
А потом приходят петухи и спорят реакт вс ангуляр, бутстрап вс флехбох, жиквири вс подрочить сегодня на трапов.
Идите нахуй.
Ну ты блять сравнил обычные сайтики и корпоративные порталы для крупных фирм. Разрабатывать второе мало кому светит из этого треда.
В 4 версии добавили флексы. Правда она еще в альфе.
Суть в том, что внутри флекс-контейнера ты можешь выравнивать блоки как тебе хочется — в ряд, в колонку, с равными интервалами, с вертикальным выравниванием, с переносами и т.д. Дальше сам гугли.
>Джиквири это инструмент
Для которого сейчас нет задач, потому что все он реализовывал запилили в браузеры.
звучит перспективно.
Спасибо
>Ну ты блять сравнил обычные сайтики и корпоративные порталы для крупных фирм. Разрабатывать второе мало кому светит из этого треда.
Разрабатываю CRM для крупной компании. Без бустрапа, без джиквери.
Как я понял из интенсива по сеткам, флексы сейчас уже поддерживаются всеми нормальными браузерами исключая один ужас с синей буквой Е, версия 8 или 7
И в принципе по-человечески можно уже на флексах делать, а флоаты как бы устарели.
И в принципе по-человечески можно уже на флексах делать, а флоаты как бы устарели.
Что блять? Нормальную работу с аякс запилили? Или удобные промайсы? Или чейнинг?
Молодец. Но большинство тут хуи простые.
>Нормальную работу с аякс запилили?
fetch
>Или удобные промайсы?
Сто лет назад.
>Или чейнинг?
Нинужен. Все равно мало кто работает с DOM напрямую.
>Разрабатывать второе мало кому светит из этого треда.
Ну я тащемта и разрабатывал. Правда ебать корпорацией я б ту компанию не назвал. Так, софтовая фирма на 100 человек, работающая на биржу по продаже специфического дорогостоящего оборудования.
кун
Начиная с 11 IE они поддерживаются нормально. В десятке тоже, но несколько бажно.
короче флексами.
.el:nth-child(1)
Можешь пояснить по :nth-child(1) Это как бы поочередное обращение к блокам, следующим друг за другом?
Это выбор определенного элемента по его номеру.
Например, Дается список из трех li, вот :nth-child(3) будет действовать на третий ли.
Ты курсы от академии не проходил что ли?
>.el:nth-child(1)
Класс + псевдокласс.
Обратись к элементу под классом .el, который является первым в списке потомков. То есть находится на первом месте на своем уровне/в своем родителе.
проходил, интенсив 2016, там не было про флексы ничего, кроме упоминания о наличии.
На продвинутом там целых пол урока по флексам.
До продвинутого еще не дошел.Посмотрел базовый, верстаю сайт на бутстрапе, закончу и буду смотреть продвинутый
А чому такая несправедливость? Они так упирают на флоаты только потому, что сами овер 10 лет двигали блоки флоатлефтами, или в этом есть какая-то практическая ценность для ньюфага?
Я бы наоборот учил флексам, потому что в скором времени (2-3 года максимум даю) это и так будет стандартом. Флоатам тоже надо учить, но уже во вторую очередь. Типа смотрите, как деды верстали, вам надо знать для общего развития.
Флоаты и инлайн-блоки все еще в ходу. Поэтому полностью исключать их было бы ошибкой.
Кому-то попадутся заказчики продвинутые, со свеженькими проектами нацеленными только на целевую аудиторию, кому-то попадется легаси код или васян желающий "чтоб работало везде".
К тому же, сверстав даже парочку адаптивных макетов на флоатах/i-b, к флексам подходишь как матерый. Сразу понимаешь все профиты и возможности.
Это как сесть на велик за 1000 баксов после нескольких месяцев активного катания на ашанбайке.
Спасибо.
Кстати, на каком этапе можно вкатываться в JS ?
Что я должен обязательно суметь сверстать ?
АНаны, странная штука. Divы какого то хуя съежают вниз. Почему так может происходить? Падинги и маржины сверху снизу не задавал, дивам присвоено display: inline-block, должны как бы в одну линию выстриваться.
Без кода можешь пройти нахуй.
Попробуй задать дивам vertical-align: top
Можно вообще без знания верстки вкатываться.
Не знаю, Ром. Убедительная просьба показывать код через песочницы.
Проследовал.
> vertical-align: top
Сработало. Раньше это свойство по умолчанию было
Бейзлайн по умолчанию было всегда
Вот такую бороду реально сделать в через СSS или проще картинку вырезать?
http://codepen.io/anon/pen/jryvvq
Еще есть вариант на жс https://kimmobrunfeldt.github.io/progressbar.js/
Нихуясе ты волшебник. Спасибо.
ПОЯСНИТЕ ЗА БУТСТРАП, ПЛИЗ
это в помощь новичку или опытному? на этом и зарабатывают или нет? его вообще надо использовать или он только уничтожит все мои знания, которые я накопил за месяц???
это в помощь новичку или опытному? на этом и зарабатывают или нет? его вообще надо использовать или он только уничтожит все мои знания, которые я накопил за месяц???
Если ты не понимаешь зачем тебе он, то не надо.
Анон, охуенно!
Это набор готовых компонентов, из которых можно быстро сваять сайтец. Помогает, когда тебе нужно сделать работы быстро и не-очень-качественно, а так же при разработке веб-интерфейсов, но это тебе пока не нужно.
Господа, философский вопрос. Делаю затычку для IE 9-, как написать - This site doesn't support your browser или Your browser doesn't support this site?
Не делай "затычки" для чего либо.
Но ведь ие<10 не достоин права на существование.
верстконацист
А как направить человека на страничку для скачивания нормального браузера?
Поддержка старых версий не нужна, с клиентом это обсудил. Сайт частично на флексах, хочешь, чтобы васян, зашедший с IE8 охуел от того, что всё распалось?
Это называется «заглушка», лол. Пиши второе, это же браузер говеный, а не сайт. Только в более понятной формулировке — типа браузер слишком старый, вот вам ссылка на обновление.
>частично на флексах
а еще на чем?
ньюфаг
Второе
Его проблемы. Распадется, значит распадется, контент он получить сможет, просто в уродливом виде. Захочет не в уродливом, скачает новый браузер. "Заглушка" -- несостоявшийся подход из 2007. Сейчас так никто не делает.
На инлайн-блоках и флоатах. Иногда пихать флекс - overkill, если можно просто прописать флоат.
Вот да, имел в виду именно это. Спасибо.
Можно дать ссылку на продолжение просмотра
объясните, как сделать с помощью гитхаба типа свою страницу?
читай шапку (гайд от анона по гитхабу)
Ты думаешь, тётя зина разбирается в браузерах и поймёт, что всё распалось из-за старого браузера? Твоя идея в принципе здравая, но заглушка всё же нужна. Пройду по золотой середине и добавлю кнопку, которая скрывает эту заглушку, если пользователю влом качать браузер вместо ие.
>Иногда пихать флекс - overkill, если можно просто прописать флоат
Нет. Флоат предназначен для обтекания картинок текстом, нахуя его использовать для чего-то еще? В чем флекс оверкилл?
15 лет на этих несчастных флоатах искали, старым версталам лень переучиваться.
а как тогда разметить сетку, без флоатов и флексов?
Не обязательно делать заглушку на всё окно. Можно сделать уведомительную полосу, в верху экрана с надписью.
верстали*
чет опечатался.
С флексами и без флоатов.
Да, это самое рациональное решение.
Смотри, есть ul - меню сайта. Допустим, как менюшка контакта, что слева от основной части.
Там есть li, которая содержит ссылку на сообщения и цифру-количество непрочитанных сообщений.
Делаем флексами -
li {
display: flex;
flex-flow: row nowrap;
justify-content: space-between;
align-items: center;
}
Если непрочитанных сообщений нет, то ссылка уедет в центр li'шки, если память не подводит.
Делаем флоатом.
li {
line-height: 60px; // вертикально центрируем текст
}
li .unread-messages {
float: right;
}
Итого два правила против 4 или больше, в случае если нет непрочитанных и отсутствие багов.
иди нахуй, падла
Живой пример сделай, тогда поговорим.
Ща на codepen запилю.
чет читаю ваши сообщения и ощущаю себя тупым говном, которое умеет только одстроничники с текстом делать :(((
зато знакомый просит сделать лендинг за мани, а я в душе не ебу как его делать
надеюсь, что к новому году я что-то и научусь делать :(
зато знакомый просит сделать лендинг за мани, а я в душе не ебу как его делать
надеюсь, что к новому году я что-то и научусь делать :(
Зато есть стимул развиваться, примеры обогнавших тебя всегда перед глазами.
> бутстрап
Так ведь все просто: бутстрап обоснован, если нужна поддержка ие8+ или если вы клепаете говнолендинг - писать кастомные сетки на флоатах достойно премии дарвина.
Все это не отменяет того факта, что начинающий просто обязан сверстать хотя бы какой-нибудь вшивый техномарт или седону на флоатах без использования сторонних фреймворков. Чтобы потом не возникало совершенно уебанских вопросов.
Так ведь все просто: бутстрап обоснован, если нужна поддержка ие8+ или если вы клепаете говнолендинг - писать кастомные сетки на флоатах достойно премии дарвина.
Все это не отменяет того факта, что начинающий просто обязан сверстать хотя бы какой-нибудь вшивый техномарт или седону на флоатах без использования сторонних фреймворков. Чтобы потом не возникало совершенно уебанских вопросов.
С флоатом - http://codepen.io/anon/pen/rLjqNp
На флексах - http://codepen.io/anon/pen/aZpRbK
%%с съезжанием ссылки в центр я обосрался, но всё ещё 2 правила (line-height + float) против 4.
Анонимайзеры, а в каком виде у вас портфолеры? Сайты со списками сделанных работ? Гитхабы?
Поясните-ка мне. Проходил курс от "Специалиста", так там препод говорил о том, что p и li не обязательно закрывать. Такая же информация на вебреференс. Почему тогда все закрывают?
Можешь связать с этим знакомым? Хотелось бы сверстать чего-нибудь за денежку.
Посоны, у нас в компании 15 человек на фронтэнде сидит, а на бэке 40+. Так что подумайте, прежде чем хардкорно углубляться в жс тот же. Я бы сейчас выбрал пыху как профильный язык если бы начинал.
Можно не закрывать, потому что браузеры пошли умные и закрывают всё сами. Но, с другой стороны, всё-равно при определённых обстоятельствах это всё может поломаться, так что лучше закрывать.
Сейчас изучаю его на ходу, клепая сайт под ключ. И это пиздец, посоны, после няшного синтаксиса JS (не думал, что скажу это) синтаксис пыхи - блевотня.
Жаль, что использование рельс неоправдано для простых сайтов с минимальным бэкендом.
да, конечно
нет, прости, но это мои будущие деньги
У тебя даже в таком варианте код на флоатах длиннее на строку, лол. Плюс flex-flow: row nowrap не нужен. Так что на две строки. И лишний класс не используется.
А за пункты меню, у которых зона клика не дотягивает до края сверху и снизу сразу нужно по ебалу лопатой бить.
А еще распорка, так что нассал тебе за щеку, флексодаун.
Ой блять, наоборот, флоатопидор.
А нахрена фронту пыха? Я просто ньюфажек.
А ещё такой вопрос, аноны. Как вы автоматизируете рутинную работу?
Допустим создание кучи <li> элементов. Или множественное создание страниц. Втупую копировать код в новый файл и редактирувать?
Вообще, какие средства ватоматизации есть во фронтэнде?
Допустим создание кучи <li> элементов. Или множественное создание страниц. Втупую копировать код в новый файл и редактирувать?
Вообще, какие средства ватоматизации есть во фронтэнде?
Ну лан, я обосрался. Готов принять порцию священной мочи флексобога.
Чем ты универсальнее, тем лучше. Чем меньше разработчиков в проекте, тем более эффективно работает каждый из них.
>Допустим создание кучи <li> элементов
li*666>a{huy} -> tab
>Или множественное создание страниц
php include
А что насчет display: table?
Я, например, все блоки выношу в отдельные файлы и подключаю через препроцессор pug. Правда, не знаю, как буду со всем этим работать, когда вкачусь в бэк.
R E A C T
Зависит от проекта же. Обычно какой-то шаблонизатор используется — pug, slim, handlebars. Если это SPA, то встроенные в React/Angular.
>Ты думаешь, тётя зина разбирается в браузерах и поймёт, что всё распалось из-за старого браузера?
Если поддержка динозавров в проекте не требуется, значит на таких теть зин априори наплевать.
тёти Зины вполне платежеспособная категория, в отличие от мамкиных задротов-программистов
Причем здесь пэхапэ вообще, у нас здесь тред про фронтенд.
Олсо, никто не мешает через год-два-три при желании обмазаться нодой со всеми причитающимися и стать полноценным бэкендером без распыления по технологиям (считай тот же JS, что и во фронте, только более вылизанный).
Блядь, ты какой-то тупой, да? Если поддержка динозавров не требуется, значит на часть "платежеспособной аудитории" в виде 0.1% пользователей не поддерживаемого браузера 10 летней давности всем наплевать. Зачастую так и бывает. Если заказчик/работодатель захочет поддержку, то ты поперек собственного визга без всяких заглушек полетишь верстать под это доисторическое дерьмо.
>если заказчик чего-то там вскукарекнет, ты пойдёшь верстать под это доисторическое дерьмо
не пойду. А ты иди нахуй.
Есть ли тут, кто уже что-то умеет?
Супер-уровень не требуется, берёмся за 'простые' проекты.
Могу предложить работу, не регулярную, можете рассматривать как подработку.
Супер-уровень не требуется, берёмся за 'простые' проекты.
Могу предложить работу, не регулярную, можете рассматривать как подработку.
Есть. [email protected]
А какой уровень нужен?
Напиши на [email protected]
двачую вопрос.
Какой уровень нужен?
Оставь почту, надоел.
Написано же, простые проекты. Наверно, лендинги с формами обратного звонка.
Я лендинги на бутстрапе верстаю, я нормален?
Ньюфаг-кун
Да
check
[email protected]
Сайты визитки, примитивные интернет-магазины с фильтрами, формами заказа с минимумом свистоперделок.
Отпиши, если еще нужно. Верстать умею, джс умею, осваиваю фреймворки, портфолио есть. [email protected]
Верстаны, попытался недавно скрыть адблоком рекламу, а у той прямо в стиле элемента прописано visible: visibility !important . И я вот подумал, а неужели это панацея от адблока?
Она не скрылась?
Вот пример того сайта, слева ползёт реклама
Да, не скрылась
http://seasonvar.ru/serial-3290-Pirati_chernoj_laguni-2-season.html
дурья моя башка, забыл ссылку прицепить
У меня все прекрасно скрылось. Ты в курсе что есть два адблока?
В курсе. У меня addblock plus.
Алсо, попытался скрыть через инструменты разработчика, си там скрывание элемента тоже не работает, только удаление.
У меня опера новая и адблок обычный - все скрывается. Скинь скриншот где она там не скрывается.
Аноны, помогите пожалуйста, я знаю, тут много добрых людей по выходным.
В общем я прохожу вступление в ксс на хтмлакадемии, но завис на испытании https://htmlacademy.ru/courses/41/run/15. Тут у меня единственная проблема в том, что кексби продакшн на несколько пикселей выше чем в образце, но я из за этого не могу пройти испытание.
Кто знает, как опустить блок при помощи ксс? Хтмл код заблокирован.
В общем я прохожу вступление в ксс на хтмлакадемии, но завис на испытании https://htmlacademy.ru/courses/41/run/15. Тут у меня единственная проблема в том, что кексби продакшн на несколько пикселей выше чем в образце, но я из за этого не могу пройти испытание.
Кто знает, как опустить блок при помощи ксс? Хтмл код заблокирован.
Поменяй маргины и паддинги.
Сотен нефти тебе, анон.
Отлично знаю ксс и хтмл, скоро полезу в JS, буду рад если подкинешь подработку, так как срочно нужны деньги. [email protected]
Хм, а тут есть такие, кто с хорошими знаниями хтмл и ксс и немного JS получают/получали =>20k?
Получал 50к раньше за онли верстку в ДС2
Золотое было время, видимо. Надо было года 3-4 назад вкатываться, вместо бесполезного сидения в вузе..
Сколько лет назад получал?
В голосину с тебя!
Спасибо, обосрался.
схоронил
Тут вроде анон месяц назад вкатывался с 35к на удалёнке за хтмл, ксс и жс.
Аноны, подскажите технологию, или плагин для Sublime Text, чтобы можно было делить HTML блоки на отдельные файлы, например, header.xxx, main.xxx, footer.xxx и потом подключать эти файлы в другом файле. Например, есть у меня index.html, я в нём пишу что-нибудь вроде:
include header.html
<body>
... тут куча кода
</body>
include footer.html
Потом компилирую и он собирается в один index.html со вставленным кодом из этих двух файлов.
А то просто когда делаешь вёрстку из макета, порой, когда у тебя уже несколько страниц (главная, например, и пара внутренних) свёрстано и тебе нужно изменить что-то в подвале или хэдэре, то приходится копипастить код в нескольких файлах. А так можно было бы написать один раз и просто подключать во всех файлах, где он нужен. А потом просто скомпилировать.
Существуют такие штуки?
include header.html
<body>
... тут куча кода
</body>
include footer.html
Потом компилирую и он собирается в один index.html со вставленным кодом из этих двух файлов.
А то просто когда делаешь вёрстку из макета, порой, когда у тебя уже несколько страниц (главная, например, и пара внутренних) свёрстано и тебе нужно изменить что-то в подвале или хэдэре, то приходится копипастить код в нескольких файлах. А так можно было бы написать один раз и просто подключать во всех файлах, где он нужен. А потом просто скомпилировать.
Существуют такие штуки?
php include
> butt-wrapper
Так это было пару месяцев назад, сейчас меня до фронтенд разраба повысили, получаю 85к.
Нюфаг растерялся.
Если нажать на 1 - идет на платный курс с названием базовый
Если нажать 2 - начинает обучение, эмм тоже "базовый курс" или что это тогда? ведь там тоже базовые знания для совсем нулевых(как я)
или этот же бесплатный курс можно купить? не совсем понял.
Если нажать на 1 - идет на платный курс с названием базовый
Если нажать 2 - начинает обучение, эмм тоже "базовый курс" или что это тогда? ведь там тоже базовые знания для совсем нулевых(как я)
или этот же бесплатный курс можно купить? не совсем понял.
Ты путаешь курсы бесплатные и интенсив.
Тогда тут целых 3 кнопки, 2 из которых ведут у одному курсу. Или я опять запутался
Может тебе лучше куда-то попроще? К копирайтереам например?
Что значит создал собственное устройство?
https://htmlacademy.ru/program
Вот все курсы, где нет метки рубля - бесплатны. Где есть, там первые 5 заданий - бесплатны.
Тебе сделали максимально дружественный интерфейс, а ты заблудился в трех кнопках, блять. Надеюсь тебя никогда не возьмут на работу.
Шах и мат фрилансеры, 20к в час
http://chelyabinsk.zarplata.ru/vacancy/Web_programmist_1S_Bitriks?id=111113323
http://chelyabinsk.zarplata.ru/vacancy/Web_programmist_1S_Bitriks?id=111113323
>20 000 руб./час + %
Проиграл.
Наверное еще блондинка-модель делает минет после каждого рабочего дня.
С завистью смотрит на 1C-пацанов
Поясни за modX, чем он так хорош?
Ну че, аноны никто не хочет 5% от будущей прибыли?
В инструментах разработчика можно пилить пользовательские устройства и давать им необходимые тебе разрешения и pixel ratio.
используй pug и инклюды.
Посмотри, как я здесь это запилил
https://github.com/frollodecol/frollodecol.github.io/tree/master/sedona/app
Аноны, как верстать Барбершоп без просмотра интенсивов, чтобы не спалиться на работе? (Не могу смотреть интенсивы)
Html уже разметил на кодепене, нарезать графику наверно смогу - фотошоп портативный есть.
Html уже разметил на кодепене, нарезать графику наверно смогу - фотошоп портативный есть.
Страдает кто-нибудь такой хуйней как я? Ниндзя-верстаны призываю вас?
Подожди, человек за 10 000 рублей, хочет чтобы веб-программист с 3-5летним стажем сделал ему приложуху на андроид?
>и еще за 5% от будущей чистой прибыли
Ну в общем, да, за 10к
трудновато тебе будет. все-таки верстать самому и с помощью кого-то - разные вещи. тем более на первых порах нужно смотреть, как делается правильно, чтобы потом воспроизводить
подсмотреть я после работы могу, вот html с некоторыми косяками сделал, думаю с css также попробую, а там уже подсмотрю как правильно.
Время очень ограничено, дома 1,5 - 2 часа только и успеваю посмотреть 1 видео интенсива.
А на работе времени дохера, а в открытую нельзя.
Так иногда завидую ребятам, кто может сидеть дома и учить, а потом вспоминаю что хочется кушать.
https://www.npmjs.com/package/gulp-svgstore#inlining-svgstore-result-into-html-body
Аноны, смотрите, я собрал svg спрайт, но так и не понял, как же его использовать на странице? Какой код следует вставлять в html и css?
Аноны, смотрите, я собрал svg спрайт, но так и не понял, как же его использовать на странице? Какой код следует вставлять в html и css?
ну, если ты знаешь основы, то может и сделаешь. я вот прошел курсы "Специалиста", прочитал книгу по КСС, но бля, все равно не до конца понимаю. Курсы с книгой и реальность сайтостроения расходятся. Я знаю только основы, да и на курсах не делали мы сайтах на дивах.
Открываешь ИП, куча идей
@
Платить нечем, денег нет, обещаешь % от прибыли всем сотрудникам
@
Дело обломалось
@
Никому ничего не должен!
Я курсы Кокодемии делал, мне понравились, единственное, что при разметке html не всегда еще вижу где стоит разбивать страницу на колонки, а где нет (например фичи: быстро, круто, дорого порывался колонками сделать, хотя нахуй не надо для последующей стилизации, а вот уже основной контент разбивать понятное дело надо)
а еще проебываю кнопки иногда, потом возвращаюсь.
Ладно пойду ниндзя-нарезку графики делать, надеюсь не уволят.
<img> не?
не. Он работает как-то по другому. Вот, смотрю вот этот видеоурок, может, всё ещё прояснится.
https://www.youtube.com/watch?v=S_wZSjLiUog
На чем же вы сайты делали ? Таблицами ?
В качестве мотивации напомню, что когда ты фрилансер-вебмакака, то твой день начинается с курения марихуаны и фапа на лоликон.
вкатился в фронт-енд благодаря этому ИТТ треду за 6 месяцев обучения средней упорности
вкатился в фронт-енд благодаря этому ИТТ треду за 6 месяцев обучения средней упорности
Почти без джса за верстку получаю в своей мухосрани на 600к человек примерно 20-25к.
Успешно фрилансишь? Что знаешь?
До недавнего времени был psd-to-html макакой, такие редко получают хорошие деньги. За год работы у меня $2000 общего заработка.
Сейчас расширяю квалификацию на php.
Знаю html,css,js,jqueryникаких фреймворков и немного php.
ура, получилось. Правда, как-то неудобно.
Если не сложно, опиши свой путь обучения. И где начинал брать заказы? Фл.ру?
Я вот думаю, а нужно это SVG, что это позволяет сделать, облегчить страницу? Так вроде у всех уже не 63 кб/с интернет.
>у меня $2000 общего заработка.
>Знаю html,css,js,jqueryникаких фреймворков и немного php.
толсто
Он же не сказал, что в месяц. А так, вполне реальная цифра за полгода. С учётом того, что за лендинг на вордпрессе там стабильно 35 бачинских дают.
Статка.
Начал с html academy, интенсивов не смотрел, потом JS до уровня уверенного jquery-разработчика.
Потом занялся всякими ништяками вроде препроцессоров, сборщиков и прочих инструментов. С этим вот уже начал вкатываться, пошел на тогдашний elance, выполнил пару мелких заказов, нашел почасовый за $3/ч, израильская контора, пишущая веб-приложухи на php. Потом начал потихоньку учить php, одновременно с работой. Вот сейчас делаю сайты под ключ. Правда, wordpress пока не освоил.
http://frollodecol.github.io/sedona/dist/index.html#
Запилил svg-спрайты. Как-то криво они работают, неудобно, не знаю даже, стоит ли профит от их использования этого.
Запилил svg-спрайты. Как-то криво они работают, неудобно, не знаю даже, стоит ли профит от их использования этого.
Это апворк?
Английский хорошо знаешь?
Он самый.
Более-менее, в переписку могу, разговорный - нет. Ни разу не говорил по скайпу с заказчиками, кроме пары рускоговорящих.
Хотя бывают случаи, что я не понимаю, чего хочет собеседник.
А если переписываешься с заказчика, по почте? Или там внутренний сервис?
Тесты на апворке проходил?
Верстуны. Нужен человек на работу. Навыки - хорошая верстка, знание js и разговорный ингриш. Желательно молодой-обучаемый. Предполагается дальнейшая эволюция в фронтендера. Пишите свои скуйпы, телеграмы, дальше там расскажу.
>разговорный ингриш
Внутренний. Хотя некоторым удобнее по почте или в скайпе.
Да, проходил. На половину ответы гуглятся, Кстати, за каждый пройденный тест вроде бы дают 5% заполненности профиля, а это важный показатель.
Ясно, спасибо. Удачи тебе!
Вот меня всегда удивляло, разве можно живя в рашке подтянуть ангельский до свободного общения? Если ты не йоба-переводчик, конечно. Имхо только контакт с носителями можно себе это обеспечить. Я вот технический знаю на ок, научные статьи читаю почти не заглядывая в словарь. Но блять как только какой-нибудь телефонный развод в мурике на ютубчике смотришь, или просто общение молодежи, то все твои знания уровня. London is the capital of Great Britain оказываются и не нужны.
А хотя нет, можешь еще сказать на каком уровне знаешь жс, и какой сложности макеты были?
Пацаны, уточню, не нужен уровень королевы Елизаветы. Нужно понимать что от тебя хотят и сказать чем ты занят. Обсуждений преимуществ реакта перед ангуляром и наоборот никто не просит и не ждет.
А жс на каком уровне?
Верстаны, как удалить плагин из галпа? Допустим, поставил я его, потом понял, что не нужен, и как-то нужно при помощи консоли убрать его из package.json и node-modules.
На уровне необходимом для верстки. Знать основное, в любом случае за попытку у вас никто яйца не оторвет. Дерзайте.
Раз у тебя получилось, то хочу тебя предупредить.
http://caniuse.com/#search=SVG%20fragment%20identifiers
Самому пришлось отказаться от свг спрайтов из за этого. Но я посмотрел на других популярных сайтах, там не особо брезгают вставлять свг инлайного, несмотря на то что изображение не будет кэшироваться.
Что лучше использовать тогда с максимальной поддержкой в браузерах?
Пиши почту.
бамп вопросу
Вставлять инлайного, если нужна манипуляция через css. (не кэшируется)
Вставлять через <img>, если просто нужна статичная картинка. (кэшируется)
Вставлять через xlink:href="sprite#name", если тебе нужно всё сразу и тебе похуй на всё, так как ты верстаешь для себя. (кэшируется)
Боишься свой скайп/телеграм палить? [email protected]
Использовал третий способ при работе с векторными спрайтами. Как раз сейчас проверял сайт на своём некроведре и всё работало. Так что я молодец, всё с самого начала работало норм.
алсо, почему этот вариант считается по-твоему неприемлимым для вёрстки заказчикам?
Не, просто щас с телефона, в поездке. Еще пару дней на связь толком выйти не смогу. А предложением заинтересовался, под все требования подхожу. Когда особожусь отпишу тебе, если конечно еще будет актуально, там уже можно и скайпиком/телеграмчиками обменяться.
Пойди в fl/ в англотред. Если мне не изменяет память, там есть ссылки на ресурсы, где можно бесплатно пообщаться с носителями онлайн.
Пиши тогда [email protected]. Покажу, что умею.
Сложных макетов особо не было. Иногда попадаются с нестандартным расположением элементов.
По js - уверенный jquery разработчик, лол. + десяток-другой библиотек на все случаи жизни.
JS -
Договорились.
Ну и подбампну объяву. с картинкой своего кота
Проверил даже на IE11, не работает :( Придётся вставлять инлайново.
А если через img вставлять спрайт, его же не отпозиционировать потом, под нужную иконку, не?
Почему именно пэхапэ?
Аноны, выручайте. Нужен супер краткий и годный курс по хтмл и цсс. Взяли пхп макакой (ну в кодинге именно в самом коде я шарю, был опыт крестов и сей года 2 круглосуточного кодинга). Взяли практически по знакомству, собеседования как такового практически не было. Напиздел что есть знания верстки. А знаний то нихера нет.
>А если через img вставлять спрайт
Тут я имел ввиду не спрайт, а отдельные свг элементы.
А, все. А инлайново - это как, напомни?
С последующим вкатом в wordpress. Заданий по нему очень много.
Зря не ведете архивач.
Просто берешь, копируешь весь код внутри свг картинки и вставляешь его в html.
Надеюсь ты понимаешь, что тут спрайт не нужен, так как запросов небудет.
Блин, я офигеваю с этого IE 11. Он ругается даже на строку padding: 20px auto; а на padding 20px не ругается.
но ведь мы раздуваем html-файл до колоссальных размеров. Читать же неудобно.
Мне больше понравился тот факт, что в едже убрали парочку флексобагов, свойственных ие11 (типа непереносимости флекс-бэйзиса и минхейта), но добавили парочку новых (типа странного центрирования при использовании колумн-врап+жустифай:сентер). Майкрософт такие майкрософт.
Ах, понятно. Мне фронтенд очень нравится, надеюсь что на уровне "знаю реакт" можно будет зарабатывать хотя бы на ежедневную порцию гречки с солью. От пэхапэ тошнит (я его знаю относительно неплохо).
IE 11 - говно, он даже размеры паддингов в проентах не понимает. Не буду верстать под него ни за какие деньги, а на всех сайтах, которые буду пилить, буду добавлять фиксированный блок со ссылкой на нормальный браузер. Нужно сжечь это говно в огне.
Это еще 1 минус этого способа помимо невозможности кэширования. Но что поделать...
Остается ждать полной поддержки всеми браузерами this http://caniuse.com/#search=SVG%20fragment%20identifiers
Ты шапку читал? Иди на htmlacademy, это как книжка для детей.
За пару недель ненапряжных бесплатных занятий базу получишь, а там разберешься.
Пацаны, как на js приятно связать элементы?
Ну, то есть, вот есть у меня, положим, 2 дива (на самом деле их больше), и нужно, чтоб по клику по одному элементу (который кнопка) вылезала инфа из другого дива. На хтмлцсс знаю как сделать, а вот как на js?
Ну, то есть, вот есть у меня, положим, 2 дива (на самом деле их больше), и нужно, чтоб по клику по одному элементу (который кнопка) вылезала инфа из другого дива. На хтмлцсс знаю как сделать, а вот как на js?
Не понял, при нажатии на одну кнопку, все другие нужные дивы должны разворачиваться, или на каждый див будет по кнопке? Если да, то чел выше сделал.
Если же нужны все дивы одной кнопкой то:
http://codepen.io/pidaraha/pen/XKpvQe
Но я не уверен что это не говнокод.
Реализацию на css покажи, хули на кофейной гуще гадать?
Пиздец, два - три дня и в бамплимит.
Может пусть тонет, такой себе отбор на выживаемость, кто сумеет, тот найдет?
Может пусть тонет, такой себе отбор на выживаемость, кто сумеет, тот найдет?
Нужно перекатывать, иначе утонем.
Кстати да, можно смело набивать по тысяче постов, треды на этой доске не так активно создаются. Не утонем.
http://codepen.io/frollodecol/pen/EyWYgR
Смотрите, аноны, написал плашку для пользователей ИЕ. Может, кому пригодится.
Смотрите, аноны, написал плашку для пользователей ИЕ. Может, кому пригодится.
> хромог
> нормальный браузер
ожидал этого ответа
А то!
Но это я так шучу. В хромоге самый удобный инспектор и JS-консолька. А для серфинга двочей лично я предпочитаю лису. Она милая и без анальных зондов.
Просто после установки и запуске в хроме надо вторую плашку на лису.
кстати, что забавно, в начале я для эдакого сарказма хотел отцентровать текст на плашке при помощи флексов.
http://frollodecol.github.io/sedona/dist/index.html
Внедрил на седону. А мобильную версию до сих пор так и не начал. Почему я такой ленивый?
Нелогично внедрил. Делай проверку на ИЕ10— лучше. 11 нормально флексы поддерживает.
А почему на htmlacademy яндекс советуют. проплачено или просто хороший браузер мол?
ни разу не использовал яндекс браузер, как эталон верстаю под хром, оперу, и фокс, и ие иногда
ни разу не использовал яндекс браузер, как эталон верстаю под хром, оперу, и фокс, и ие иногда
IE11 не поддерживает svg-спрайты. А я не зря столько с ними ебался, чтобы теперь внедрять веторную графику инлайново.
Посмотрел я ру-фриланс помойки, пиздец конечно с версткой.
"Значит так, нужно сверстать вот эти 10 страниц ie6+, пиксель перфект, адаптивно, респонсивно, мобайл ферст, вся хуйня. Готово должно было быть еще вчера епту бля! Плачу 500 рублей, если понравится как мне вылижут жопу."
"Значит так, нужно сверстать вот эти 10 страниц ie6+, пиксель перфект, адаптивно, респонсивно, мобайл ферст, вся хуйня. Готово должно было быть еще вчера епту бля! Плачу 500 рублей, если понравится как мне вылижут жопу."
npm uninstall --save-dev gulp-plugin-name
Сафари тоже не поддерживает.
Ты откуда такой наивный? С луны к нам упал?
>проплачено
Да нет конечно, ты что, добрые дяди советуют хороший браузер.
Для пользователя яндекс браузер очень хорош, по крайней мере, до последних апдейтов, которые стали гораздо сильнее кушать ресурсы.
Для разработчика лучше использовать хром, так как в яндексе, например, нельзя уменьшать ширину окна меньше 800 пикселей.
блин, а вот это уже очень печально. Или сафари на маках пользуются единицы, а большинство ставит хром?
Самое печальное, что найдутся идиоты, которые на это подпишутся.
Блять. Нахуй так жить?
Да я не видел даже ни разу это яндекс браузер, сирисли, меня все эти яндекс бары, браузеры как-то обошли стороной, но последние года полтора-два стал замечать этот их логотип везде. Очень агрессивно рекламируют.
Сам я на вивальди сижу, лучший хром сейчас как по мне.
Посмотрел, сафари и флексы нормально не отображает.
То была, как я понял, пятая версия. А как на винде посмотреть девятую? Виртуалка?
Вообще, как отлаживать сафари, сидя под виндой?
Это не с версткой, это со всеми технологиями такой пиздец.
>Очень агрессивно рекламируют.
Вся интернет-реклама в РФ (в частности среды работы), Майл.ру, Яндекс ведется просто очень агрессивно. Вплоть до того, что пишутся вируса, которые инсталлируют тебе в систему все это гавно и реинсталлируют если удалишь. Все рассчитано на неграмотность пользователя. У меня горит постоянно у родных всю эту парашу вычищать. Особенно дети хватают. Я считаю что нужно ввести на гос.уровне какую-нибудь хуйню типа запрета всплывающих окон/автоматической инсталляции программ от знаменитых оформленных компаний. Беспредел какой-то.
Не то что бы мне это было нужно, но странно, что не могу открыть ссылку из курса, пикрелейтед. К лисе, опере, сафари - открывает норм. Хром дефолтный, без дополнений. Просто интересно, что там по ссылке.
хз по каким закоулкам интернета вы шараебитесь, но никакой агрессивной рекламы майлру и яндекса не замечаю
Любые проги в русском сегменте покачай с торрентов и прочего.
> с торрентов
Ну зачем же, можно и с оф. сайтов - там тоже самое, яндекс бары, брвузеры, мейл ру агенты
Пацаны пацанчики из хохлостана , кто уже зарегистрировался и готов получать гарвардское образование?
http://prometheus.org.ua/
http://prometheus.org.ua/
Куда, на основы программирования?
Уу, а если на удалёнку в Москву какую нибудь устраиваться?
>Пойди в fl/ в англотред. Если мне не изменяет память, там есть ссылки на ресурсы, где можно бесплатно пообщаться с носителями онлайн.
Зачем всё так усложнять? Есть фочан с примитивным английским как раз для обучения.
2ch 9 000 за 8 дней работы нормально для версталы ? А то мне кажется, что мой сосед грузчик за прошлую неделю больше получил
Нубский вопрос: как строиться сетка страницы флоатами или инлайн блоками? Когда юзают абсолютное позиционирование?
Здесь аноны изучают верстку, базовый фронт-енд и обсуждают все, что с этим связано. Полноценная инфа по материалам в пасте, здесь только краткая выкладка базиса и основные ссылки.
Если ты ньюфаг, то тут тебе будут рады. Но только в том случае, если ты, перед тем как что-то спросить, погуглишь хотя бы минут 5 и прочитаешь фак/пасту. В противном случае будешь послан нахуй, и абсолютно заслужено. Совершенно идиотские вопросы, нытье и прочее - аналогично. Не говорите, что мы не предупреждали.
====================
КРАТКИЙ ФАК ДЛЯ НЬЮФАГОВ И ПРОЧИХ МИМОКРОКОДИЛОВ
>Можно ли вкатиться в randomAge.
Можно.
>Можно ли вкатиться без знаний программирования/матана/функционирования гипертекст протоколов/етц.
Можно.
>С чего начать? Что учить? Куда смотреть?
Внимательно прочитать ОП-пост, затем прочеть пасту от корки до корки. Подумать, надо ли оно тебе, перечитать все еще раз. Приступать к изучению материалов по порядку.
>Есть ли работа?
Была, есть и будет, устраиваются как версталой, так и джунами фронт-ендами. Верстала без хотя бы базового знания JS сейчас как мамонт, поэтому готовьтесь учить и Javascript. В любом случае он вам понадобится, если планируете развиваться хоть куда-то. Джун фронтенд, полноценный и востребованный на рынке, а не программист на джиквери - это спец, умеющий и сайтик сложный сверстать, и страничку оживить, и приложение на нативном сваять.
>Кто-то уже приходил к успеху/расскажите кулстори/кто-то уже работает/кто-то съехал от мамки/поднимите мне настроение и вселите надежду в себя/etc
Да, и не один а двое, азазазза, кхм.
Да приходили, и да, вряд-ли кто-то тут получает удовольствие от повторения одних и тех же слов в тысячный раз. Пожалуйста, избавь нас от этой головной боли. Хочешь мотивации/психологической зарядки/утешения – посмотри вот это
https://www.youtube.com/watch?v=ZXsQAXx_ao0
>Сколько времени займет обучение?
Плотно стоящий на ногах верстальщик с портфолио из 3-5 адаптивных макетов, но практически без знаний JS - 400+ часов.
Верстала с пониманием JS и портфолио - 600+ часов.
Фронт-енд джун с уверенной версткой, уверенным JS, умением в дополнительные техи/фреймворки/препроцессоры/либы/системы сборки/otherSkillName, своими пет-проджектами, в том числе наверстанным портфолио - 1000+ часов.
>Могу ли учить верстку/JS после работы по 2 часа?
Можешь но это вряд ли будет эффективно. Указанное время в таком случае можешь смело умножать на 1,3+.
>Слышал что для устройства на работу нужно портфолио.
Нужно, чтобы всякие эйчары могли убедится еще до отсылки тестового что ты что-то умеешь. Верстале для портфолио достаточно запилить самостоятельно пару макетов. Джуну фронту надо либо макеты с вменяемой клиентской логикой и безупречной версткой, либо какую-то приложуху.
>Подскажите хостинг/сайт/место где все эти проекты держать?
Для сверстанных макетов без логики или с клиентской логикой хватит и гитхаба. Гуглишь бесплатный хост для страничек от гитхаба - github pages(gh-pages). Иметь профиль на гитхабе вообще - признак хорошего тона, так что в любом случае пригодится.
>Могу ли я спросить что-то в треде?
Конечно. Но перед этим следует проделать следующие действия.
1. Подумать.
2. Погуглить.
3. Попробовать решить задачу самостоятельно.
4. Еще раз подумать.
Если решения все равно нет - спрашиваешь.
Задачу описываем четко, код показываем только в песочнице тут не экстрасенсы сидят нам нужно пощупать код, иначе никто не поможет Аноны с кодом в постах, на скринах, в архивах, сразу идут нахуй. Вас предупредили.
Дополнительно можно приложить скрины где показано, что работает/что не работает/как хотелось бы/как планировалось/етц. Плюс текстовые пояснения конечно. Оформите вопрос правильно - практически гарантированно получите грамотную и своевременную помощь.
>Почему фронтенд вообще существует? Есть же CMS/конструкторы-сайтов.
Почему существуют рестораны и кулинария?? Есть же доширак.
Дальнейшая информация для ньюфагов в пасте в конце ОП-поста. Там ВСЕ расписано, в том числе самый удачный по мнению автора алгоритм изучения основ верстки, есть тонна полезных ресурсов для разработчиков начального-среднего уровня и прочая годнота.
=====================
Cразу скажу, времена, когда можно было сверстать две фиксированных странички и завалиться в хардкорный фронт-енд давно прошли. Нет, работу конечно найти можно будет. Позиция называется Markup или HTML/CSS Developer называйте как хотите хотя даже там требуется знание адаптивности и прочих ништяков, но это только старт, и ЗП там вряд ли вас сильно порадует, если конечно сможете найти такую позицию. На данный момент фронтендеру нужно учить больше, чем просто HTML/CSS. В частности необходимы продвинутые инструменты разработки, автоматизаторы, работа со скриптами, сам Js и Jquery, в перспективе что-то из Js фреймворков, MVC и прочего дерьма.
Не помешает навык натяжки оболочки на движок. Можете даже в бэкенд завалиться, если интересно. Но продуктивно это совмещать со всем тем стаком технологий, что нужны для фронт-енда, получится не у каждого, особенно на старте. Впрочем, если есть желание - попробовать можно, оно того стоит. Только есть нюанс, материалов по бэкенду здесь в пасте представлено мало, если кто-то в будущем поделится – будем рады и включим в будущие редакции.
Работу находим в конторках и крупных фирмах. Конторки/студии - основное направление деятельности. Альтернативой конторкам может стать фриланс, тут уже все опять же индивидуально, но конкуренция там больше, в начале может быть сложно, скучно и относительно дешево. Помните о портфолио, оно просто необходимо, да и за время его создания руку набьете.
Дальше представлены первичные обучающие материалы в сильно сокращенном варианте, полные списки найдете в пасте.
http://dash.generalassemb.ly/
http://learnlayout.com/
http://htmlacademy.ru/ - ультрагоднота
http://learn.javascript.ru/ - по JS на русском лютая годнота. Годнее только Флэнаган
http://www.codecademy.com/
http://codeschool.com/ - тут платно, но есть бесплатные курсы, годные вещи про jquery и git
http://htmlbook.ru/ Справочник. Каждый верстальщик пользуется им. Все непонятное смотрим там.
http://teamtreehouse.com - тут все платно, но первые две недели бесплатно, можно успеть пройти пару курсов, объясняют хорошо.
Для работы понадобятся текстовые редакторы или среды разработки, тут уж решать вам.
Текстовые редакторы:
http://brackets.io/
http://www.sublimetext.com/3
https://atom.io/
ПРИМЕРЫ ВЕРСТКИ ДЛЯ САМЫХ МАЛЕНЬКИХ:
Внизу видеокурс о том, как верстать PSD шаблон. Просто пример, чтобы посмотрели как выглядит работа и как верстают С НУЛЯ.
http://denweb.ru/put-veb-mastera_sod
Верстка по БЭМ
http://habrahabr.ru/post/203440/
Лично я все же посоветую черпать инфу по базовой верстке из интенсивов, ссылки чуть ниже. Там ребята показывают весь процесс и делают это качественно. Никаких ошибок, минимум стилизации и отсебятины.
Гайд от анона по гитхабу:
http://randomfederation.github.io/
Шпаргалка от Громова по гиту
http://nicothin.pro/page/git
Теория продвинутых курсов HTMLacademy
https://yadi.sk/d/Ka-aU3poqa8bM
Базовый интенсив за 2015 год:
http://nnmclub.to/forum/viewtopic.php?t=899131
Тот же базовый но посвежее, за 2016 год:
http://nnmclub.to/forum/viewtopic.php?t=999246
https://yadi.sk/d/3AhpPwHaq5Bwp
Продвинутый интенсив за 2015 год:
http://nnmclub.to/forum/viewtopic.php?t=900609
Дополнительные материалы к интенсивам, рекомендуются к ознакомлению.
https://github.com/tsergeytovarov/htmlacademy-basic-additional-material
Базовый JS интенсив за 2015 год:
http://nnmclub.to/forum/viewtopic.php?t=974803
https://github.com/o0/keksobooking
Используемые нынче технологии
https://medium.com/javascript-and-opinions/state-of-the-art-javascript-in-2016-ab67fc68eb0b#.ez
Макеты для верстки, тоже от академии. Все из их рассылки, поэтому лучше бы тебе на нее подписаться. Ребята вываливают кучу годноты, хоть и относительно редко.
https://mega.nz/#!CtYGSCbB!3Y6fDxxL_N_LstGFPGjHrhXbIoNqk4BzmNjjEmk2jPc
======================
Все основная инфа и материалы здесь:
Обновленная паста, она же FAQ - http://pastebin.com/ytWW0UfU
Старая паста если кому вдруг понадобится - http://pastebin.com/tvvwC7uz
Прошлый тред