Nice new side project by Addy Osmani: Must. Hide. Credit Card. TeeJungle →
Fullwidth Content Strips and CSS Subgrid = ❤️
When having fullwidth content strips on your site CSS Grid is a thankful piece of technology. You can use it to place items between the first and last grid-line, as detailed in Breaking Elements out of Their Containers in CSS 💁♂️ Alternatively you can also use this .full-bleed utility class To lay out the content …
Continue reading “Fullwidth Content Strips and CSS Subgrid = ❤️”
Getting started with GitHub Actions and Laravel (~PHP)
Ruben Van Assche from Spatie: When GitHub released its new product: GitHub Actions a whole new world opened for developers. Let’s dive right in and see what it brings for the Laravel community. In How to set up PHP for use in a GitHub Action I’ve layed out how to use shivammathur/setup-php@v1 in GitHub Actions. …
Continue reading “Getting started with GitHub Actions and Laravel (~PHP)”
Run a PHP app in a Docker Container (Notes)
The past week I took a closer look at the several options on how to run a PHP app with Docker. In the past I’ve ran a few pre-built containers, but now I wanted to truly get to the bottom of it all as I don’t always need a full blown container with all extensions, …
Continue reading “Run a PHP app in a Docker Container (Notes)”
How to add Dark Mode to a JavaScript App (React / Angular / Vue / etc)
In this post I’ll cover how to add Dark Mode to a JavaScript App. All major frameworks (React, Angular, Vue, etc.) are covered!
GHOSTBUSTERS: AFTERLIFE
ESNext: Relatively format time with Intl.RelativeTimeFormat
A proposal to the ECMAScript Internationalization API Specification (ECMA-402) that just moved to Stage-4, is Intl.RelativeTimeFormat. It’s a way to format time in a relative manner – e.g. “10 minutes ago” or “in 3 quarters” – while also taking a language into account. const rtf_en = new Intl.RelativeTimeFormat('en'); console.log(rtf_en.format(-1, 'day')); // ~> 1 day ago …
Continue reading “ESNext: Relatively format time with Intl.RelativeTimeFormat“
Countries, An example GraphQL API
If you’re looking for an example GraphQL API to play with, check out Countries. A public GraphQL API for information about countries, continents, and languages. curl ‘https://countries.trevorblades.com/’ \ -H ‘Content-Type: application/json’ \ -d ‘{“query”:”{ country(code: \”BE\”) { name, native, emoji, currency, languages { code, name } } }”}’ The schema’s available on the playground. Countries …
How to set up PHP for use in a GitHub Action
To use PHP in a GitHub action there’s the magnificent setup-php action. It also allows for installing extensions and setting several php.ini directives. steps: – name: Checkout uses: actions/checkout@v1 – name: Setup PHP uses: shivammathur/setup-php@v1 with: php-version: '7.4' extensions: mbstring, intl #optional, setup extensions ini-values: post_max_size=256M, short_open_tag=On #optional, setup php.ini configuration coverage: xdebug #optional, setup …
Continue reading “How to set up PHP for use in a GitHub Action”
mermaid – Generation of diagram and flowchart from text in a similar manner as markdown
Markdownish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs. The code for the sequence diagram at the top is this: sequenceDiagram Alice ->> Bob: Hello Bob, how are you? Bob–>>John: How about you John? Bob–x Alice: I am good thanks! Bob-x John: I am good thanks! Note right of John: …