Dima

@xdimax

764 Following

592 Followers

Dima pfp

How different values of the object-fit CSS property behave for image elements • fill - the picture fully fits into the specified dimensions without observing its own proportions • contain - the picture will adjust to the specified dimensions so as to fit inside completely without violating the proportions • cover - the picture will fill the entire available area without violating the proportions, cutting off everything unnecessary

0 reply

0 recast

0 reaction

Dima pfp

Advanced JavaScript debugging using console.table() Pretty neat, isn't it? Of course, table works best with tabular data. If all objects have completely different fields, you will get a table in which most of the cells are undefined. But despite this, everything will look neat, giving you a good overall overview

0 reply

0 recast

0 reaction

Dima pfp

Swiss knife for working with arrays. Method reduce() The reduce method collapses the array to one value (reducts) e using the passed colback function and the initial value. The callback function will be called for each element of the array, and should always return the result

0 reply

0 recast

0 reaction

Dima pfp

super useful functions in CSS - The clamp() function allows you to limit the range of changes of a certain value by setting its lower and upper limits

0 reply

0 recast

0 reaction

Dima pfp

A site with free React and Tailwind components that can be useful at any time. There are 32 items in the database now All of them can be customized: change color, size, add a shadow. The components have documentation and use cases to help beginners 🔗 Link: https://www.webbie.app/

0 reply

0 recast

0 reaction

Dima pfp

Gradient rounded frame with CSS The background property is quite universal and allows you to set several backgrounds and set their parameters. So we make two backgrounds: one with a gradient, the other solid black in the form of a gradient and overlay them on each other

0 reply

0 recast

0 reaction

Dima pfp

Front-end documentation - a list of training materials, articles and resources for studying the frontend It offers many free programming books, screencasts, podcasts and even video lessons. The list of links is well organised and can be a starting point for training the profession from scratch 🔗 Link: https://github.com/codesandtags/frontend-documentation

2 replies

0 recast

0 reaction

Dima pfp

Repository with TypeScript tasks - 150+ questions with online verification The project will help you understand how the type system works, write your own utilities or just spend time solving problems 🔗 Link: https://github.com/type-challenges/type-challenges

1 reply

0 recast

3 reactions

Dima pfp

Animate.css is a library of CSS animations. It provides many ready-made animation effects for web page elements. ⛓ Link https://animate.style/

1 reply

0 recast

1 reaction

Dima pfp

The way of attenuating a long text The trick here is to place a pseudo-element on top of the text and give it a linear gradient from left to right, going from transparent to solid colour to create this attenuation effect

0 reply

0 recast

0 reaction

Dima pfp

I won't say for sure about this, but a mint for the task with layer3, I collect cubes

0 reply

0 recast

0 reaction

Dima pfp

I'm a mint for a task with layer 3, I collect cubes ) and I don't know about it for sure

0 reply

0 recast

0 reaction

Dima pfp

I'm a mint for a task with layer 3, I collect cubes ) and I don't know about it for sure

0 reply

0 recast

0 reaction

Dima pfp

https://wallet.coinbase.com/nft/mint/mistermiggles

0 reply

0 recast

0 reaction

Dima pfp

Emmet Cheat Sheet is a cheat sheet site for Emmet. Here are collected all the abbreviations and formulas, in the writing of which large pieces of code are revealed, and this greatly accelerates the development of the site. ⛓ Link: https://docs.emmet.io/cheat-sheet

0 reply

0 recast

0 reaction

Dima pfp

What's new in web development this month? Language model in your browser, available as Web API - Patrick Brosset- https://patrickbrosset.com/articles/2024-07-04-a-language-model-in-your-browser-accessible-as-a-web-api/

0 reply

0 recast

0 reaction

Dima pfp

Grid-area short cheat sheet In the short, the values are specified in the following order: row-start / column-start / row-end / column-end, that is, first specify both beginnings, and then both ends

0 reply

0 recast

0 reaction

Dima pfp

Web Skills - a visual overview of skills for frontend learners with links to selected materials: from the basics of HTML/CSS/JavaScript to databases, UX design and teamwork 🔗 Link: https://andreasbm.github.io/web-skills/

1 reply

0 recast

0 reaction

Dima pfp

Guide how to make inclined blocks on css Using clip-path, you can set the visible area of the element. Everything that goes beyond it is hidden

0 reply

0 recast

0 reaction

Dima pfp

0 reply

0 recast

0 reaction