BFEdev

Здесь собрано более 600 задач по JavaScript, React, TypeScript, CSS и даже системному дизайну

Можно писать код прямо в браузере с поддержкой TypeScript, сразу проверять решения и смотреть, как справились другие

#ресурсы

@WebDev_Plus

Firebase Studio

IDE прямо в браузере для вайб-кодинга. Пишешь на естественном языке, редактируешь код, деплоишь. По сути — бесплатный аналог Cursor

Попробовать можно здесь

#ресурсы

@WebDev_Plus

Совет по JavaScript

Юзай новый метод Object.groupBy() — группируй объекты по любому свойству в одну строку, без плясок с бубном

Поддерживается всеми современными браузерами

#советы

@WebDev_Plus

Шпаргалка-обучалка по Python на русском

Работа со словарями, операции над множествами, функции генераторы и очень мемный подраздел «Приручаем Python списки».

#шпаргалка

@WebDev_Plus

Uiverse

Почти 6000 готовых UI-компонентов в HTML/CSS, которые можно юзать в проектах или просто для вдохновения

https://uiverse.io/

#ресурсы

@WebDev_Plus

Узнайте, как создать табы на сайты, используя только HTML и CSS

@WebDev_Plus

Хочешь создавать ультра-плавные слайдеры для своих веб-проектов

Эта open-source библиотека поможет тебе легко и быстро сделать невероятно плавные и удобные для касания слайдеры

https://smooothy.vercel.app/

@WebDev_Plus

Настоящий кладезь для разработчиков

Этот сайт собирает шпаргалки по множеству языков программирования, фреймворков и технологий: от Python и JavaScript до Git и MySQL

Всё отсортировано в алфавитном порядке для удобства пользования, а каждый из элементов шпаргалки ведёт на документации

Когда срочно нужно вспомнить синтаксис или команду — must-have: https://overapi.com/

#ресурсы

@WebDev_Plus

Совет по HTML

Чтобы автоматически обновлять HTML-страницу через заданный интервал времени, можно использовать тег <meta> с атрибутом http-equiv, установленным в значение "refresh".

Это позволяет указать количество секунд, через которое страница будет перезагружаться.

#советы

@WebDev_Plus

Знали ли вы, что VSCode умеет открывать браузер?

И для этого не нужны костыли в виде расширений. Всё из коробки

Твой код и изменения в одном окне

#советы

@WebDev_Plus

Отличный проект для ознакомления с фреймом Django — сервис для сокращения ссылок аля bit.ly.

Это один из немногих бесплатных курсов от Udemy, который познакомит вас с основами Django, работу с шаблонами, моделями и методами сохранения данных, что в конечном итоге выльется в сервис для создания шортлинков.

Единственный минус — курс староват и пусть и минимальная часть данных, но всё же устарела. Правда, это всё ещё отличная обучалка для старта.

#ресурсы

@WebDev_Plus

В CSS мы можем использовать accent-color для стилизации полей ввода

Браузеры, которые поддерживают accent-color, в настоящее время применяют его к следующим HTML элементам:

<input type="checkbox">
<input type="radio">
<input type="range">
<progress>

#советы

@WebDev_Plus

Бесплатная и обширная библиотека React-компонентов с открытым исходным кодом.

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

https://www.prismane.io/

#ресурсы

@WebDev_Plus

Небольшая, но очень полезная шпаргалка по типам переменных в Python.

Внутри: переменные и их правильные названия, операции, строки, списки, словари и методы.

#шпаргалка

@WebDev_Plus

Совет по JS

Используйте KeyboardEvent.getModifierState(), чтобы определить, включен ли Caps Lock.

#советы

@WebDev_Plus

Ваш первый бэкенд на Django — пошаговый учебник

Бесплатный самоучитель по Django, созданный специально для новичков. Шаг за шагом вы создадите веб-приложение (блог) на Python с использованием фреймворка Django.

По ходу дела объясняются все необходимые основы — от базового Python до шаблонов HTML/CSS. К концу у вас будет собственный рабочий блог на сервере и понимание принципов бэкенд-разработки.

#ресурсы

@WebDev_Plus

Сохраняем 10 сайтов для отработки навыков работы с фронтендом:

1. Frontend Mentor
http://frontendmentor.io

2. Codewars
http://codewars.com

3. Codewell
http://codewell.cc

4. JavaScript30
http://javascript30.com

5. Кодербайт
http://coderbyte.com

6. CSS Battle
http://cssbattle.dev

7. FreeCodeCamp
http://freecodecamp.org/learn/

8. Frontend Practice
http://frontendpractice.com

9. Задачи CodePen
http://codepen.io/challenges/?re

10. Dev Challenges
http://devchallenges.io

#ресурсы

@WebDev_Plus

Крутейший ЛАЙФХАК для твоих репозиториев на GitHub!

Получай доступ к документации с диаграммами и ИИ

Замени "github" на "deepwiki" в URL и смотри:

#советы

@WebDev_Plus

Если вы хотите стать отличным бэкенд-разработчиком, вам нужно создавать много проектов.

И в этом курсе вы найдете три таких проекта: генератор блогов, клон Netflix и клон Spotify.

Вы отточите свои навыки работы с бэкендом, используя такие инструменты, как Python, Django и PostgreSQL.

https://www.freecodecamp.org/news/backend-web-development-three-projects/

#ресурсы

@WebDev_Plus

Совет по JavaScript

Используйте Object.entries() вместе с Object.fromEntries(), чтобы переименовать ключи объекта.

#советы

@WebDev_Plus

Превратите любой репозиторий GitHub в интерактивные диаграммы

Представляем GitDiagram: просто замените "hub" на "diagram" в URL-адресе GitHub, чтобы мгновенно визуализировать кодовую базу с помощью интерактивных диаграмм

#советы

@WebDev_Plus