• Как сверстать блок со срезанным углом?

    gennadiy403
    @gennadiy403
    Да, лучше это сделать через SVG, например таким образом
    https://jsfiddle.net/gjds3sfx/1/
    Ответ написан
    1 комментарий
  • С какими сложностями придется столкнуться при разработке онлайн-обменника криптовалют?

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

    P.S. Хотя я иногда завидую таким людям - мне бы такой оптимизм.
    Ответ написан
    1 комментарий
  • С какими сложностями придется столкнуться при разработке онлайн-обменника криптовалют?

    sim3x
    @sim3x
    0. Отсутствие понимания, как все работает
    1. Отсутствие опыта разработки такого рода систем
    = неправильно комитнули транзакцию, деньги ушли не тому, возмещаете из своего кармана
    = обрушили сеть, вам ненавидит сотня тысяч человек
    ...

    2. Отсутствие експертизы в ИБ
    = много денег на бирже, есть дырка, денег на бирже больше нет
    ...

    3. Юридические проблемы при регистрации бизнеса
    Правовой статус системы «Биткойн» в РФ обсуждается[13][14][15][16][17][18].
    Правовой_статус_системы_Биткойн
    // росийский новояз - уже и в вики

    Проблема с юр стороны - неустойчивость законодательства в РФ и рандомное применение права

    Проблема в юрисдикциях со стабильным законодательство и устоявшимся правоприменением в области криптовалют - через вас течет трафик с не совсем легальными деньгами, вами интересуются спецслужбы
    Ответ написан
  • Bootstrap - плохая практика добавлять к элементам фреймворка свои классы / стили. Как тогда лучше в моем случае?

    serjazz
    @serjazz
    developer and dancer
    На самом деле плохой практикой (и то в ряде случаев это утверждение спорно) является перекрытие существующих свойств bootstrap заданных в указанных классах (просто потому что это меняет нативное поведение и делает его неожиданным). Блоку с уже присвоенными классами bootstrap можно назначать свои классы в случаях когда данные классы расширяют (а не перекрывают (опять же не всегда это правило)) набор свойств заданных элементу.

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

    fruity4pie
    @fruity4pie
    A
    Лучше всего не использовать bootsTRAP.

    Изучите FLEX. Это как таблетка от головной боли)
    Ответ написан
    6 комментариев
  • Какие задачи нужно уметь выполнять на JS начинающему?

    copist
    @copist
    Empower people to give
    Какие задачи нужно уметь решать на чистом JS, перед тем как переходить к изучению библиотек и фреймворков?


    Кроме синтаксических конструкций, математических и логических выражений, нужно знать:
    • Область видимости переменных
    • Замыкания
    • Объектно-ориентированное программирование, в частности наследование через прототипы
    • Шаблон проектирования "модуль"
    • Операции над DOM
    • Понимание принципов событийно-ориентированного программирования
    Важно - нужно знать, откуда копипастить.
    Тебе нужно быть очень хорошо знакомым с одной-двумя-тремя популярными библиотеками на JavaScript. В идеале ты должен иметь представление о том, что определённый класс задач может быть решен с помощью определённых библиотек, хотя бы одной, но такие знания приходят с практикой. Вообще ты должен быть знаком с ними так близко, чтобы помнить, в какой части мануала по библиотеке можно найти описание форматов входных данных нужной тебе функции и какой будет результат, чтобы скопировать и вставить в свой код, а потом поправить, чтобы работало.

    Важно - инструменты программиста JavaScript
    У тебя должен быть удобный инструмент для разработки (IDE, Integrated Development Environment), чтобы он тебе подсвечивал код (syntax highlight) и подсказывал о синтаксических ошибках (syntax check), о формальных параметрах функций (type hinting), о стиле кодирования (code style), помогал писать код (live templates).
    Ты должен знать, как отлаживать скрипты в популярных браузерах (Firebug, Chrome Developer Tools и другое). Что такое точки останова, как управлять исполнением во время останова, как посмотреть и поменять содержимое переменных, как настроить останов по условию.

    Хотелось бы узнать что это за задачи(упомянутые вами 80%)


    Реальные задачи джунов:
    1. Возьми из сборника задач по javascript любой скрипт случайно и вслух расскажи, что он делает.
      Важно - читать и понимать чужой код намного важнее, чем писать свой. И на работе тебе это приддётся делать чаще, чем ты думаешь. Чтобы подключить к своему проекту чужую JS либу, нужно понимать что она делает, как она конфигурируется, как управлять её поведением. Скажу точно, что написать свой скрипт, который строит графики, намного сложнее, чем понять, как настраивается highcharts.

    2. Напиши скрипт на JS, который в заданном тексте удалит один или два символа, выбранных случайно
      1. Усложнение: удалять можно только буквы в словах, а знаки пунктуации и цифры удалять нельзя
      2. Усложнение: принять, что этот текст является программной на Javascript, удалить одну-две команды JS, но только если они не в строковых литерах (break как команду удалить можно, а в строке "break my heart" нельзя)
      3. Усложнение: воспользуйся этим скриптом и "попорти" код какого-нибудь другого скрипта на Javascript, а потом отладь, найди ошибку и восстанови работоспособность
      Важно - этим обычно все и занимаются - ищут баги. Только в реальной жизни они и без этого скрипта появляются. И не по одному, а прям пачками.

    3. На страницу HTML нужно встроить график курса доллара по отношению к рублю. Формат входного массива значений курса определи сам, исходя из своего скрипта для построения графиков.
      1. Усложнение: на одном графике должны быть два курса, по разным шкалам. Наприме, курс доллара к евро и курс юаня к рублю
      2. Усложнение: первоначально график вывести в детализации по месяцам, но чтобы можно было "приблизить" (drilldown) детализацию до дней
      3. Усложнение: первоначально график вывести текущем месяце, но чтобы можно было загрузить данные для предыдущего месяца без перезагрузки страницы (AJAX)

    4. При клике по картинкам, вставленным в текст HTML, показывать всплывающее окно для просмотра увеличенной картинки.
      1. Усложнение: в всплывающем окне сделать навигацию по картинкам, вперёд/назад и к нужной картинке
      2. Усложнение: в всплывающем окне вместо картинки показать видео-ролик с Youtube
      3. Усложнение: в всплывающем окне показать текст HTML

    5. По клику на кнопку "Click me" показать всплывающую форму.
      1. Усложнение: реализовать проверку данных на корректность перед отправкой формы (непустое значение, минимальное количество символов, максимальное количество символов, минимальное числовое значение, максимальное числовое значение)
      2. Усложнение: если в значении текстового поля встретилась гиперссылка, то считать её за 22 символа при любой длине этой ссылки (как в твитере)
      3. Усложнение: реализовать отправку формы на сервер через AJAX, без перезагрузки страницы
      4. Усложнение: саму форму в виде HTML загрузить с сервера через AJAX, в момент клика по кнопке "Click me", правила проверок данных должны как-нибудь "извлечься" из самой загруженной формы, например из аттрибутов полей ввода

    6. К форме ввода данных на поле ввода даты "навешать" всплывающий календарь для выбора даты.
      1. Усложнение: сделать форму календаря мультиязычной. Хотя бы через настройки на том же JavaScript
      2. Усложнение: сделать так, чтобы с помощью календаря можно было выбрать диапазон дат, чтобы она была привязана к двум полям формы "дата начала" и "дата окончания", и чтобы значение в поле "дата начала" обязательно была меньше чем в поле "дата окончания"
      3. Усложнение: сделать так, чтобы с помощью в календаре можно было видно визуально этот диапазон
      4. Усложнение: диапазон может быть открытым, но не пустым, то есть пользователь должен задать хотя бы дату начала или дату окончания.

    7. Сделать пред-просмотр веб-страницы HTML с разными темами. Тему страницы выбирать через селектор на javascript, а показывать в фрейме.
      1. Усложнение: сделать селектор "тип устройства", чтобы менять размер фрейма (например, "iPhone 5c 1136x640") и "чекбокс" для смены ориентации страницы "горизонтальная" или "вертикальная" (соответственно 1136x640 или 640x1136)
      2. Усложнение: в селекторе тем предусмотреть поиск тем по подстроке, и аналогично поиск устройств по части названия (авто-дополнение, auto-complete)
      3. Усложнение: тема страницы должна меняться без перезагрузки фрейма



    Задачи повышенной сложности, исходя из личного интереса
    1. Реализовать форму для многошагового мастера: форма должна состоять из нескольких страниц (шагов), пользователь может переключать страницы через какие-нибудь элементы управления "вперёд/назад" или "перейти на страницу".
      1. Усложнение: реализовать функциональную связь значений, когда некоторые данные зависят друг от друга (ввёл число в поле "количество" и в поле "сумма" значение пересчиталось)
      2. Усложение: доступность некоторых полей ввода должна зависеть от данных (например, если указал "есть личный самолёт", то значит можно ввести "марка самолёта")
      3. Усложение: видимость некоторых страниц должна зависеть от данных из предыдущих страниц (например, если указал "есть личный самолёт", значит появилась страница "ТТХ самолёта"; иначе страница должна скрыться)

    2. Реализовать однопользовательскую браузерную игру "змейка", "тетрис", "найди пару"
    3. Реализовать многопользовательскую браузерную игру "крестики-нолики", "морской бой" на два игрока в режиме "hot seat"
      1. Усложнение: два игрока на разных компьютерах, ходы передаются по websocket
      2. Усложнение: ограничение на ожидания окончания хода 15 секунд, по окончании ожидания автоматически делается случайный ход

    4. Реализовать todo-list. Пользователь вводит список, затем он превращается в строки с "чек-боксами". Когда "чекбокс" включен, строка зачёркивается.
      1. Усложнение: пользователь может переименовывать, удалять, добавлять строки
      2. Усложнение: список хранить в localStorage браузера, чтобы при перезагрузке страницы он восстанавливался
      3. Усложнение: пользователь может иметь несколько независимых списков todo

    5. Реализовать простой графический редактор. Пусть рисуется точка в месте, где пользователь кликнул.
      1. Усложнение: добавить переключатель режимов "точка"/"линия", в режиме "линия" рисуются линии между двумя последовательно кликнутыми точками
      2. Усложнение: можно менять толщину, цвет линий, размер точек
      3. Усложнение: последовательность кликов можно воспроизвести ещё раз с самого начала, равномерно или с реальной задержкой между кликами, с обычной скоростью или ускоренно
      4. Усложнение: можно выгрузить получившийся рисунок в формате PNG или SVG, причём SVG c анимацией воспроизведения



    Можно использовать любую существующую библиотеку.
    Например,
    для построения графиков www.highcharts.com
    для загрузки и передачи данных через AJAX: jquery.com + что-нибудь на сервере
    для всплывающих диалогов с картиками, видео и формами: fancyapps.com/fancybox и https://jqueryui.com/dialog/
    для валидации форм rickharrison.github.io/validate.js
    для календаря https://jqueryui.com/datepicker/
    для автодополнения https://jqueryui.com/autocomplete/
    для передачи данных между несколькими пользователями socket.io или обычный AJAX
    Ответ написан
    16 комментариев
  • Как сверстать такой блок?

    zorro76
    @zorro76
    Для начала читаем об polygons, ну а дальше ничего сложного, иконки и выделение линий можно псевдоелементами
    Ответ написан
    Комментировать
  • Как сделать интерактивную карту?

    dummyman
    @dummyman
    диссидент-схизматик
    Есть такой фреймворк openlayers
    Вот ссылка на пример openlayers.org/en/latest/examples/select-features.html
    там разделение по государствам, нужно будет вместо https://openlayers.org/.../geojson/countries.geojson составить свой файл geojson по областям
    Данные берем отсюда gis-lab.info/qa/osm-adm.html
    Стили карт берем тут https://www.mapbox.com/maps/
    15-30 минут на все и карта готова.
    Ответ написан
    2 комментария
  • Как сделать интерактивную карту?

    @svetlov97
    Используй SVG графику.
    Документация: https://developer.mozilla.org/ru/docs/Web/SVG
    Ответ написан
    Комментировать
  • Как сделать интерактивную карту?

    @imhuman
    SVG карту с нужным оформлением и маркерами можно сгенерировать тут pixelmap.amcharts.com
    Ответ написан
    Комментировать
  • Как сделать интерактивную карту?

    bootd
    @bootd Куратор тега CSS
    Гугли и ты откроешь врата знаний!
    svg. Дизайнер рисует тебе карту России в векторе и отмечает на ней точки, а дальше сам. Иначе ищешь векторную карту в интернете. Если на ней нет нужных точек, то открываешь карту в илюстраторе, рисуешь кружки в нужных местах,. Делов то!!

    Есть например такой сервис. Там есть разные карты. Я скинул карту РФ. Но она какая-то не полная, хотя я в географии не силён. Сам часто использовал эту карту
    Ответ написан
    Комментировать
  • Как сверстать список у которого маркеры в виде градиента?

    monochromer
    @monochromer
    DIVeloper
    Можно прибегнуть к хаку - сделать достаточно большой белый box-shadow:
    box-shadow: 0 0 0 9999px #fff;
    А градиент наложить на весь список. Пунктам меню задать обрезку overflow: hidden;.

    пример - https://codepen.io/monochromer/pen/VWWBgp?editors=1100
    Ответ написан
    7 комментариев
  • Как реализовать запуск css анимации по клику на button?

    @alvik48
    Frontend & Node.js developer
    Вряд ли вам поможет, но вот разные фокусы вообще без js: jsfiddle.net/85Ypv
    Ответ написан
    Комментировать
  • Как обстоят дела с веб-разработкой и программированием на Mac Os?

    a13xsus
    @a13xsus
    Lazy developer
    Дык это можно сказать идеальная среда для этого. Как программная, так и аппаратная.
    Ответ написан
    Комментировать
  • Как сверстать список у которого маркеры в виде градиента?

    @devstudent
    frontend-developer
    использовать цикл less
    UPD: дизайнер гений. ЗАЧЕМ нумерации пунктов такой сложный фон. если начальаня и конечная точка градиаента фиксированы, то нужен JS
    upd-2: сделайте градиентный фон для ul , для li белый, для маркеров прозрачный. должно получиться )))
    Ответ написан
    5 комментариев
  • Какой библиотекой можно сделать круговые диаграммы и чарты?

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

    AlexBelkevich
    @AlexBelkevich
    Нет нерешаемых задач. Есть деревянные клиенты
    Ускорить верстку - избавиться от ФШ и пользоваться Avocode) Верстка пойдет быстрее))
    Ответ написан
  • Как ускорить вёрстку?

    iNickolay
    @iNickolay
    Если у вас ещё нет - то обязательно создать (или использовать готовый, например html5 Boilerplate) стартовый шаблон под вёрстку, где включены все используемые вами решения (пример).
    Ну и как уже писали выше - пользоваться SASS, GULP.
    Из фреймворков - пользоваться теми, что знаете.
    Ответ написан
    Комментировать
  • Что делать если команда говнокодит?

    saintbyte
    @saintbyte
    Django developer
    Постареть и понять пока хипстеры дрочат на говнокод , старые задроты выкатывают прототип и получают финанирование.
    Ответ написан
    11 комментариев