42 private links
How an emerging CSS standard can fix old problems and raise the bar for web apps
When optimizing for long-term maintenance, we have a few choices. I like to bet on monorepo. A monolithic repository is a simple idea. You organize the code of all your services in a single repository. It has a few advantages over using a separate repository for each service.
Reusing code is easy. Once you abstract a coherent unit of code into a module, you can then import it from anywhere.
Continuous integration runs tests against the entire monorepo, so once PR is merged you bump the version of all sub-services and there is no doubt what versions are compatible with each other. Version 1.2 of service A is always compatible with version 1.2 of service B. This is why complex projects with multiple dependencies often use monorepo as well (Babel, React, Angular, Jest). Due to the very same reason, large-scale refactorings are also feasible.
You maintain one third-party dependencies tree. It's too easy, especially with all NPM goodies, to end up with two different versions of the same library and having to sync them across different repositories manually gives me a headache. Having one main package-lock.json is a real time-saver.
Monorepo forces collaboration, it encourages having the same coding style by having a single config for your linter/code formatter/module bundler and so on.
Learn how to avoid sudden layout shifts to improve user-experience
We set out to make the WordPress project bootstrap process painless and future-proof. To do this, we use a combination of Jenkins, some custom WP-CLI commands, and a custom Pantheon upstream.
With the release of v3.3 of iTerm2 (I only just recently noticed this version mixup – v3 of v2 🙈) a Minimal and Compact theme entered the stage. That motivated me to prettify my iTerm2/ZSH terminal.
Today, I'm very pleased with my setup, and people asked me to share my settings – so here we are!
The first thing you should do to be able to use Lando is (surprise, surprise!) install it on your computer. The installation process is extremely simple and is very well documented.
It’s pretty great but aside from the WordPress handbook, there are only few tutorials available for Gutenberg development as of the moment. This is the main reason I’ve decided to pitch in and help out with creating tutorials starting from custom attributes and controls. These tutorials are the ones I’ve learned by actively participating on Gutenberg development on Github. I also used these methods on CoBlocks and EditorsKit plugins.
Bit.dev and Storybook are two quite different tools. At first glance, it might seem that both provide a visual showcase for your UI components, and can be used to visually document and organize UI components. That is true, but that’s only a small part of what each of these tools can provide.
Using multiples of 8 to define dimensions, padding, and margin of elements.
Я уже несколько лет живу в Шотландии. На днях я опубликовал в своем Facebook-е серию статей про плюсы и минусы жизни тут. Статьи нашли большой отклик среди моих друзей, и поэтому я решил, что это может быть интересно более широкому IT-сообществу. Так что — выкладываю на хабре для всех желающих. Я смотрю с “программистской” точки зрения, поэтому часть пунктов в моих плюсах и минусах будет специфичной для программистов, хотя многое применимо к жизни в Шотландии независимо от профессии.
When design systems are the source of truth and subscribers have easy access to code, it's important that code is well-tested. Lindsey shares how we unit test our Sass and how you can too.
Andrey Sitnik on the past, the present and the future of PostCSS: a state of the union address on the 5th anniversary.
The core of React is components. You can nest these components like you would nest HTML tags, which makes is easy to write JSX since it resembles markup.
When I first learned React, I thought “Use props.children and that’s it. I know everything about children” Boy, was I wrong.
Because we’re working with JavaScript, we can change children. We can send special properties to them, decide if we want them to render or not and generally manipulate them to our will. Let’s dig into the power of children in React.
We assessed different tools and products, settling on the following tech stack:
- Gatsby
- Storybook
- Prismic
- Shopify
- Firebase
Parcel is a very powerful compiling/process/whatever JavaScript tool that can automate your entire workflow and very easily. It’s based on a zero-config ideology. It’s not entirely zero-config but it has “sane” configs for 90% of use-cases.
Recently I had some fun implementing an image carousel for Pinafore. The requirements were pretty simple: users should be able to swipe horizontally through up to 4 images, and also pinch-zoom to get a closer look.
In this blog post we are going to look at another icon library, FontAwesome, and how to add it to your Ionic application. FontAwesome is a popular icon library and provides over 1500 icons for free. For $60 a year you get additional access to more than 3500 icons, total over 5000 icons.
Following this pole on Twitter I thought I’d take a look at spinning up a project using Parceljs.
I’ve used Gulp for years and Grunt before that. Parcel seemed like a logical progression. That, plus, I still don’t have the stomach to try and get Webpack working!
Parcel is touted as ‘zero configuration’ and although that is largely true, if you are moving from Gulp there are definitely some things you need to keep in mind.
The best request is the one that never happens: in the fight for fast websites, avoiding the network is far better than hitting the network at all. To this end, having a solid caching strategy can make all the difference for your visitors.
That being said, more and more often in my work I see lots of opportunities being left on the table through unconsidered or even completely overlooked caching practices. Perhaps it’s down to the heavy focus on first-time visits, or perhaps it’s a simple lack of awareness and knowledge? Whatever it is, let’s have a bit of a refresher.