Posts tagged with 'frontend' - Freek Van der Herten's blog on Laravel, PHP and AI

Posts tagged with frontend

Auto-Refresh Livewire Components While Keeping States With Vite

Jul 7th 2022 – christoph-rumpel.com

Let's check out how we can improve working with Livewire and Vite together, by using the Vite Livewire Plugin by Fabio Ivona.

Making Vite and Valet play nice together original

Jun 29th 2022 by Freek Van der Herten – 3 minute read

Yesterday, the Laravel team launched the official vite-plugin. From now on, Vite will be the standard build tool for Laravel. The main benefits are vastly improved build times and a more straightforward API. Want to know more about it? Head over to the official docs. There's also a migration guide to go from Mix to Vite.

When I followed that guide to upgrade the freek.dev codebase from Mix to Vite , npm dev could successfully start-up Vite, but in the browser the JS / CSS did not load. Let's review how I could fix that.

Join 9,500+ smart developers

Get my monthly newsletter with what I learn from running Spatie, building Oh Dear, and maintaining 300+ open source packages. Practical takes on Laravel, PHP, and AI that you can actually use.

No spam. Unsubscribe anytime. You can also follow me on X.

What's new in Tailwind 3.1

Jun 9th 2022

Adam shows the cool new stuff!

Creating Dynamic HTML Tooltips with Alpine and alpine-tooltip

May 24th 2022 – ryangjchandler.co.uk - submitted by Ryan Chandler

After integrating Tippy into a few projects with Alpine.js, I decided to write my own plugin to make the integration easier and the API a little nicer (x-tooltip and $tooltip).

Creating your own color system with Tailwind

May 23rd 2022 – ohdear.app

In this post, Oh Dear's front end developer Nick goes into more detail on why and how he implemented a tailwind-like color system that will be used in the upcoming redesign.

Bringing page transitions to the web

May 16th 2022

Here's a cool feature the Chrome team is working on. It's already available in Canary.

Building Oh Dear’s new design: Project setup

Apr 13th 2022 – ohdear.app

We are currently rebuilding the Oh Dear website and application frontend. In this post, you'll read more about the project setup and tools used.

Those HTML Attributes You Never Use

Mar 30th 2022 – www.smashingmagazine.com

In this article, Louis Lazaris describes and demonstrates some interesting HTML attributes that you may or may not have heard of and perhaps find useful enough to personally use in one of your projects.

Using Importmaps in Laravel

Jan 27th 2022 - submitted by Tony Messias

Tony Messias has ported a cool feature from Rails to Laravel.

Recreating the GitHub UI with Tailwind

Jan 26th 2022

Here's Jess Archer showing how you can recreate the GitHub UI with Tailwind.

What's new in Tailwind CSS v3.0

Dec 15th 2021

Another impressive, feature rich release by the Tailwind team. Here's a rundown of all the new features.

The all-new Just-in-Time CDN for Tailwind

Nov 15th 2021

Simon give you a tour of the all-new Just-in-Time CDN build we're working on for Tailwind CSS v3.0, which lets you prototype with every variant, arbitrary values, and more - directly in the browser.

How Livewire works (a deep dive)

Oct 12th 2021 – calebporzio.com

The experience of using Livewire seems magical. It's as if your front-end HTML can call your PHP code and everything just works. A lot goes into making this magic happen.

Building a better search with Monaco and amCharts original

Sep 30th 2021 – flareapp.io

At Flare, we launched a new search experience. We have a very cool search field with autocompletions (powered by the rendering engine behind VS Code), and a very smooth graph powered by AmCharts. Let's take a look at the technical details!

Building a simple dashboard using Tailwind original

Sep 21st 2021 by Freek Van der Herten – 1 minute read

In this stream, Shruti Balasa show how powerful Tailwind is. She builds a simple dashboard layout in only a couple of minutes. If you want to learn more about Tailwind, consider buying a ticket for her online workshop at Full Stack Europe. You can get a 20% discount for Shruti's workshop by using…

Freek.dev