This media is not supported in your browser
VIEW IN TELEGRAM
‼️Всем кодерам посвящается‼️
Code Ready — полезные ресурсы, шпаргалки, плагины, разработка веб-приложений, и многое другое для твоих проектов, сразу с готовым кодом, и примером их использования.
🪩Расставь приоритеты, добавь лёгкости в свою работу и становись лучше с @code_ready
Original post link: t.me/seniorFront/4102
Forwarded and filtered by @smartfeed_bot
Code Ready — полезные ресурсы, шпаргалки, плагины, разработка веб-приложений, и многое другое для твоих проектов, сразу с готовым кодом, и примером их использования.
🪩Расставь приоритеты, добавь лёгкости в свою работу и становись лучше с @code_ready
Original post link: t.me/seniorFront/4102
Forwarded and filtered by @smartfeed_bot
Forwarded from Веб-страница
Самые популярные вопросы на собеседовании фронтенд-разработчика
Это 55 выпуск видеокаста «Front-end. Вопросы на собеседовании».
В серии видео автор помогает подготовиться к собеседованиям на позицию джуниор и мидл фронтенд-разработчик.
Видеокаст представлять из себя коллекцию технических вопросов, которые можно получить на интервью: https://www.youtube.com/watch?v=PI1X5oFHou8
В этом выпуске:
— Что такое хвостовая рекурсия? Оптимизация рекурсии?
— Что такое и как работает debounce() и throttle() в JavaScript?
— Как в JavaScript работают декораторы? Как они могут быть использованы для модификации поведения классов и методов?
— Как можно создавать пользовательское событие (custom events) в JavaScript?
— Что такое IndexedDB? Как работает IndexedDB?
— Расскажите о методе requestAnimationFrame()?
— Как работают дефолтные параметры в ES6?
— Что такое «BigInt» в ES2020 и для чего он используется?
— Какие нововведения были представлены в ECMAScript 2021 (ES12)?
— Что такое fetch()? Как работает функция fetch()?
— Что такое JSON в JavaScript? Как его можно использовать?
— Что такое и как работает коэффициент сжатия (compression ratio) в контексте веб-разработки?
#собеседование #фронтенд
Это 55 выпуск видеокаста «Front-end. Вопросы на собеседовании».
В серии видео автор помогает подготовиться к собеседованиям на позицию джуниор и мидл фронтенд-разработчик.
Видеокаст представлять из себя коллекцию технических вопросов, которые можно получить на интервью: https://www.youtube.com/watch?v=PI1X5oFHou8
В этом выпуске:
— Что такое хвостовая рекурсия? Оптимизация рекурсии?
— Что такое и как работает debounce() и throttle() в JavaScript?
— Как в JavaScript работают декораторы? Как они могут быть использованы для модификации поведения классов и методов?
— Как можно создавать пользовательское событие (custom events) в JavaScript?
— Что такое IndexedDB? Как работает IndexedDB?
— Расскажите о методе requestAnimationFrame()?
— Как работают дефолтные параметры в ES6?
— Что такое «BigInt» в ES2020 и для чего он используется?
— Какие нововведения были представлены в ECMAScript 2021 (ES12)?
— Что такое fetch()? Как работает функция fetch()?
— Что такое JSON в JavaScript? Как его можно использовать?
— Что такое и как работает коэффициент сжатия (compression ratio) в контексте веб-разработки?
#собеседование #фронтенд
👩💻 Как написать правильный API-клиент на Typescript
В этой статье подробно расскажут о реализации API-клиента на языке TypeScript для работы как со сторонними API, так и со своими собственными. Клиент может работать с публичными и защищенными эндпойнтами и не привязан к конкретному фреймворку, что делает его пригодным для использования в React, Vue, Svelte и других фреймворках.
Читать...
Original post link: t.me/frontendnoteschannel/3595
Forwarded and filtered by @smartfeed_bot
В этой статье подробно расскажут о реализации API-клиента на языке TypeScript для работы как со сторонними API, так и со своими собственными. Клиент может работать с публичными и защищенными эндпойнтами и не привязан к конкретному фреймворку, что делает его пригодным для использования в React, Vue, Svelte и других фреймворках.
Читать...
Original post link: t.me/frontendnoteschannel/3595
Forwarded and filtered by @smartfeed_bot
Библиотека программиста
📜 Как написать правильный API-клиент на Typescript
В этой статье я подробно расскажу о реализации API-клиента на языке TypeScript для работы как со сторонними API, так и со своими собственными. Клиент может работать с публичными и защищенными эндпойнтами и не привязан к конкретному фреймворку, что делает…
This media is not supported in your browser
VIEW IN TELEGRAM
Revealing Slider
Реализовано на HTML и SCSS. Анимация переключения создана при помощи CSS clip-path.
👉 @seniorFront
Original post link: t.me/seniorFront/4105
Forwarded and filtered by @smartfeed_bot
Реализовано на HTML и SCSS. Анимация переключения создана при помощи CSS clip-path.
👉 @seniorFront
Original post link: t.me/seniorFront/4105
Forwarded and filtered by @smartfeed_bot
🖥 Создание собственного графического клиента ChatGPT с помощью NextJS и Wing
К концу этой статьи вы создадите и развернете клиент ChatGPT с помощью Wing и Next.js. Это приложение может запускаться локально (в локальном облачном симуляторе) или развертываться у вашего собственного облачного провайдера.
Читать...
Original post link: t.me/frontendnoteschannel/3596
Forwarded and filtered by @smartfeed_bot
К концу этой статьи вы создадите и развернете клиент ChatGPT с помощью Wing и Next.js. Это приложение может запускаться локально (в локальном облачном симуляторе) или развертываться у вашего собственного облачного провайдера.
Читать...
Original post link: t.me/frontendnoteschannel/3596
Forwarded and filtered by @smartfeed_bot
Хабр
Создание собственного графического клиента ChatGPT с помощью NextJS и Wing
P. S: К концу этой статьи вы создадите и развернете клиент ChatGPT с помощью Wing и Next.js. Это приложение может запускаться локально (в локальном облачном симуляторе) или развертываться у вашего...
JavaScript. Напишите функцию
Ответ
Original post link: t.me/senior_front/2019
Forwarded and filtered by @smartfeed_bot
order, которая принимает строку и возвращает её вариант, очищенный от цифр, вшитых в каждое слово, и отсортированный на основе этих цифр.Ответ
Original post link: t.me/senior_front/2019
Forwarded and filtered by @smartfeed_bot
🖥 Grass – макет для сайта про ИИ. Основной цвет – салатовый, смешанный с бирюзовым. В макете есть небольшие модальные окна и интересная инфографика.
Сайтодел | #макет #figma
Original post link: t.me/sitodel/1780
Forwarded and filtered by @smartfeed_bot
Сайтодел | #макет #figma
Original post link: t.me/sitodel/1780
Forwarded and filtered by @smartfeed_bot
Когда ты веб-разработчик и не можешь придумать, что подарить второй половинке: девушка в Твиттере рассказала, что сделала для своего мужа сайт, где можно выбрать, что он хочет на ужин.
Интересно только, что за валюта такая «lisoin»
Как думаете, правда или опять не выдуманные истории из жизни для расширения портфолио и саморекламы?
#петпроект
Original post link: t.me/tproger_web/4582
Forwarded and filtered by @smartfeed_bot
Интересно только, что за валюта такая «lisoin»
Как думаете, правда или опять не выдуманные истории из жизни для расширения портфолио и саморекламы?
#петпроект
Original post link: t.me/tproger_web/4582
Forwarded and filtered by @smartfeed_bot
This media is not supported in your browser
VIEW IN TELEGRAM
CSS Card Hover Effects
Анимация при наведении на карточки, выполненная на чистом CSS, без использования JavaScript.
https://codepen.io/Jhonierpc/pen/MWgBJpy
Original post link: t.me/senior_front/2020
Forwarded and filtered by @smartfeed_bot
Анимация при наведении на карточки, выполненная на чистом CSS, без использования JavaScript.
https://codepen.io/Jhonierpc/pen/MWgBJpy
Original post link: t.me/senior_front/2020
Forwarded and filtered by @smartfeed_bot
This media is not supported in your browser
VIEW IN TELEGRAM
Neon Clock
Оригинальный часы, логика работы которых реализована в JS. Свёрстано на HTML и SCSS.
👉 @seniorFront
Original post link: t.me/seniorFront/4108
Forwarded and filtered by @smartfeed_bot
Оригинальный часы, логика работы которых реализована в JS. Свёрстано на HTML и SCSS.
👉 @seniorFront
Original post link: t.me/seniorFront/4108
Forwarded and filtered by @smartfeed_bot
Forwarded from SMLTECH
Сага о микросервисах и SAGA 📕
Самое сложное в работе с микросервисами — распределённые транзакции, где нет единой базы данных и единой точки входа, а ошибки просто так не откатить 🔙
Решений для оптимизации процесса много, однако у большинства из них весомые недостатки. Оптимальная опция — паттерн SAGA. Он обеспечивает независимые транзакции, а также позволяет быстро откатить изменения. Например, в доставке еды, где происходит подтверждение оплаты, а затем — запрос в ресторан на готовку. Если с оплатой проблема — заказ в ресторане отменится.
У SAGA два паттерна: оркестрация и хореография. В первом случае координатор создает заявку, проверяет её на объёмы и дефекты, а затем отправляет на выполнение. Во втором случае каждый микросервис сам определяет действия на основе событий.
Узнать о процессах больше можно в докладе Антона Ершова, руководителя функции бэкенда в Самолете 10D, на Moscow Python Meetup №90. 🏗️
#шерим
Самое сложное в работе с микросервисами — распределённые транзакции, где нет единой базы данных и единой точки входа, а ошибки просто так не откатить 🔙
Решений для оптимизации процесса много, однако у большинства из них весомые недостатки. Оптимальная опция — паттерн SAGA. Он обеспечивает независимые транзакции, а также позволяет быстро откатить изменения. Например, в доставке еды, где происходит подтверждение оплаты, а затем — запрос в ресторан на готовку. Если с оплатой проблема — заказ в ресторане отменится.
У SAGA два паттерна: оркестрация и хореография. В первом случае координатор создает заявку, проверяет её на объёмы и дефекты, а затем отправляет на выполнение. Во втором случае каждый микросервис сам определяет действия на основе событий.
Узнать о процессах больше можно в докладе Антона Ершова, руководителя функции бэкенда в Самолете 10D, на Moscow Python Meetup №90. 🏗️
#шерим
This media is not supported in your browser
VIEW IN TELEGRAM
Minimalist Thermostat
Регулировка температуры, выполненная с помощью SVG, CSS и библиотеки GSAP.js
https://codepen.io/jkantner/pen/rNpbMjO
Original post link: t.me/senior_front/2022
Forwarded and filtered by @smartfeed_bot
Регулировка температуры, выполненная с помощью SVG, CSS и библиотеки GSAP.js
https://codepen.io/jkantner/pen/rNpbMjO
Original post link: t.me/senior_front/2022
Forwarded and filtered by @smartfeed_bot
Годных codepen-проектов вам в ленту: Newton's CSS cradle — Колыбель Ньютона
Проект реализован с помощью SCSS. Исходники: https://codepen.io/amit_sheen/pen/XWMXwvJ
👍 — юзабельно
🗿 — троллейбус_из_буханки_хлеба.jpg
#codepen
Original post link: t.me/tproger_web/4586
Forwarded and filtered by @smartfeed_bot
Проект реализован с помощью SCSS. Исходники: https://codepen.io/amit_sheen/pen/XWMXwvJ
👍 — юзабельно
🗿 — троллейбус_из_буханки_хлеба.jpg
#codepen
Original post link: t.me/tproger_web/4586
Forwarded and filtered by @smartfeed_bot
Какие JS-библиотеки использовать для анимаций на сайте?
JS-библиотек более тысячи — они постоянно обновляются, а многие из них создаются сообществом. Собрали и попробовали самые актуальные библиотеки для разработки анимации, такие как Anime.js, Popmotion, Vivus.js, Mo.js и другие.
Делимся обзором на лучшие из них с вами: https://tproger.ru/articles/kakie-js-biblioteki-ispolzovat-dlya-animacij-na-sajte-v-2024-godu
#javascript
Original post link: t.me/tproger_web/4587
Forwarded and filtered by @smartfeed_bot
JS-библиотек более тысячи — они постоянно обновляются, а многие из них создаются сообществом. Собрали и попробовали самые актуальные библиотеки для разработки анимации, такие как Anime.js, Popmotion, Vivus.js, Mo.js и другие.
Делимся обзором на лучшие из них с вами: https://tproger.ru/articles/kakie-js-biblioteki-ispolzovat-dlya-animacij-na-sajte-v-2024-godu
#javascript
Original post link: t.me/tproger_web/4587
Forwarded and filtered by @smartfeed_bot
This media is not supported in your browser
VIEW IN TELEGRAM
Бесплатный разбор для улучшения кода
В среду 29 мая в 20:00 по мск присоединяйтесь посмотреть, как лид фронтенд-разработки разбирает чужой код.
Стек: HTML, CSS, React и Vite.
👉 Подробности здесь.
Подпишитесь на канал, чтобы не пропустить эфир.
Original post link: t.me/seniorFront/4110
Forwarded and filtered by @smartfeed_bot
В среду 29 мая в 20:00 по мск присоединяйтесь посмотреть, как лид фронтенд-разработки разбирает чужой код.
Стек: HTML, CSS, React и Vite.
👉 Подробности здесь.
Подпишитесь на канал, чтобы не пропустить эфир.
Original post link: t.me/seniorFront/4110
Forwarded and filtered by @smartfeed_bot
👩💻 Collapsible Timeline
Таймлайн с возможностью раскрывать пункты. Сделан на SVG, CSS и JavaScript.
Открыть код
Original post link: t.me/frontendnoteschannel/3600
Forwarded and filtered by @smartfeed_bot
Таймлайн с возможностью раскрывать пункты. Сделан на SVG, CSS и JavaScript.
Открыть код
Original post link: t.me/frontendnoteschannel/3600
Forwarded and filtered by @smartfeed_bot
codepen.io
Collapsible Timeline
A timeline with animated collapsible descriptions for each item. Source for Unix facts: [Wikipedia](https://en.wikipedia.org/wiki/Unix_time)....
✍️ Thunder – узкий шрифт, который подходит для крупных заголовков и используется для создания контраста. Пример можно увидеть в макете Abstract 3D Coral Shapes
Сайтодел | #шрифт
Original post link: t.me/sitodel/1781
Forwarded and filtered by @smartfeed_bot
Сайтодел | #шрифт
Original post link: t.me/sitodel/1781
Forwarded and filtered by @smartfeed_bot
This media is not supported in your browser
VIEW IN TELEGRAM
Fullscreen drag-slider with parallax
Оригинальный слайдер, логика работы которого реализована в JS. Стилизовано в SCSS.
👉 @seniorFront
Original post link: t.me/seniorFront/4112
Forwarded and filtered by @smartfeed_bot
Оригинальный слайдер, логика работы которого реализована в JS. Стилизовано в SCSS.
👉 @seniorFront
Original post link: t.me/seniorFront/4112
Forwarded and filtered by @smartfeed_bot