FrontEndDev
28.9K subscribers
2.2K photos
23 videos
7.4K 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
Верстаешь?

Оцени 7 причин пройти наш бесплатный интенсив по Frontend-разработке:

1. Ты сверстаешь веб-сайт на HTML + CSS;
2. Оживишь страницу с помощью JavaScript;
3. Используешь фронтенд-фреймворк Angular;
4. Подключишь Backend и загрузишь сайт на хостинг;
5. Получишь советы по доработке своего проекта;
6. Добавишь в портфолио 1 качественный проект;
7. Получишь в подарок чек-лист «45 мест для поиска работы».

А главное, ты проведёшь 7 дней в приятной компании Fullstack-разработчика с 10-летним стажем – Романа Чернова.

👉 Проскочить на интенсив бесплатно

Начинаем уже завтра.

Реклама. ИП Чернова О. А., ИНН:771399721044
👍4🔥2
Web Push Notifications

Практическое руководство по реализации web push уведомлений.

https://www.bocoup.com/blog/full-stack-web-push-api-guide
🔥13👍62
Змейка на ReactJS

Туториал по реализации классической игры

Github | Demo

https://blog.bibekkakati.me/how-to-build-a-classic-snake-game-using-reactjs
10👍4🔥1
Transition to auto

Как с помощью новых фич CSS практически побеждена одна из сложных задач стилизации.

https://frontendmasters.com/blog/one-of-the-boss-battles-of-css-is-almost-won-transitioning-to-auto/
👍14❤‍🔥1🔥1👌1
Паттерны для веб-разработчиков

Ресурс по изучению различных видов паттернов (не только в классическом понимании) с упором на веб. Есть секции по общему проектированию + секции по фреймворкам, для того, чтобы вы могли создавать масштабируемые приложения с лучшим перформансом.

https://www.patterns.dev/
👍19🔥12❤‍🔥1
Настраиваем и дотюниваем поля ввода

Обзор атрибутов для инпутов, помогающих браузеру и улучшающих UX.

https://garrettdimon.com/journal/posts/fine-tuning-text-inputs
🔥14❤‍🔥1🤔1
Текст по кругу на чистом CSS

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

https://frontendmasters.com/blog/pure-css-circular-text-without-requiring-a-monospace-font/
👍17🔥3😁3❤‍🔥2
This media is not supported in your browser
VIEW IN TELEGRAM
Анимация наведения для текста в стиле консоли

Очередной интересный эффект для анимации текста.

Демо | GitHub

https://tympanus.net/codrops/2024/06/19/hover-animations-for-terminal-like-typography/
🔥12👍8😁51
На чем разработать свой стартап или с чего начать хакатон в 2024?

Один из вариантов выбора стека для быстрой (и, возможно, долгосрочной) разработки нового проекта. Холивары и мнения прилагаются в комментах к статье 😊

https://habr.com/ru/articles/822001/
👍10💩63🔥1
Условные конструкции в CSS

Пока нативные условные конструкции еще не доступны, какие варианты есть сейчас, чтобы определять свойства по условию? Разберем несколько примеров со своими достоинствами, недостатками и областью применения.

https://lea.verou.me/blog/2024/css-conditionals-now/
🔥11👍4
React Internals Explorer

Инструмент для визуализации работы React под капотом. Напишите код и смотрите как он работает.

https://jser.dev/2024-05-11-introducing-rie/
👍19🔥4❤‍🔥3🤔2
Релиз новых математических функций в CSS

round, nearest, to-zero и еще несколько полезных функций заехали в поддержку 3х браузеров. Подробнее в небольшой заметке по ссылке.

https://web.dev/blog/css-stepped-value-functions?hl=en
👍15🔥21🐳1
cap - малоизвестная единица измерения в CSS

Ахмад Шадид рассказывает и показывает на интерактивных примерах, как и для чего можно использовать cap.

https://ishadeed.com/article/css-cap-unit/
👍17🔥2
Геймдев с Kaboom.js

Туториал по разработке игры на JavaScript с Kaboom.js в стиле Metroidvania. От настройки окружения и сборки до реализации сложной игровой механики.

https://www.youtube.com/watch?v=iM1iSvloMlo
👍17🔥31
Что aria-hidden="true" на самом деле делает с интерактивными элементами

Небольшая заметка о нюансах использования aria-hidden="true" и почему лучше не применять данный атрибут.

https://cerovac.com/a11y/2024/06/what-does-aria-hiddentrue-actually-do-to-interactive-elements/
👍1221
Девстанция - сайт для эффективной подготовки к собеседованиям

⚡️ Решение задач с запуском кода
⚡️ 800+ ответов на вопросы с собеседований
⚡️ 250+ решений для популярных задач
⚡️ Интерактивная тренировка по вопросам
⚡️ Викторины по вопросам со звёздочкой
⚡️ Треды для общения с сообществом

Совершенствуйся на Девстанции!

Заходите на https://dev-station.ru
❤‍🔥215💩5👍2
Работа с операторами RxJs, которые вы знаете, но, возможно, недостаточно хорошо

Сравнение операторов, похожих по функционалу, и различные тонкости работы с ними.

https://dev.to/krivanek06/advanced-rxjs-operators-you-know-but-not-well-enough-1ela
❤‍🔥13👍3🔥1💩1
Простое руководство по Markdown

https://piccalil.li/blog/a-quick-and-easy-guide-to-markdown/
👍121👌1
Список open-source проектов на NextJs + App Router

Алексей Рябов собрал 15 проектов на NextJS, которые уже находятся в продакшн (а значит их можно пощупать) и имеют открытые исходники.

https://dev.to/datarockets/real-world-open-source-projects-built-with-nextjs-14-and-app-router-i1n
❤‍🔥14🔥31👍1
Исследуем React Compiler

Подробное руководство по работе и использованию React Compiler в новых и существующих проектах.

https://blog.logrocket.com/exploring-react-compiler-detailed-introduction/
👍9❤‍🔥2