Web Development + Follow

This is the 3rd post in a small series we are doing on form accessibility. If you missed the 2nd post, check out Managing User Focus with :focus-visible. In this post we are going to look at using a screen reader when navigating a form, and also some best practices. What is a Screen Reader? …

This is going to be the 2nd post in a small series we are doing on form accessibility. If you missed the first post, check out Accessible Forms with Pseudo Classes. In this post we are going to look at :focus-visible and how to use it in your web sites! Focus Touchpoint Before we move …

Hey all you wonderful developers out there! In this post we are going to explore the use of :has() in your next web project. :has() is relatively newish but has gained popularity in the front end community by delivering control over various elements in your UI. Let’s take a look at what the pseudo class …

Hey all you wonderful developers out there! In this post, I am going to take you through creating a simple contact form using semantic HTML and an awesome CSS pseudo class known as :focus-within. The :focus-within class allows for great control over focus and letting your user know this is exactly where they are in …

Šta su Streams u Node.js? Streams u Node.js su poput reka podataka koje teku u komadićima, omogućavajući efikasniju obradu velikih količina podataka. Razmotrimo detaljnije njihove prednosti i vrste. Prednosti Streams Čuva memoriju: Obradom podataka u komadićima, streams omogućavaju rad s velikim količinama podataka bez zauzimanja velike količine memorije odjednom. Brže obrade podataka: Podaci se mogu …

Uvod Razumevanje file sistema u Node.js ključno je za razvoj aplikacija koje zahtevaju čitanje, pisanje i manipulaciju fajlovima. Node.js nudi
fs modul, koji omogućava sinhrono i asinhrono upravljanje fajlovima. Ovaj članak detaljno objašnjava kako koristiti
fs modul u Node.js.
fs modul je deo Node.js API-ja koji omogućava rad sa fajl sistemom. Modul se može učitati …

Uvod Binarni sistem je osnova za rad računara i digitalne elektronike i predstavlja sistem koji koristi samo dve cifre: 0 i 1. Svaka cifra u binarnom broju se naziva “bit” , a osam bitova predstavlja “bajt” Svaki bit u binarnom broju predstavlja neki stepen broja dva. Ako imamo binarni broj od četri cifre, onda skroz …

Šta su Baferi (eng. Buffers)? Kada radimo s podacima koji se prenose preko mreže ili kada čitamo i pišemo datoteke na disku, često se susrećemo sa podacima koji nisu odmah dostupni u celosti. Bufferi su privremena skladišta za podatke dok se oni premeštaju iz jednog mesta u drugo. Bufferi omogućavaju da se ovi podaci akumuliraju …

Razumevanje EventEmitter-a u Node.js Node.js je popularna platforma koja omogućava izgradnju skalabilnih aplikacija kroz asinhroni, događajno vođeni pristup. Jedan od ključnih mehanizama koji omogućava ovaj pristup jeste EventEmitter. Da bismo razumeli njegovu važnost i funkcionalnost, zamislimo EventEmitter kao središte za komunikaciju unutar Node.js aplikacije, gde se događaji šalju, primaju i obrađuju. Šta je EventEmitter? EventEmitter …

Globalni Objekat U Node.js-u, globalni objekat služi kao kontejner za sve globalne varijable koje su dostupne u svim modulima vaše aplikacije. Slično objektu window u pregledačima, globalni objekat u Node.js-u omogućava pristup različitim globalnim funkcijama i varijablama, poput console, setTimeout, i clearTimeout. Da bi se pristupilo globalnom objektu, možete koristiti ključnu reč
global. Moduli Moduli …

Šta je objektno orjentisano programiranje? Objektno orjentisano programiranje ili skraćeno “OOP” je način organizovanja koda oko manjih celina pod nazivom “objekat”. Objektno orjentisano programiranje pomaže u strukturiranju koda u razumljive i samostalne jedinice koje se mogu lako ponovno koristiti u različitim delovima programa. Primenom objektno orjentisanog programiranja se dobija pregledniji i razumljiviji programski kod koji …

Šta su zavisnosti (eng. dependency)? U programiranju, “zavisnost” predstavlja odnos između različitih komponenti u softverskom sistemu. Smatra se da kada jedna komponenta koristi ili zavisi od druge komponente, da tada postoji zavisnost između njih. Zavisnost može biti u mnogo oblika, a osnovni tipovi zavisnosti uključuju: Zavisnost od Klase (Class Dependency) se odnosi na situaciju kada …

Šta je “SCRUM”? Scrum je agilna metodologija upravljanja projektima koja se često koristi u softverskom razvoju, ali se može primeniti i u drugim oblastima. Osnovna ideja Scrum-a je da omogući timovima da fleksibilno i efikasno rade na projektima koji se brzo menjaju. Scrum je kao skup pravila i način rada koji pomaže pri radu na …

Socket “Socket” predstavlja krajnju tačku za slanje ili primanje podataka u mreži. Drugim rečima, to je interfejs između aplikacije i mrežne komunikacije na operativnom sistemu. Kroz sokete, aplikacije mogu komunicirati međusobno preko mreže. Soketi su osnova za mnoge mrežne aplikacije i usluge, uključujući veb pretraživače, e-mail klijente, chat aplikacije i mnoge druge. Oni omogućavaju komunikaciju …

These things called passkeys sure are making the rounds these days. They were a main attraction at W3C TPAC 2022, gained support in Safari 16, are finding their way into macOS and iOS, and are slated to be the future for password managers like 1Password. They are already supported in Android, and will soon find their way into Chrome OS and Windows in …

I spend a lot of time in DevTools, and I’m sure you do too. Sometimes I even bounce between them, especially when I’m debugging cross-browser issues. DevTools is a lot like browsers themselves — not all of the features in one browser’s DevTools will be the same or supported in another browser’s DevTools. But there …

Doing a quick search here on CSS-Tricks shows just how many different ways there are to approach calendars. Some show how CSS Grid can create the layout efficiently. Some attempt to bring actual data into the mix. Some rely on a framework to help with state management. There are many considerations when building a calendar …

You know what it’s like to pick up a new language or framework. Sometimes there’s great documentation to help you find your way through it. But even the best documentation doesn’t cover absolutely everything. And when you work with something that’s new, you’re bound to find a problem that doesn’t have a written solution. That’s …

CSS trigonometry functions are here! Well, they are if you’re using the latest versions of Firefox and Safari, that is. Having this sort of mathematical power in CSS opens up a whole bunch of possibilities. In this tutorial, I thought we’d dip our toes in the water to get a feel for a couple of …

Fonts are a defining characteristic of the design of any site. That includes WordPress themes, where it’s common for theme developers to integrate a service like Google Fonts into the WordPress Customizer settings for a “classic” PHP-based theme. That hasn’t quite been the case for WordPress block themes. While integrating Google Fonts into classic themes …

I was reading “Creative List Styling” on Google’s web.dev blog and noticed something odd in one of the code examples in the ::marker section of the article. The built-in list markers are bullets, ordinal numbers, and letters. The ::marker pseudo-element allows us to style these markers or replace them with a custom character or image. …

We’re fans of Custom Elements around here. Their design makes them particularly amenable to lazy loading, which can be a boon for performance. Inspired by a colleague’s experiments, I recently set about writing a simple auto-loader: Whenever a custom element appears in the DOM, we wanna load the corresponding implementation if it’s not available yet. …

It’s a question I hear asked quite often: Is it possible to create shadows from gradients instead of solid colors? There is no specific CSS property that does this (believe me, I’ve looked) and any blog post you find about it is basically a lot of CSS tricks to approximate a gradient. We’ll actually cover …

Every now and then, a one blog post is published and it spurs a reaction or response in others that are, in turn, published as blogs posts, and a theme starts to emerge. That’s what happened this past week and the theme developed around the cost of JavaScript frameworks — a cost that, in this …

We often think of background images as texture or something that provides contrast for legible content — in other words, not really content. If it was content, you’d probably reach for an <img> anyway, accessibility and whatnot. But there are times when the position or scale of a background image might sit somewhere between the …

Geez, leave it to Patrick Brosset to talk CSS performance in the most approachable and practical way possible. Not that CSS is always what’s gunking up the speed, or even the lowest hanging fruit when it comes to improving performance. But if you’re looking for gains on the CSS side of things, Patrick has a …

I used to have this boss who loved, loved, loved, loved to emphasize words. This was way back before we used a WYSIWYG editors and I’d have to handcode that crap. (Let’s not go into the colors he used for even MOAR emphasis.) Writing all that markup never felt great. The effort it took, sure, …

Do you know that kind of effect where someone’s head is poking through a circle or hole? The famous Porky Pig animation where he waves goodbye while popping out of a series of red rings is the perfect example, and Kilian Valkhof actually re-created that here on CSS-Tricks a while back. I have a similar …

My previous post was a broad overview of SvelteKit where we saw what a great tool it is for web development. This post will fork off what we did there and dive into every developer’s favorite topic: caching. So, be sure to give my last post a read if you haven’t already. The code for …

Tucked down somewhere in the Safari Technology Preview 161 release notes is a seemingly innocous line about support for a new HTML element and attribute: Added support for <model src> and honor <source type> attributes (257518@main) Anytime I see mention of some element I don’t recognize, my mind goes straight to Huh! New to me, but probably old news …