Category: preprocessors

How to Write JavaScript-Style Test Watchers in PHP

I didn’t start out writing tests for my code. Like many before and since, my “testing” was to write code and refresh the page. “Does it look right?”, I’d ask myself. If I thought so, I’d move on. In fact, most of the jobs I’ve had have been with companies who don’t ...

Procedurally Generated Game Terrain with React, PHP, and WebSockets

Last time, I began telling you the story of how I wanted to make a game. I described how I set up the async PHP server, the Laravel Mix build chain, the React front end, and WebSockets connecting all this together. Now, let me tell you about what happened when I starting building the game mechanics with this mix of Rea...

Game Development with React and PHP: How Compatible Are They?

“I’d like to make a multiplayer, economy-based game. Something like Stardew Valley, but with none of the befriending aspects and a player-based economy.” I started thinking about this the moment I decided to try and build a game using PHP and React. The trouble is, I knew nothing about the dynamics of...

How to Make Modern PHP More Modern? With Preprocessing!

Let’s have a bit of fun. A while ago, I experimented with PHP macros, adding Python range syntax. Then, the talented SaraMG mentioned an RFC, and LordKabelo suggested instead adding C#-style getters and setters to PHP. Aware of how painfully slow it can be for an outsider to suggest and implement a new language f...

What is the difference between CSS variables and preprocessor variables?

Variables are one of the major reasons CSS preprocessors exist at all. The ability to set a variable for something like a color, use that variable throughout the CSS you write, and know that it will be consistent, DRY, and easy to change is useful. You can use native CSS variables (“CSS Custom Properties”) ...

Variables: The Backbone Of CSS Architecture

   When they hit the front-end landscape a few years ago, preprocessors were heralded as the saviour of CSS, bringing modularity, meaning and even a degree of sexiness. Terms like “Sass architecture” became commonplace, ushering in a new generation of CSS developers who occasionally went to excess w...

An Introduction To PostCSS

   The development of CSS, like all languages, is an iterative process. With every major release, we get new features and syntaxes that help us write our styles. CSS Level 3 introduced features that enable us to design interactions that previously were possible only with JavaScript. With every new day, ...

Smarter Grids With Sass And Susy

   If you’re a designer, you’ll know that grids are your friends. More often than not, they’re the vital architecture that holds a beautiful design together; they create rhythm, structure your page, lead the eye, and prevent the whole thing collapsing in a sloppy mess. I’m a firm advocate for d...