FrontEndDev
28.8K subscribers
2.2K photos
23 videos
7.41K links
🚀 Статьи, новости, туториалы по frontend разработке.

http://jem-space.ru

Admin: @jem_jem
Пишу в @five_a_m

Хорошие серваки от DigitalOcean: https://m.do.co/c/1351d64475ee

Реклама: http://bit.ly/2NxmVDu
РКН: https://clck.ru/3GLw7G
Download Telegram
Quokka - JS playground в вашем редакторе

Расширение для вашей IDE, которое позволяет быстро запустить и отдебажить ваш код.

https://quokkajs.com/
👍18💩2👀21🥱1
Как prefetch помог Terra ускорить показатели LCP и скорость загрузки

Короткая заметка с реализацией способа загрузки контента

https://web.dev/terra-prefetching-case-study/
👍10
CSS методологии

Обзорная статья с кратким описанием подходов к организации стилей.

https://www.arekibo.com/blog/popular-css-methodologies-for-scaling-web-projects/
👍17
Как React 18 улучшает производительность приложения

Новые возможности React: конкурентный рендеринг, интерфейс переходов, серверные компоненты и кеширование.

https://my-js.org/blog/react-18/
👍14🔥2🤡2
This media is not supported in your browser
VIEW IN TELEGRAM
Друзья! С Днем Программиста! 🎉🎉

В честь праздника держите подборку анимаций для модальных окон 😉

https://codepen.io/designcouch/pen/obvKxm
🔥28🤮9🎉4👌1
4 типа покрытия кода тестами

Статья о том, какие бывают метрики покрытия тестами, какую вам стоит выбрать, и в чем отличие code coverage от test coverage.

https://web.dev/ta-code-coverage/
🔥9👌1🍾1
Forwarded from Habr For Dev
#javascript #node.js

Релиз Bun 1.0 (новый runtime для JavaScript )

Представляем Bun версии 1.0.Bun — это быстрый и универсальный набор инструментов для запуска, сборки, тестирования и отладки JavaScript и TypeScript кода (от одного файла до fullstack-приложения). Сегодня Bun стабилен и готов к продакшену.

⭐️⭐️◽️◽️◽️

📖Читать
👍27🥴7🤮2🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
Hover анимация для гридовых элементов

Очередной эффект для оживления контента.

Демо | Github

https://tympanus.net/codrops/2023/09/13/grid-item-hover-effect/
👍221❤‍🔥1
Новые фичи JS в грядущем EcmaScript 2023

Удобные функции по работе с массивами и датами, а также поддержка декораторов и еще несколько фич.

https://thenewstack.io/the-new-javascript-features-coming-in-ecmascript-2023/
👍171
Forwarded from Habr For Dev
#html #css

Как HTML и CSS влияют на доступность

⭐️⭐️◽️◽️◽️

📖Читать
👍161
Что нового в веб анимации?

Google I/O 2023

https://youtu.be/oDcb3fvtETs
❤‍🔥101
React Profiler

Измеряем перфоманс вашего React приложения.

https://deadsimplechat.com/blog/react-profiler/
👍81
RSC с нуля. Часть 1.
Серверные компоненты


Глубокое погружение: создаем с нуля очень простую версию серверных компонентов.

https://my-js.org/blog/rsc-1/
👍143
Создаем онлайн сервис с подписками с нуля

Туториал по созданию и деплою приложения с AI. Приложение работает по системе с подписками, предоставляя платный функционал для пользователей. Стек: NextJS, Stipe, OpenAI.

Github

https://www.youtube.com/watch?v=r895rFUbGtE
👍131
Подборка бесплатных ресурсов для разработки

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

https://free-for.dev/
13👍2💯2
Регулярные выражения in JavaScript

Синтаксис регулярных выражений и методы работы с ними в JS. Большое руководство с примерами.

https://www.honeybadger.io/blog/javascript-regular-expressions/
7👍1
GraphQL туториал

Цикл видео по работе с GraphQL + NodeJs + ReactJS для новичков.

https://www.youtube.com/playlist?list=PL55RiY5tL51rG1x02Yyj93iypUuHYXcB_
🔥11👎4🐳3👍21
JavaScript async iterators

Протокол, который позволяет создавать кастомные итерируемые объекты. Как это делать и где это можно применить - в статье.

https://www.nodejsdesignpatterns.com/blog/javascript-async-iterators/
👍122
CSS Анимация

Быстрое введение в анимацию для новичков.

https://www.youtube.com/watch?v=SgmNxE9lWcY&ab_channel=SlayingTheDragon
👍102
Современный CSS Reset

Что нового в сбросе стандартных стилей? Энди Белл подробно рассказывает о каждом блоке правил

https://andy-bell.co.uk/a-more-modern-css-reset/
🔥17👍31