Tailwind CSS is a mobile first, utility CSS framework which will vastly increase productivity while implementing designs in your web app or website.
A small DX improvement I make in my Tailwind projects, which I’m describing as a “default first” approach (this is a semi-joke derived from mobile first).
It revolves around targeting styles for mobile. The Tailwind docs specify:
If you’d like to apply a utility at one breakpoint only, the solution is to undo that utility at larger sizes by adding another utility that counteracts it.
This is a small DX annoyance for me, why should I have to apply something only to reset it later? …
Laravel Blueprint is a wonderful tool that helps scaffold Laravel apps in the early stage of development.
It uses a simple YAML format, like the below:
php artisan blueprint:trace and the models, migrations, factories, Nova resources will all be generated.
This saves a lot of time, but once it has been generated once, they can’t be generated again for fear of overwriting changes that have been made in developing the application.
A technique I’ve been using is to separate the generated model code and the model behaviour into a separate trait.
To achieve this, I’ve created a custom
ModelGenerator which extends the original
ModelGenerator, and if a
behaviour for the model exists, it will inject the trait into the generated model class. …
This is a matter of personal preference, it basically means that if you have a file, say
app/Services/Calculator.php and you wanted to write a test for this class, instead of hiding the test away in a
tests/Unit/Services/CalculatorTest.php file, you would put the test right next to what it is testing, in
This approach has a few benefits:
The approach has been championed by a few popular frameworks in the JS world — Angular, RedwoodJS, FoalTS, NestJS but for some reason, hasn’t really made its way into PHP. …
Heroku provides a good base level guide to get a Laravel running on its platform, however, it really stops at the bare minimum.
We’ve got 10+ (micro-ish) services running in production on Heroku and over the years we’ve fine tuned our setup to ensure that these apps are performant and our DevOps is as seamless as possible.
There’s a bit of scope, so we’ll break it down into key areas. Follow along in the app’s lifecycle:
Frameworks like Laravel encourages this behaviour out of the box, with the loading of the
.env file and the config directory for the different services the application might do. This file is not committed to the repository as it contains super secret stuff, so a
.env.example is provided to assist developers when setting up the application on their local computer or deploying to servers.
However, I feel the process could be improved, especially when adding new environment variables to an existing application, I often find myself running into the following…
Every developer loves to hate WordPress, and they have good reason to! It’s built on PHP which has its many flaws and does not follow any modern software architectures.
However, there’s no denying the popularity of the “platform”, it powers 20% of the internet and as such there is a HUGE market for developers that can develop on the WordPress platform. It’s cost effective and probably the best content editing experience for clients. Clients being the key word here.
As such, I’m torn between the market and using modern software techniques. So, I’ve tried to combine the two :)
What I’ve developed is an extremely flexible component based WordPress content editing experience, built on a “single file” architecture inspired by Vue. …
If you have state that can be stored in the URI, I highly suggest you store it there, because:
If you authenticate with Firebase in your app, authenticating with your API is very easy, as the Firebase token is a JWT.
All we really need to is implement a
Guard with a
user function that returns an
Because our user is actually stored in the JWT token, we can completely skip the custom User Provider class, as we can simply return an
Authenticable object directly from our
Step 1: Configure Laravel to use our custom guard in
Step 2: Add our custom guard to the Auth manager
Step 3: Add some dependencies
composer require kreait/firebase-tokens to add the library which will verify our tokens for us. Then tell Laravel how to create our token…
Zeplin is a cool web app / desktop app where you can upload your Sketch / Photoshop / XD designs and it can generate the CSS for you. This greatly speeds up the “cut up” process of turning designs into HTML and CSS.
Tailwind CSS is a utility CSS framework, that allows you to apply utility classes to rapidly achieve a custom design without repeating CSS over and over again. Because semantics are semantics and I prefer a better developer experience. I’m much happier now :)
While the CSS Zeplin spits out is good, it includes everything so if you simply copy and past all your components into your
main.css, you could get the job done quickly but with a large and WET CSS file. …
Tailwind is a utility CSS framework which allows you rapidly build custom user interfaces. Custom being the keyword here.
If I’m building an admin / app / mvp / prototype I whip out the latest Bulma and start building my UI as quickly and efficiently as possible. However, sometimes we have to build to a design, which may not align with a UI Kit like Framework7, Bulma or bootstrap.
Tailwind, does not make any assumptions about you design, so you essentially start from scratch, but can rapidly achieve custom designs with utility classes.