Дмитрий Pacification

Вам уже посоветовали отличные книги.
В 2017 году, так же доступно несколько более прогресивных форматов обучения:

1. Курсы
   
   • Алгоритмы: теория и практика. Методы (https://stepik.org/course/217)
     
   • Алгоритмы: теория и практика. Структуры данных (https://stepik.org/course/1547)
     
   • Специализации https://www.coursera.org/specializations/algorithms, https://www.coursera.org/specializations/data-stru...
     
   
   обязательно выполняйте практические задания, которые дают на курсах, без них знания быстро вывертиваются из головы.
   
   
2. Сразу начинайте решать задачки с leetcode.com, hackerrank.com и т.п.
   
   
3. Участвуйте в соревнованиях типа Яндекс.Алгоритм или Russian CodeCup первые 1-2 задачи можно решить не имея специальных знаний по алгоритмам.

1) Треугольная форма прогресс-бара делается бордерами: https://css-tricks.com/snippets/css/css-triangle/

2) Движение ползунков, ключевые моменты:
Событие mousedown вы отслеживаете на ползунке либо на прогресс-баре.
Внутри обработки mousedown вешаете события mousemove и mouseup на document или window (не забудьте их убрать по mouseup)

Во время mousemove вычисляете положение курсора относительно левого края слайдера (например event.clientX - sliderElement.getBoundingClientRect().left).

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

Еще, для адаптивности, желательно все из пикселей в % переводить

1.Нужна ли верстка и js для Java?Если да,то насколько глубокими должны быть знания?

Для javascript - нужна верстка на хорошем уровне
Для java - не нужна

2.Что так бэкэнд и фронтэнд я уже вроде разобралась.Но все же.Может кто нибудь объяснит доступным языком разницу между ними,какие это языки и что бы было хорошо знать дополнительно к этому?

фронт - исполняется в браузере. ЯП -javascript
Бекенд - исполняется на сервере

3.А с какого языка вообще стоило бы начать изучение?

С любого, желательно с английского

before, after, position: absolute, а родителю position: relative

Принципиальная особенность (достоинство) этого способа – в том, что геометрия самих букв тоже изменяется. Напр. в букве "H" параллельные вертикальные становятся непараллельными, получив перспективное искажение. Т.е. это 100% честное искажение всей картинки, а не разброс букв по отдельности.

Способ: отрисовать этот текст в SVG, из него сделать canvas в разрешении с запасом – в несколько раз больше нужного. В canvas применить нужные искажения (легкая фраза, за которой куча сложностей, в т.ч. математика и антиалиасинг).

Вставить как data-uri и просто новые canvas.

Сделал пример, в котором из такого:

<svg xmlns="http://www.w3.org/2000/svg"
     width="920" height="160" viewBox="0 0 230 40">
  <text text-anchor="middle" x="115" y="32" font-family="Times New Roman" font-size="35">
    Hello, Toster
  </text>
</svg>

получается такая картинка:

P.S. там всё сыро, надо ещё по краям области билиниар интерполяцию прозрачности, что ли, сделать..

Поместить каждую букву в отдельный блок и повернуть все буквы с помощью transform: rotate и transform-origin.

https://css-tricks.com/set-text-on-a-circle/
circletype.labwire.ca

фотошоп запили на жсе, выложи на гитхаб - слава и популярность в кармане.

Отвечаю как заказчик, выставлял свои заказы, получал дебильные отклики:

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

Это настолько достает, что многие заказчики выставляют в описании задачи ловушки типа "если вы дочитали до сюда, то можете смело мне писать, укажите в вашем отклике на мою работу ключевую фразу "ёжики не могут иметь детей потому что колючие"

Нужно откликаться так, чтобы было понятно, что ты прочитал задачу.
Можно сразу предложить варианты решения (пара предложений, без деталей).

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

Сам я прекрасно брал работы, даже когда начинал обращение с предложением поднять оплату в 1,5-2-3 раза относительно желаемого заказчиком.
Разумеется, это все было не с потолка, а с моих реальных оценок сложности работ.

Не пиши отклик, если не видишь внятного описания задачи.
С большой вероятностью сами не знают что хотят и не разбираются в том, кто им нужен.
Больше времени потеряешь.

Мне хватило подключить jQuery в plugin

plugins: [
  new webpack.ProvidePlugin({
    $: "jquery/dist/jquery.min.js",
    jQuery: "jquery/dist/jquery.min.js",
    "window.jQuery": "jquery/dist/jquery.min.js"
  })
];

(взял за основу рецепт отсюда)
После чего в глобальной области видимости все три варианта вызова jquery будут работать, больше ничего подключать не надо.

Сам jQuery я скачивал через bower, поэтому дополнительно подключил пути, где будут искаться модули

resolve: {
        root: ['./bower_components']
    }

в вашем случае, предполагаю 'bower_components' можно заменить на 'vendor' (путь будет от корня проекта).

require('../../vendors/jquery.js') внутри blocks\slider\index.js уже не нужен будет, достаточно будет просто подключить файл jquery.slider.js

Webpack 2: https://webpack.js.org/plugins/provide-plugin/
Ставим jquery через npm и радуемся

На stepic.org есть курс "Анализ безопасности веб-проектов"

Я бы конечно определился, что такое более глубокое понимание. Для себя я бы обозначил глубокое понимание, как умение решать "бизнес-задачи" на языке JavaScript, наиболее эффективным образом.

Глубокое понимание, уже перестает относиться только к JavaScript, а начинает очень тесно взаимодействовать с общими паттернами которые есть в программировании.

Знать и уметь применять паттерны проектирования:

- Singleton
- publish/subscribe
- factory
- proxy
- facade
- strategy

Понимать структуры данных и понимать для чего эти структуры предназначены, сложности алгорит:

- Список, связанный список
- Деревья, бинарные деревья
- Очередь/Стек
- Графы

Уметь писать в ООП парадигме и в функциональном стиле, просто чистый код:

- SOLID
- fp (pipe, compose, curry, functor, monads, etc)
- SOA, понимание Service-oriented architecture

Понимание работы компилятора и интерпретатора, MaxKorz хорошо уточнил.

Можно попробовать что-то вроде, только это затронет и те стили, которые прописаны в атрибуте style
$('#someDiv').attr('style','');

Скрипач не нужен, родной (с)
Аргументы против jq:
- современные браузеры достаточно хорошо поддерживают единый синтаксис современного екмаскрипт(native js)(на самом деле нет).
- сторонняя библиотека, работает медленнее чем натив и в основном состоит из с-сахара (тоже не совсем правда)
- тащить еще один ресурс весом от 64 кб до 200 кб, еще и со сторонних ресурсов замедляет загрузку( правда, но бред)
Аргументы за:
- Современные браузеры как и всегда один другого "ровнее", всегда есть косяки и "нюансы", на которые еще и попадаешь обычно в самый неподходящий момент, в жк обычно все работает одинаково везде, ну или лучше чем в нативе.
- В жк реализована куча плюшек в 1 функцию которые в нативе занимают "многабукав", не каждый начинающий напишет их правильно, да и профи не все напишут оптимально, уверен что в большинстве случаев написанный нативом функционал будет хуже аналога из жк.
- размер мин пакета жк 64 кб, и все они лежат на быстрых цдн серверах. Думаю это последнее что может повлиять на скорость загрузки страницы.
- есть ОГРОМНОЕ количество скриптов написанных с учетом жк, не использовать их глупо, писать свой велосипед - вообще только в целях обучения(не берем крайние случаи когда плагин писал упоротый пингвин).
- Синтаксис и краткость записи - вообще вне конкуренции.
- Старые браузеры никто не отменял, часто заказчик требует чтобы работало в ие8, натив не канает или доставляет море анального удовольствия.
Вывод: Если ты крут в жс, еще и работаешь в ангуларе/ещечетамдляфронта и тебе нужно сделать 2 действия в очень современных браузерах - jquery не нужен, и ты это сам знаешь. Если слова ангулар, вуе и проч для тебя не больше чем шум листвы за окном, а навесить плагинов и эффектов нужно - jquery наше все.

UPD: для всех кто там отписался а ля "в связи (...), исчезновением проблемы совместимости со старыми IE (что и было основным назначением jQuery)." - свежачок

www.html5rocks.com/ru/tutorials/internals/howbrows...