This media is not supported in your browser
VIEW IN TELEGRAM
Toaster
Создано на HTML и SCSS.
https://codepen.io/klaufel/pen/OJQBpVQ
Original post link: t.me/senior_front/2015
Forwarded and filtered by @smartfeed_bot
Создано на HTML и SCSS.
https://codepen.io/klaufel/pen/OJQBpVQ
Original post link: t.me/senior_front/2015
Forwarded and filtered by @smartfeed_bot
👩💻 Топ-10 заданий по написанию кода для собеседования по React.js в 2024 году
Эти 10 заданий по созданию кода с примерами решений помогут закрепить основные теоретические понятия React.js и прокачать практические навыки. Изучение лучших сценариев написания кода — верный путь к успешному прохождению собеседования.
Читать...
Original post link: t.me/frontendnoteschannel/3589
Forwarded and filtered by @smartfeed_bot
Эти 10 заданий по созданию кода с примерами решений помогут закрепить основные теоретические понятия React.js и прокачать практические навыки. Изучение лучших сценариев написания кода — верный путь к успешному прохождению собеседования.
Читать...
Original post link: t.me/frontendnoteschannel/3589
Forwarded and filtered by @smartfeed_bot
NOP::Nuances of programming
Топ-10 заданий по написанию кода для собеседования по React.js в 2024 году
Эти 10 заданий по созданию кода с примерами решений помогут закрепить основные теоретические понятия React.js и прокачать практические навыки. Изучение лучших сценариев написания кода — верный путь к успешному прохождению собеседования.
Forwarded from Senior Frontend - javascript, html, css
Отрицание, торг и принятие работы над проектом без документации
В мире разработки программного обеспечения существует множество вызовов, и одним из них является столкновение с проектами, лишенными должной документации. Это часто вызывает чувство потерянности и озадаченности, подобно тому как путник оказывается в темном лесу без карты и компаса. В таких моментах первая мысль, которая приходит в голову, - "Может, лучше свернуть назад?"
Однако, несмотря на первоначальное замешательство, такие ситуации предоставляют уникальную возможность стать настоящим героем проекта. Представьте себе, каким уважаемым и крутым специалистом вы станете, создавая систему документации с нуля!
С таким мощным стимулом автор статьи и решила приступить к делу:
1. Разработка шаблонов для стандартизации: Начнем с того, что создадим набор шаблонов, которые помогут нам описывать каждый аспект проекта в едином стиле и формате. Это не только облегчит процесс документирования, но и сделает его более удобным и понятным для всей команды.
2. Анализ базы данных: База данных является краеугольным камнем любого проекта. Без глубокого понимания ее структуры невозможно построить четкую картину всего проекта. Поэтому мы начнем с детального анализа базы данных, чтобы убедиться, что мы имеем полное представление о ее структуре и связях между данными.
3. Создание сервисной карты: Давайте разложим все сервисы и их взаимосвязи на столе. Это поможет нам визуализировать работу нашей системы в целом и лучше понять ее архитектуру. Кроме того, это даст нам возможность выявить возможные узкие места и проблемные зоны, которые требуют дополнительного внимания.
4. Документация процесса тестирования: Четко описанный процесс тестирования - это ключевой элемент успешного проекта. Он не только помогает нам обеспечить качество продукта, но и повышает эффективность работы всей команды. Поэтому мы обязательно займемся созданием подробной документации по процессу тестирования, чтобы у нас была ясная стратегия и план действий на каждом этапе разработки.
5. Описание сценариев использования (use case): Представим себя в роли пользователя и опишем типичные сценарии использования нашего продукта. Это поможет нам лучше понять его функционал и потребности пользователей, а также выявить возможные улучшения и дополнительные функциональные требования.
6. Документация API с использованием Swagger: Документация API - это неотъемлемая часть любого современного проекта. Она позволяет другим разработчикам легко и эффективно взаимодействовать с нашим продуктом, используя наши API.
👉 @seniorFront
В мире разработки программного обеспечения существует множество вызовов, и одним из них является столкновение с проектами, лишенными должной документации. Это часто вызывает чувство потерянности и озадаченности, подобно тому как путник оказывается в темном лесу без карты и компаса. В таких моментах первая мысль, которая приходит в голову, - "Может, лучше свернуть назад?"
Однако, несмотря на первоначальное замешательство, такие ситуации предоставляют уникальную возможность стать настоящим героем проекта. Представьте себе, каким уважаемым и крутым специалистом вы станете, создавая систему документации с нуля!
С таким мощным стимулом автор статьи и решила приступить к делу:
1. Разработка шаблонов для стандартизации: Начнем с того, что создадим набор шаблонов, которые помогут нам описывать каждый аспект проекта в едином стиле и формате. Это не только облегчит процесс документирования, но и сделает его более удобным и понятным для всей команды.
2. Анализ базы данных: База данных является краеугольным камнем любого проекта. Без глубокого понимания ее структуры невозможно построить четкую картину всего проекта. Поэтому мы начнем с детального анализа базы данных, чтобы убедиться, что мы имеем полное представление о ее структуре и связях между данными.
3. Создание сервисной карты: Давайте разложим все сервисы и их взаимосвязи на столе. Это поможет нам визуализировать работу нашей системы в целом и лучше понять ее архитектуру. Кроме того, это даст нам возможность выявить возможные узкие места и проблемные зоны, которые требуют дополнительного внимания.
4. Документация процесса тестирования: Четко описанный процесс тестирования - это ключевой элемент успешного проекта. Он не только помогает нам обеспечить качество продукта, но и повышает эффективность работы всей команды. Поэтому мы обязательно займемся созданием подробной документации по процессу тестирования, чтобы у нас была ясная стратегия и план действий на каждом этапе разработки.
5. Описание сценариев использования (use case): Представим себя в роли пользователя и опишем типичные сценарии использования нашего продукта. Это поможет нам лучше понять его функционал и потребности пользователей, а также выявить возможные улучшения и дополнительные функциональные требования.
6. Документация API с использованием Swagger: Документация API - это неотъемлемая часть любого современного проекта. Она позволяет другим разработчикам легко и эффективно взаимодействовать с нашим продуктом, используя наши API.
👉 @seniorFront
И это даже не треть всего кода...
Original post link: t.me/tproger_web/4578
Forwarded and filtered by @smartfeed_bot
Original post link: t.me/tproger_web/4578
Forwarded and filtered by @smartfeed_bot
This media is not supported in your browser
VIEW IN TELEGRAM
Flex Slider
Интерактивный слайдер, выполненный с помощью фреймворка Vue.js. При клике на секцию показывается дополнительная информация.
https://codepen.io/rodleviton/pen/yLPGBZP
Original post link: t.me/senior_front/2016
Forwarded and filtered by @smartfeed_bot
Интерактивный слайдер, выполненный с помощью фреймворка Vue.js. При клике на секцию показывается дополнительная информация.
https://codepen.io/rodleviton/pen/yLPGBZP
Original post link: t.me/senior_front/2016
Forwarded and filtered by @smartfeed_bot
Flexbox Defense — защищаемся башнями и изучаем flexbox
В этой простой игре в стиле Tower Defense вы сможете попрактиковаться в использовании Flexbox CSS. Вас ожидают 12 волн с различными условиями.
Поиграть можно тут:
http://www.flexboxdefense.com/
#css
Original post link: t.me/tproger_web/4579
Forwarded and filtered by @smartfeed_bot
В этой простой игре в стиле Tower Defense вы сможете попрактиковаться в использовании Flexbox CSS. Вас ожидают 12 волн с различными условиями.
Поиграть можно тут:
http://www.flexboxdefense.com/
#css
Original post link: t.me/tproger_web/4579
Forwarded and filtered by @smartfeed_bot
🎨 Цветовая палитра макета "Ice Cream Landing Page"
Сайтодел | #палитра
Original post link: t.me/sitodel/1778
Forwarded and filtered by @smartfeed_bot
HEX | RGB #F094DF | rgb(240,148,223)
#A10520rgb(161,5,32) #400404 | rgb(64,4,4)
⚠️ Цвет копируется одним кликом!Сайтодел | #палитра
Original post link: t.me/sitodel/1778
Forwarded and filtered by @smartfeed_bot
👩💻 Check Done SVG Animated
Красиво анимированная галочка. Сделана на SVG и SCSS.
Открыть код
Original post link: t.me/frontendnoteschannel/3592
Forwarded and filtered by @smartfeed_bot
Красиво анимированная галочка. Сделана на SVG и SCSS.
Открыть код
Original post link: t.me/frontendnoteschannel/3592
Forwarded and filtered by @smartfeed_bot
codepen.io
Check Done SVG Animated
...
Конференция Яндекса по бэкенду
30 ноября в Москве Яндекс проведёт большую конференцию для бэкенд-разработчиков — YaTalks 2019: https://tprg.ru/yatalks191
На мероприятии выступят продвинутые инженеры из Яндекса, Google и других продуктовых компаний, чтобы обсудить самые модные технологии и полезные кейсы.
Если этого мало, то приходите похоливарить на попкорн-сессиях со злободневными вопросами и прокачать навык дебатов на дискуссионных площадках.
Подробная программа и регистрация на сайте: https://tprg.ru/yatalks191
#партнёрский
Original post link: t.me/c/-1001044298783/12068
Forwarded and filtered by @smartfeed_bot
30 ноября в Москве Яндекс проведёт большую конференцию для бэкенд-разработчиков — YaTalks 2019: https://tprg.ru/yatalks191
На мероприятии выступят продвинутые инженеры из Яндекса, Google и других продуктовых компаний, чтобы обсудить самые модные технологии и полезные кейсы.
Если этого мало, то приходите похоливарить на попкорн-сессиях со злободневными вопросами и прокачать навык дебатов на дискуссионных площадках.
Подробная программа и регистрация на сайте: https://tprg.ru/yatalks191
#партнёрский
Original post link: t.me/c/-1001044298783/12068
Forwarded and filtered by @smartfeed_bot
Media is too big
VIEW IN TELEGRAM
Image Slider
В этом видео создается слайдер картинок с нуля на JS.
👉 @seniorFront
Original post link: t.me/seniorFront/4100
Forwarded and filtered by @smartfeed_bot
В этом видео создается слайдер картинок с нуля на JS.
👉 @seniorFront
Original post link: t.me/seniorFront/4100
Forwarded and filtered by @smartfeed_bot
🖥 Дайджест самых интересных публикаций за последние дни:
• HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи.
• Асинхронный веб: WebSocket, Server-Sent Events, Long Polling и Short Polling
• Путь Frontend разработчика. Как им стать?
• React Conf 2024. React v19
Original post link: t.me/frontendnoteschannel/3593
Forwarded and filtered by @smartfeed_bot
• HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи.
• Асинхронный веб: WebSocket, Server-Sent Events, Long Polling и Short Polling
• Путь Frontend разработчика. Как им стать?
• React Conf 2024. React v19
Original post link: t.me/frontendnoteschannel/3593
Forwarded and filtered by @smartfeed_bot
Хабр
HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи. Часть 8
Хабр, я снова пришёл к вам с практическими советами про доступность вместе с Ильёй. Мы показываем, как HTML и CSS могут улучшить или ухудшить её. Напоминаю, что Илья — мой незрячий знакомый, который...
Как вы можете обойти ограничение однопоточности JavaScript для улучшения производительности вычислительно интенсивной задачи?
Используйте Web Workers для выполнения задач в фоновом потоке.
Original post link: t.me/senior_front/2018
Forwarded and filtered by @smartfeed_bot
Используйте Web Workers для выполнения задач в фоновом потоке.
Original post link: t.me/senior_front/2018
Forwarded and filtered by @smartfeed_bot
Стать сотрудником Яндекса быстрее и проще, чем кажется. Участвуйте в днях быстрого найма: решите тестовое, пройдите несколько секций собеседования и получите офер за несколько дней.
Ближайшее Fast Track мероприятие:
• 3–7 июня — для технических менеджеров и Crowd Solutions Architect, офер за 5 дней в команду Crowd.
Зарегистрироваться
Original post link: t.me/frontendnoteschannel/3594
Forwarded and filtered by @smartfeed_bot
Ближайшее Fast Track мероприятие:
• 3–7 июня — для технических менеджеров и Crowd Solutions Architect, офер за 5 дней в команду Crowd.
Зарегистрироваться
Original post link: t.me/frontendnoteschannel/3594
Forwarded and filtered by @smartfeed_bot
Работа в Яндексе
Получите офер в Яндекс за 1–2 дня!
Страница быстрых наймовых мероприятий.
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