Источники вдохновения для Front End разработчика?

Question

[meltmestnt]

Огромное кол-во источников, где можно выучить теорию по JS, CSS, HTML, но очень мало сайтов, на которых показывают какие-то актуальные фишки по типу раздела "How to" на W3Schools. Если вы знаете какие-то источники, где можно подчерпнуть интересные фишки из практики для верстки или дизайна, то пожалуйста поделитесь ими со мной.

Answer 1

[Александр Аксентьев]

Таки фишки придумывает дизайнер, а разработчик только верстает то что придумал больной мозг дизайнера

Comments

[meltmestnt]

Я скорее не совсем внятно выразился. Мне скорей интересна реализация фишек, которые активно используются. По типу анимации рядом с курсором, плавной навигации по странице. Что-то вроде этого: https://index.studio/ (необычная навигация по странице, курсор и т.д...) Очень интересно как это все реализуется

[Stalker_RED]

meltmestnt,
1. выясняете как называется эта фишка
2. вбиваете в гугл "how to название"
3. ????
4. PROFIT!

[Johny Smith]

Stalker_RED,

фишка

это самое сложное, у американцев уже это именем нарицательным стало, и тоже обрело своё ключевое слово "Buzzword", если комуто например чтото пытаетесь говорить, и забудете какойто термин, то вы будучи носителем скажете "Give me the word!" и крауд вокруг подскажет. Человек конечно ходячий талмуд терминологий, но не настолько чтобы разбираться в них не зная вообще как они называются, а зная только что они могут сделать.

[Johny Smith]

Stalker_RED, получить ответ на то как то или иное чтото называется это уже считай 99.99999% решённой проблемы

[Johny Smith]

Stalker_RED, там есть ещё Should I
надо составить наверное даже какойто словарь из часто начинающихся предложений с вопроса, прогнать через чтото какуюто базу, и на всех языках мира

[Johny Smith]

Stalker_RED, французы слышал ещё хорошо кодят, но мы отрезаны языковым барьером от их знаний полностью, напрочь, как за стенкой

[Stalker_RED]

Olek1, в данном случае слово "фишка" процитироано с комментария meltmestnt, на который я и отвечал. Соглашуь, что уместнее было бы слово "фича" (feature), или даже какой-то русскоязычный аналог, вроде "штуковины".

Многие французы умеют в английский и пишут комментарии и мануалы на нем.
Все чаще попадается непонятный португальский.испанский и китайский. И гугл-транслейт выручает не всегда.

Answer 2

[Shadowman69]

Только никому не рассказывайте))))
тыць
еще раз тыць

Comments

[Shadowman69]

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

Answer 3

[Danil Sapegin]

https://css-tricks.com/

Answer 4

[profesor08]

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

Для анимации всего есть gsap, под всем я понимаю буквально все. Ты можешь анимировать изменение любого свойства любого объекта. А в onUpdate можешь делать какую-то логику, в зависимости от значения obj.a

let obj = {a: 0};
new TimelineMax({
  onUpdate: function() {}
})
  .fromTo(obj, .5, {
    a: 0  
  }, {
    a: 1
  });

Ну а самое крутое, самое производительно и самое сложное, это glsl шейдеры, они какраз исползуются для эффекта под курсором из твоего примера.