🕸 Тенденции веб-разработки, которые мы увидим в 2024 году 👀
https://dev.to/wasp/web-development-trends-we-will-see-in-2024-55pi
https://dev.to/wasp/web-development-trends-we-will-see-in-2024-55pi
DEV Community
🕸️ Web development trends we will see in 2024 👀
As we're already chugging along into the new year, it's the perfect time to take a look into what...
20+ удобных функций JavaScript для упрощения вашего кода
https://dev.to/devsmitra/20-handy-javascript-functions-to-simplify-your-code-javascript-tutorial-i0e
https://dev.to/devsmitra/20-handy-javascript-functions-to-simplify-your-code-javascript-tutorial-i0e
DEV Community
20+ Handy JavaScript Functions to Simplify Your Code | JavaScript Tutorial
JavaScript is a functional programming language, and functions play a crucial role. They allow you to...
Множество новых функций CSS помогут вам оптимизировать код и уменьшить избыточность.
CSS-вложение
CSS-переменные
Возможности диапазона Media Query
https://css-tip.com/better-modern-css
CSS-вложение
CSS-переменные
Возможности диапазона Media Query
https://css-tip.com/better-modern-css
Css-Tip
Write better CSS with modern CSS
Optimize your code and reduce redundancy using modern CSS.
Как создать интерактивный веб-сайт-портфолио на базе терминала
В этой статье вы узнаете, как создать интерактивное портфолио и резюме на базе терминала на JavaScript. Мы воспользуемся библиотекой терминала jQuery (и несколькими другими инструментами), чтобы создать веб-сайт, похожий на настоящий терминал.
https://www.freecodecamp.org/news/how-to-create-interactive-terminal-based-portfolio
В этой статье вы узнаете, как создать интерактивное портфолио и резюме на базе терминала на JavaScript. Мы воспользуемся библиотекой терминала jQuery (и несколькими другими инструментами), чтобы создать веб-сайт, похожий на настоящий терминал.
https://www.freecodecamp.org/news/how-to-create-interactive-terminal-based-portfolio
Принципы программной инженерии, которые должен знать каждый фронтенд-разработчик
Как фронтенд-разработчики, мы часто фокусируемся на создании красивых пользовательских интерфейсов. Однако важно помнить, что красота также находится внутри, и пиксельно-идеальный подход должен также отражаться на организации и структуре нашего кода. В этой статье мы рассмотрим некоторые фундаментальные принципы разработки программного обеспечения, которые каждый фронтенд-разработчик должен знать и применять в своих проектах.
https://dev.to/gboladetrue/software-engineering-principles-every-frontend-developer-should-know-1ej7
Как фронтенд-разработчики, мы часто фокусируемся на создании красивых пользовательских интерфейсов. Однако важно помнить, что красота также находится внутри, и пиксельно-идеальный подход должен также отражаться на организации и структуре нашего кода. В этой статье мы рассмотрим некоторые фундаментальные принципы разработки программного обеспечения, которые каждый фронтенд-разработчик должен знать и применять в своих проектах.
https://dev.to/gboladetrue/software-engineering-principles-every-frontend-developer-should-know-1ej7
CSS-градиенты Tailwind
Начиная с Tailwind 1.7, вы можете создавать градиенты без единой строки CSS 🎨. В этом уроке я покажу вам, как легко добавлять градиенты в ваши проекты с помощью Tailwind. https://devdojo.com/tnylea/tailwindcss-gradients
Начиная с Tailwind 1.7, вы можете создавать градиенты без единой строки CSS 🎨. В этом уроке я покажу вам, как легко добавлять градиенты в ваши проекты с помощью Tailwind. https://devdojo.com/tnylea/tailwindcss-gradients
DevDojo
TailwindCSS Gradients
As of Tailwind 1.7, you can create gradients without a single line of CSS 🎨. In this tutorial, I'll show you how easy it is to add gradients to your designs using Tailwind. Each gradient will typicall...
Использование Правил CSS If/Else
CSS постоянно развивается, и новые предлагаемые правила предоставляют дополнительные возможности, о которых вам следует знать. https://blog.openreplay.com/using-the-upcoming-css-when-else-rules
CSS постоянно развивается, и новые предлагаемые правила предоставляют дополнительные возможности, о которых вам следует знать. https://blog.openreplay.com/using-the-upcoming-css-when-else-rules
Openreplay
Using the upcoming CSS when/else rules
New important CSS rules you should be aware of
Сделайте голые веб-сайты великолепными с помощью matcha.css!
https://dev.to/lowlighter/make-naked-websites-look-great-with-matchacss-4ng7
https://dev.to/lowlighter/make-naked-websites-look-great-with-matchacss-4ng7
DEV Community
Make naked websites look great with matcha.css!
Have you ever contemplated the bareness of starting from a "blank page" when beginning a new web...
За последние годы появилось много новых функций CSS, но их фактическое использование все еще остается низким. Хотя существует много разных причин медленного внедрения, я думаю, что одним из самых больших препятствий является наш собственный мозг.
https://mxb.dev/blog/old-dogs-new-css-tricks
https://mxb.dev/blog/old-dogs-new-css-tricks
Max Böck
Old Dogs, new CSS Tricks
A lot of new CSS features have shipped in the last years, but actual usage is still low. One of the biggest barriers: we need to re-wire our own brains.
Знакомство с API позиционирования привязки CSS (11 минут чтения)
Новый API позиционирования привязки CSS позволяет позиционировать элементы относительно заданных вами привязок.
https://developer.chrome.com/blog/anchor-positioning-api
15 сумасшедших новых функций JS о которых вы еще не знали
Ознакомьтесь с новейшими функциями 15 различных фреймворков JavaScript и проблемами, которые они решают для веб-разработчиков.
https://www.youtube.com/watch?v=466U-2D86bc
Новый API позиционирования привязки CSS позволяет позиционировать элементы относительно заданных вами привязок.
https://developer.chrome.com/blog/anchor-positioning-api
15 сумасшедших новых функций JS о которых вы еще не знали
Ознакомьтесь с новейшими функциями 15 различных фреймворков JavaScript и проблемами, которые они решают для веб-разработчиков.
https://www.youtube.com/watch?v=466U-2D86bc
Chrome for Developers
Introducing the CSS anchor positioning API | Blog | Chrome for Developers
Position elements relative to each other using the new anchor positioning API.
Вам не нужен CSS Framework
CSS-фреймворки предлагают краткосрочный прирост скорости и согласованности, но со временем их становится все труднее поддерживать.
https://www.infoq.com/articles/no-need-css-framework
CSS-фреймворки предлагают краткосрочный прирост скорости и согласованности, но со временем их становится все труднее поддерживать.
https://www.infoq.com/articles/no-need-css-framework
InfoQ
You Don’t Need a CSS Framework
Developers use CSS frameworks to reduce boilerplate, increase quality, and drive consistency. However, these gains are hard to maintain as an application’s codebase matures. Developers must configure and override the framework to accommodate changes. Instead…
Учебное пособие по анимации Parallax Smooth Scroll Cards для веб-сайта с использованием Lenis Scroll и Framer Motion в приложении Next.js. Вдохновлен многими веб-сайтами, получившими награды awwwwards. https://blog.olivierlarose.com/tutorials/cards-parallax
Olivierlarose
Build a Smooth Scroll Cards Parallax with Framer Motion and Next.js
A website Smooth Scroll Cards Parallax animation tutorial featuring Lenis Scroll, Framer Motion all inside a Next.js application. Inspired by many awwwards winning websites.
Напишите компоненты один раз, запустите везде. Компилируется в React, Vue, Qwik, Solid, Angular, Svelte и другие. https://github.com/BuilderIO/mitosis
GitHub
GitHub - BuilderIO/mitosis: Write components once, run everywhere. Compiles to React, Vue, Qwik, Solid, Angular, Svelte, and more.
Write components once, run everywhere. Compiles to React, Vue, Qwik, Solid, Angular, Svelte, and more. - GitHub - BuilderIO/mitosis: Write components once, run everywhere. Compiles to React, Vue, ...
Как создать таймер CSS
Бывают случаи , когда мы можем использовать таймер на веб-сайтах. 😉
Возможно, мы хотим назначить время для викторины или оказать давление на опрос. Возможно, мы просто пытаемся запустить обратный отсчет после того, как пользователь совершил что-то важное, например успешно забронировал билет на концерт. https://frontendmasters.com/blog/how-to-make-a-css-timer
Бывают случаи , когда мы можем использовать таймер на веб-сайтах. 😉
Возможно, мы хотим назначить время для викторины или оказать давление на опрос. Возможно, мы просто пытаемся запустить обратный отсчет после того, как пользователь совершил что-то важное, например успешно забронировал билет на концерт. https://frontendmasters.com/blog/how-to-make-a-css-timer
Frontendmasters
How to Make a CSS Timer – Frontend Masters Boost
Let's look at using CSS as an efficient alternative to JavaScript for creating simple timers. We'll use modern CSS properties like @property, @keyframes, and pseudo-elements with counter() values.