Image used for article Craft emails with Vue and Tailwind using Inertia Mailable

Inertia Mailable is a package that allows you to design amazing emails within a Laravel project by leveraging the power of InertiaJS. Create interactive and responsive email designs by building VueJS components, enhancing them with TailwindCSS, and integrating them into your mailables.

Image used for article Create a custom error page with Laravel and Inertia

In a previous article, the fourth article on this blog, the focus was on customizing the 502 Bad Gateway error page servec by Nginx. This page was an HTML file placed directly in the /public folder. This article now focuses on customizing the error pages returned by Laravel in a VILT project.

Image used for article Collect feedback via Discord notifications in your Laravel project

It is common to come across a contact form or an email address on a website, allowing users to contact the site administrator. These forms typically request an email address, a subject, and a title. This article suggests a more open alternative to anonymity, replacing this standard format. By using Discord.

Image used for article Draw a dynamic SVG pattern with Vue

The SVG format is commonly used to display two-dimensional images or illustrations on the web. This vector format also allows for scaling up and down without loss of resolution.

Image used for article Run Laravel on your browser with Browser PHP

First and foremost, it's worth mentioning that PHP is primarily a server-side scripting language, and this article may not appeal to purists. However, it stems from a simple question: How can a PHP script be executed on the client side? Browser PHP is the outcome of this reflexion.

Image used for article Collect feedback via Slack notifications in your Laravel project

It is common to come across a contact form or an email address on a website, allowing users to contact the site administrator. These forms typically request an email address, a subject, and a title. This article suggests a more open alternative to anonymity, replacing this standard format. By using Slack.

Image used for article Organize Laravel tools on a unique subdomain

With the numerous tools provided by the Laravel framework, such as Telescope or more recently Pulse, it has become essential to centralize them on a single dashboard. Here's how to group these tools on a dedicated subdomain.

Image used for article Hello Metrics!

Every day since the launch of Capsules Codes, data has been collected from various platforms such as this blogfolio, Flintable, or X, with the aim of tracking any developments, learning, identifying mistakes made, or understanding what works and what doesn't.

Image used for article Create a Laravel package on your local environment

If you want to develop your own package, it's entirely reasonable to wonder how to test it under real conditions. Publishing the package on Packagist during development is not an option. Another approach would be to integrate it into a fresh project without using Composer. The method in this article closely simulates a real-world scenario but does require some environment setup.

Image used for article Hello Modules!

One section was missing. One that would list our modules, packages, dependencies. The Modules tab has now been added, highlighting the very first package on the list: Laravel Population.

Image used for article Build a Blog using Laravel, Vue and Canvas

Canvas is a powerful tool for Laravel applications that streamlines the writing, editing, and customization of your content with a range of publishing tools. It's an incredible all-in-one solution for creating and publishing articles, just like the one you're reading.

Image used for article Display a modal using Vue and its Teleport component

While using a modal might seem obvious on a website, its implementation can sometimes be complex. To simplify this task, the Vue framework has introduced its built-in component <Teleport>. This component allows us to “teleport” a portion of a component's template into an existing DOM node outside of the component's DOM hierarchy.

Image used for article Add a global dark mode with Tailwind CSS

The main element of this article is the dark variant that can be configured in the Tailwind CSS configuration file. Adding the class value to darkMode activates the CSS classes only when the dark class is present. The media value, on the other hand, is based on the operating system's preferences.

Image used for article Make a custom 502 Bad Gateway page

It can happen that calling a URL returns a 502 page. The 502 Bad Gateway HTTP server error response code indicates that the server, acting as a gateway or proxy, received an invalid response from the upstream server. The server then decides to return a default page.

Image used for article Flintable - I am an Allman

Many coders, ourselves included, regularly and even constantly employ static analyzers. A little refresher for those unfamiliar with this term: the static analyzer checks the code without requiring its execution. It detects logical errors, typos, violations of convention, format drifts. Once integrated into your code editor, it becomes the invisible guardian of your work, unveiling the small human mistakes that might creep into your code.

Image used for article Hello World!

It is with this article that we announce the direction we have decided to take. Our thing is the development of web and mobile tools. And let's make it useful for others as well as for ourselves.

v1.3.1

X IconGithub Icon