DEV Community: Giuliano1993

[Boost]

Giuliano1993 — Tue, 11 Mar 2025 12:24:12 +0000

Create your custom npm template package

Donato Riccio ・ Mar 10

#webdev #javascript #npm #vite

MonDEV goes on a break

Giuliano1993 — Mon, 03 Feb 2025 08:00:00 +0000

Good morning everyone and happy MonDEV ☕

So, how did this first month of 2025 go? I really hope it's been a great start to the year for you!

Mine, although with ups and downs, hasn't been exactly the beginning I hoped for, in fact I'm here to tell you that unfortunately I will have to suspend the newsletter for a while.

In general, I keep my content and work life compartmentalized from my private life, but there are times when this is not possible, and simply to better square things, it's necessary to take your own time and space.

This doesn't mean a closing of the newsletter, and I hope to be back to keep you company on Monday mornings as soon as possible, also because I still have a nice collection of tools to share with you, and furthermore it would mean that many things have returned to their place in daily life, which is clearly what I hope for!

Wishing to write you again soon, I wish you a good start to the week and, as always

Happy coding 0_1

GitHub in terminal?

Giuliano1993 — Mon, 27 Jan 2025 08:00:00 +0000

Good morning everyone and happy MonDEV! ☕
Ready to start a new week? In these days I am redoing a bit of "recollection" and reviewing of the tools for the newsletter, content I want to write, and also some projects to follow in parallel!

The last few months have been quite busy and I have been able to dedicate myself to personal projects less than I had hoped, but hopefully I can fix this soon and return to both my projects and contributing to open source as soon as possible!

As a good omen for this return to open source projects, today I want to share with you a tool that can be useful if you spend a lot of time contributing and don't want to go back and forth from github.

The tool for today is called gh-dash and it is a beautiful extension of github's CLI that allows you to have a practical interactive dashboard in your terminal.

Once installed, you just need to type gh dash in your terminal to have an overview of your pull requests and your issues (opened, followed, and assigned) and possibly also interact with them, assigning or commenting on them, all conveniently from the terminal, in one place.

Prefer the visualization on github? No problem, once you have identified the issue or pull request of your interest, you can open it directly in the browser with o.

If you are very active on Github, let me know if you find it an interesting and practical tool like me or if it's just me who would literally do everything directly from the terminal 🤣

Articles of the week

Initial load performance for React developers: investigative deep dive A rather in-depth article on how to understand, study, and then respond well regarding the metrics of your projects in react! Because keeping an eye on performance is always important.
Introducing Citations on the Anthropic API If you enjoy experimenting with AI for personal use, this new tool available for Antrhopic might interest you. Included in the standard plan now, you can ask Claude to pinpoint the exact points of a certain document from which information has been extracted through "Citations" via API.

That's all for this week too! I hope I left you with some interesting insights and that you will have the opportunity to read and experience them!

Have a great week
Happy Coding 0_1

Creative components with React Bits

Giuliano1993 — Mon, 20 Jan 2025 08:00:00 +0000

Good morning everyone and happy MonDEV! ☕

How was last week?

I hope you had the chance, as always, to experiment with something interesting for your projects 😄

In the past few days, I have to say that between intense work projects and a bit of well-deserved family time, that is not always easy to find, I managed to dig less into the various tools I have in store for you!

But fear not because I always have some aces up my sleeve for the busiest weeks and this time it's a nice React component library for you!

ReactBits is a collection of components and snippets to add a touch of dynamism to your page when needed! You can find components from various libraries, or entire snippets to build them from scratch and freely customize interactive backgrounds and advanced animations.

Some of the animations are definitely more classic and commonly found, but there are some really interesting and creative ones, which can help you give that extra touch to your pages without going crazy to create them from scratch, or still represent a good starting point to work on!

Here is the video where I show you some of these components to give you an idea 😄

What do you think? Do you use libraries to handle such situations or do you prefer to build interactive elements like these on your own?

Articles of the week

Top 10 ways to monitor Linux in the console: if you are always interested in knowing and monitoring the status of your machine (in a UNIX environment), then this article can have some tips that might be interesting for you!
Making Beautiful API Keys: as you know, I cannot resist a good content that delves into making the developer experience better in some aspects. Here the decision-making processes on creating API keys as functional as they are appealing to use for developers are discussed.

That's all for this week, I've been concise but I hope I still brought you some useful tools 😄

As always, have a great week and

Happy Coding 0_1

Back to MonDEV 2025

Giuliano1993 — Mon, 13 Jan 2025 08:00:00 +0000

Good morning everyone and happy MonDEV ☕

first of all welcome back and happy new year! I hope this 2025 has started well! During the holidays I almost completely unplugged, between family celebrations, birthdays, and so on!

As always, after breaks there is a lot of material to catch up on and I can't wait to get started on everything!

But let's start with the news! As promised, MonDEV would be available in a new format since the resumption! So I am happy to tell you that starting from this week, the newsletter will also have a video version, to better showcase the various tools I will talk about from week to week!

Obviously the idea is always to be brief, so I chose to use youtube shorts to do it, with the promise of staying under three minutes (so I will have to learn to be concise, and that will be a nice challenge 🤣)!

I leave you here the link to the new youtube channel where you can already find this week's short! There is certainly a lot to work on, but it's a start anyway! Give me time and it will improve there too! 😄

But speaking of being concise, let's talk about this week's tool! Having closed the newsletter after the serverless-day, it seemed like a good idea to start from the serverless theme and from a tool that I had for a while!

Serverless-framework is a very interesting tool that allows you, on one hand through a dashboard and on the other hand, especially through a CLI, to create and run your Serverless applications effortlessly. The CLI allows you to create projects in Node and Python (although it is optimized for the former) and offers you various already working structures, from a simple single lambda to an entire express application with various sample functions. If you are just starting out in this world like me and want to have a boilerplate to start experimenting in a simple way, I think it's a good entry point!

You will first need to configure the dashboard and link it to the CLI. After that, after writing the code, you just need to run serverless dev in your terminal to start testing everything!

Today I have already gone on a bit, so I refer you to the video where I show the steps better and I hope you will find it interesting; any feedback is welcome, as I know there is definitely room for improvement!

Articles of the week

Set Data on a Fluent Instance in Laravel 11.36 : this is just one of several articles on Fluent, a Laravel class that is being increasingly implemented and becoming more appealing. If you are not familiar with it, I think it's a nice gift for all those who think "PHP is nice, but if only it had dot notation it would be better." Take a look!
Awesome falsehood the lists of articles and content are back; this time an interesting list of beliefs deeply rooted in the mentality of us developers but actually false! There are several fun ones, for example those about emails, which can be very interesting to delve into!

So we have come to the end of the first newsletter of 2025! We have new tools, articles, and even formats to explore! I also hope this year to be able to bring you stimulating tools and content that can be useful in your work or personal projects!

Happy 2025 and have a great start to the week!

Happy Coding 0_1

Happy Holidays From MonDEV

Giuliano1993 — Mon, 23 Dec 2024 08:13:47 +0000

Good morning everyone and happy MonDEV! ☕

It seems like we have finally reached the holidays! Are you ready to celebrate? 🎄

I can say that I have already received my Christmas present from you, because MonDEV has officially reached 100 subscribers! A first small but important milestone! Thanks to those who started following and supporting the newsletter from the beginning and thanks also to those who have joined more recently!

A huge thank you also goes to my friend Giuppi who, in one of the latest videos, talked about one of the tools reviewed a few weeks ago (ShadCn Form), also mentioning MonDEV, helping us to reach this first milestone!

Thank you so much! 🎁

To celebrate, starting from January MonDEV will have a new addition, for which I am already studying and I can't wait to put it into practice, but you will see 😎

Today I will not talk about specific tools, because I hope you are already in the Christmas mood and relaxing a bit! But for those who are curious, I leave you two small utilities (one more related to FE and one to BE, to make everyone happy) that can certainly be useful in many situations, both for work and for some personal projects, who knows!

The first one is EasingWizard, a visual editor to help you create the perfect easing for your CSS animations, generating in real time the necessary CSS to apply it on your page!

The second one is Crontab Guru, a page that validates your cron tab expressions and interprets them into human language, to ensure that you have applied the correct timing. It also contains some useful examples and a summary table of the main usable values!

These were just a couple of small snacks to keep under the tree!

That being said, MonDEV will be back on Monday, January 13th! I wish you all happy holidays and a great start to the new year!

And for those who will be coding even these days maybe for fun...

Happy Coding 0_1

New explorations at Serverless day

Giuliano1993 — Mon, 16 Dec 2024 08:00:00 +0000

Good morning everyone and happy MonDEV ☕

Christmas is just over a week away and our Monday coffee is starting to taste more like hot chocolate, and the Christmas lights far exceed those of the LEDs at our workstations...maybe! 🤩

If it's not already obvious, I'm a lover of the Christmas period and I wanted to share some of this joy with you, hoping that you also enjoy this time of year in the same way!

What are we talking about today? Today I won't talk about a specific tool; I will briefly talk about the Serverless day, in which I participated last Thursday and Friday! Why "briefly", while usually I do a detailed summary? Because this time I was in an "exploratory" phase; the serverless world has always intrigued me but it is not within my current skills nor have I ever worked with it, so I took the opportunity to get an idea and find a starting point to explore this world. ☁️

Could I have done this by searching online?

Maybe, but meeting other developers, hearing about it, and participating in workshops is much more motivating and functional for me!

So I don't have the skills to make a complete summary of all that I saw and heard, but I want to tell you a bit about what I took away from these two days and why I came out excited and curious to delve deeper!

The first day was dedicated to a workshop held by Luciano Mammino, on how to write optimized lambdas using Rust. This gave me the opportunity to work with the crab language in a new way and approach the use of lambdas, the serverless functions of AWS. 🦀

The whole workshop was extremely interesting and starting from scratch, we managed to deploy more than one function with increasingly incremental functionalities. The advantages of writing these functions with a language like Rust are many, thanks to the lightweight final artifact and the minimal memory utilized even at runtime! In a situation like that of lambdas where a greater execution time and memory needed correspond to a higher economic cost, these types of optimizations become critical.

To develop these projects we used Cargo Lambda a library that provides a boilerplate for writing your lambdas in Rust and, once ready, allows you to deploy them directly from the terminal.

However, since the functions deployed with Cargo Lambda are separate units from the rest and would then need to be connected by hand, which is not ideal, we also worked with SAM also having (for me) a first approach to infrastructure as code, which really excited me. We then defined a schema to deploy and orchestrate the lambda together directly in our project, to then release it on AWS having everything connected.

I came out of the first day full of ideas and curiosity, a feeling then reinforced by the second day where I was able to get various insights into the serverless world and realize how much of an opportunity it can be for us developers to further explore this aspect, which undoubtedly requires a more vertical competence, paying attention not only to the code but also to the economic aspect related to its execution (number and execution time as well as memory used can be critical factors) and to the architecture. As an approach, it certainly requires the developer to have a broader perspective to see how to best orchestrate everything as a whole, but it also provides greater flexibility and agility in deploying a solution!

I approached these two days with curiosity and a desire to explore; I definitely came out enriched and also curious to take a few steps in this world, perhaps returning next year with some more knowledge and skills!

How many of you are already working in the serverless field or would be curious to try it out?

Let me know!

Articles of the week

Spin up WebAssembly on DigitalOcean in Minutes talking about Rust and cloud, have you ever tried deploying a WASM component? In this article, you will find a brief guide on how to create an application with Rust, compile it into WASM, and make it available on a DigitalOcean Droplet!

Lambda Cold Starts benchmark staying on topic, one of the resources shared during the workshop showing the cold start performance of various languages! You'll see that Rust always ranks among the top in terms of performance!

For this week, I think that's all, I hope I've given you some interesting insights! With that said, I just have to wish you a good week

Happy Coding 0_1

Real time in no time

Giuliano1993 — Mon, 09 Dec 2024 08:00:00 +0000

Good morning everyone and happy MonDEV! ☕

How is this December starting for you? Have you already got into the Christmas mood? How many of you have started the new Advent of Code? Unfortunately, I am not managing to follow it this year, but I don't exclude the possibility of having a full-immersion during the holidays, who knows! 🎄

But let's get to it, what's the tool of the week?

Today, I want to talk to you about Convex, a tool that in some aspects resembles supabase or appwrite, essentially a Backend-As-A-Service; however, it has a series of differences that make it really interesting.

Let's start with the assumption that, despite offering similar features to other tools, such as managing auth or the filesystem, the focus of this tool is mainly on the database; the entire structure is designed to make the management of the DB as simple and agile as possible.

Starting from the base, if you have a classic JSON collection locally, through the command npx convex import --table you can import it directly into your remote project, creating the table at the same time. Then, going to the interface, you can automatically generate the schema that will allow you to work with your data in a typed manner without having to manually write the related types.

Regarding data access, everything is managed through queries and mutations, the former for simply querying data and the latter for making changes. As you develop these functions to interact with the DB, they will be saved directly on the convex server, and you can also run them directly from there to test them with different parameters, check their performance and output in a scenario isolated from the rest of the application. Moreover, if there are operations that need to be performed periodically, on the db or not, convex also implements the possibility of setting up cron tasks.

If all this is not enough for you, I saved the most interesting thing for last. Development with Convex is RealTime by default. Therefore, any change that occurs in your db will be displayed in real time to every client without the need for additional implementations. This makes Convex ideal for quickly having a structure to rely on with very dynamic applications where users need constant updates!

The Convex client is available for a wide variety of languages and frameworks, from pure JS to React or TanStack Query, but also Python, Kotlin, and Rust! In short, you have many ways to try and use it; I invite you to do so because it is one of those tools that makes development truly enjoyable.

Articles of the Week

PHP Performance Optimization: an interesting article on some performance and memory optimizations with PHP; useful both if you are not very familiar with the PHP world and want to delve into these concepts, and if you are more experienced and want to refresh your memory.
PIE (PHP Installer for Extensions): staying in the PHP world, anyone who has used PHP knows that there are various ways to install PHP extensions, and it's not always very straightforward. The PHP Foundation recently announced and launched a pre-release of PIE, an Extension Manager for PHP, which will roughly follow the syntax of installations with Composer.

That's all for today, I hope I provided you with some interesting insights for your Christmas projects!

As always, I just have to wish you a good week and

Happy Coding 0_1

Color Palette is served with ShadCn Theme Editor

Giuliano1993 — Mon, 02 Dec 2024 08:00:00 +0000

Good morning everyone and happy MonDEV! ☕

Also this week we are ready, keyboard in hand, to drink a sea of coffee and produce an equal amount of code 😎

And as always to support you in the process, here is your Monday morning coffee with the tool of the week!

It's Front End's turn again, and since we had fun last time with ShadCn (if you missed the newsletter I'm talking about, you can find it here), let's continue with another tool to associate with this beautiful library of components!

Specifically today I want to tell you about ShadCn Theme Editor, a beautiful tool as simple as it is powerful (just the kind I like).

By installing this package in dev mode, you can include a component in your project to view all the variables that configure the shadcn theme. At that point, you can customize them one by one, or use the randomizer to try various color possibilities.

Once you are satisfied with the result, you just have to copy all these styles with the button at the top and paste them into the ::root of your css as variables, and that's it, you will have edited your theme for the ShadCn components.

Easier than this is really tough! 😉

Articles of the week

7 Beautiful Next-Level Button Components with Vue, VueUse, and TailwindCSS: Talking about components, this article by vue school offers 7 very interesting ways to create your buttons in vue. It can also be a good opportunity to review some concepts related to interaction with elements on the page, if it's not the part you deal with in your daily routine!
State of frontend: Frontend week? Let's talk about frontend then! If you are curious about trends and data and want to have some ideas about it with a focus on the frontend, then this report is the right fit for you!

Very well! This week too I would say we are full of ideas and news to try! So I leave you to finish your coffee and as always...

Happy Coding!

Whazzup mates? What's App by CLI!

Giuliano1993 — Mon, 25 Nov 2024 08:00:00 +0000

Good morning everyone and happy MonDEV! ☕

On this chilly weekend, staying at home, drinking tea and exploring many new tools have been great company!

If sometimes it seems like there are no real news coming out, then weeks full of discoveries follow... and the list of things to test for you keeps growing!

Today's tool was suggested to me by my brother, who has decided to follow what is becoming a family tradition and delve into programming himself.

Have you ever wanted to send WhatsApp messages programmatically? And maybe do it without necessarily using a Whatsapp Business account or any external dedicated platforms?

If so, today I have a couple of proposals that might be interesting.

The first one is called Mudslide and it's a CLI to send messages, media, generic files, location, and more from your WA contact directly from your terminal. Everything works by logging in via a QR code printed in the terminal, a bit like WhatsApp web. It's very simple and works well; however, if you want to develop your own tool by connecting to WA, then you can use Bayles, the library behind Mudslide. It's available in TypeScript and C#, and it allows you to create a socket to connect to WA and send messages programmatically. If you decide to go this route, my advice is to still take a look at Mudslide's code, to get a starting point with this library, and then develop your ideas further!

Articles of the week

Tailwind CSS v4.0 Beta 1 if you're a Tailwind fan you might already know, otherwise this could be news to you, the beta version of Tailwind 4 is now available. In this short article, the main news are summarized, but there's a much more in-depth insight linked about the individual improvements and news; and this update seems really juicy, both in terms of performance and news! Zero spoilers, but go and take a look ;)
Visualizing 13 million BlueSky users: are you fond of graphs? Maybe this article is for you. The author has tried to obtain the data of the current BlueSky users and visualize them through a graph, in a search for the best and most sustainable method in terms of performance! Check it out and let me know what you think!

This week too, it's time to say goodbye and start our activities! I hope I left you with some interesting ideas, let me know what you think!

As always, have a great week, happy coding

Happy Coding 0_1

PHP, Analytics and surroundings

Giuliano1993 — Mon, 18 Nov 2024 08:00:00 +0000

Good morning everyone and happy MonDEV! ☕

Did you have a good weekend? Here the mood was set on day trips to the mountains, because taking your head off the monitor is a good thing, especially on the weekend! 🏔️

But as always, this is not an obstacle to bring you the tool of the week and start off great with some new discoveries.
This week we go back to see a very simple but very interesting tool for Laravel and go back, without much surprise by now, among Nuno Maduro's repos.

This week it's time for Pan PHP a still early-stage analytics tool but very interesting especially for its simplicity and ease of implementation.

This library, through a middleware, injects a JS library into your pages and allows you to observe (on the elements you choose) how many times they have been viewed/hovered over/clicked. The data is collected anonymously and sent in a grouped way to the server (to limit the requests sent), where they will be saved in a dedicated table.

The implementation requires very few steps:

Install the library with:

composer require panphp/pan

Then with artisan install pan:

php artisan install:pan

You will be asked to run the migration for the creation of the table: confirm and you will be ready to use it in your blade/html. How?
Simply by adding the attribute data-pan to the elements you want to monitor. For example, if you have a CTA and want to know how many users have viewed/clicked the button, this is a simple and fast way to do so.

For a quick view of the collected data you can use the command

php artisan pan

Then having the table pan_analytics available in the database you can manage this data in the way that you consider most appropriate 😉

Articles of the week

Design Patterns PHP PHP week and more PHP! Not exactly an article but rather an entire repository that collects various design patterns with related examples, use cases, and implementations in PHP. For further doubts, for most of them, a link to the Wikipedia page describing the design pattern itself has been included.
Automate code commenting using VS Code and Ollama We always talk about writing code using AI, but we all know that it ends up in code that creates unexpected and unpredictable errors, and maybe we don't even remember writing it (because we actually didn't). But why not use AI to make the code written by us well documented? In the past, I talked about how to create an extension for VS Code. In this article, you will learn how to write an extension that uses Ollama to comment your code!

I would say that even this week we have loaded up on tools and readings! I hope you found something interesting, as always, any feedback is welcome!

Have a great start of the week!

Happy Coding! 0_1

Forms in seconds with ShardCn forms

Giuliano1993 — Mon, 11 Nov 2024 08:00:00 +0000

Good morning everyone and happy MonDEV! ☕

We are here again ready to start a new week discovering a new tool together!

Last week we had to deviate from the planned content due to some general malaise, but it was supposed to be the turn of a front-end tool, so here we are quickly catching up 😁

How many of you know and use Shadcn? How many of you fell in love with it? I discovered it quite recently and started using it in some personal projects, and I can only say that I really appreciate both the speed of creating components in this way that already have a base, and the customization possibilities that this method brings along.

But I'm not here to talk to you about Shadcn, which you probably already know if you don't live under a rock like myself.

I want to talk to you instead about another tool that leverages Shadcn to speed up the creation of forms in React!

It's called shadcn-form and it's an open-source project by a developer tired of having to revisit the same development logic for forms every time and write them from scratch.
Through a simple WYSIWYG editor, it allows you to select Shadcn components for your form, modify the options, arrange them, and provides you with a real-time preview and the code for the entire component file for this form.

It's really quick and easy to use, and I think I'll use it next time I need to create a form in React.

Of course, it's not perfect; there are some more advanced components that require additional external installation steps to Shadcn (which are still pointed out to you), and in general, some steps could be documented a little better; nothing that some good PRs couldn't fix! Moreover, they have activated a feature request and evaluation system for workflow management and it seems to be in full swing, so despite the small flaws, I think it's a tool to try and keep an eye on for future developments :D

Articles of the week

How to Write a Game in Under 13 Kb While Taking Care of a Baby: almost all of us have wondered at some point in our career what it's like to develop a video game. Some did it once, some made a career out of it, some eventually gave up for a thousand valid reasons. This article tells the story of a game for js13kgames, an annual challenge on developing a game with a total weight of less than 13kb. Sounds tough, right? Read this article and maybe you'll get some interesting insights!
Laravel VS Symfony: The PHP Framework Showdown: not everyone knows it, but my experience with PHP frameworks is much more linked to Symfony than Laravel. This brief article concisely, quickly, but also pragmatically explains the difference between the two! It's always useful to know which tool is right for the project we are developing ;).

Having said that, that's all, and it's time to leave you to the beginning of this week! I hope you found some interesting insights, as always I look forward to your feedback!

I just have to wish you

Happy Coding 0_1