#webdev #javascript #polyfill

All About JavaScript Polyfills

What are polyfills in JavaScript, how do you build or use them, and why may you need them? This article replies all these questions.

👉 Read article

@webdev_trends

#webdev #javascript #react #hhok #useOptimistic

Understanding optimistic UI and React’s useOptimistic Hook

Milliseconds can make or break user experiences, as frustration from delays can drive them away from your site. One strategy that has gained traction for its ability to deliver swift, responsive interactions is the optimistic UI pattern. This pattern allows you to update a UI immediately after a user completes an action, based on the assumption that the background operations will succeed. This method increases the perception of an app’s speed and greatly improves user experience by providing instant feedback.

👉 Read article

@webdev_trends

#webdev #typescript #graphql #middleware

Automatically Generated GraphQL Middleware Service

I delved into the feasibility of creating a fully automated GraphQL middleware service. The goal was to develop a universal middleware solution that could be seamlessly adapted to various projects.

👉 Read article

@webdev_trends

#devops #ubuntu #docker

Installing Docker on Ubuntu 20.04

Installing Docker on Ubuntu 20.04 is a straightforward process that involves several steps, including setting up the repository, installing Docker, and configuring it for your needs. Docker is a popular platform for developing, shipping, and running applications inside containers. This guide will walk you through each step in detail, ensuring you have Docker up and running on your Ubuntu 20.04 system.

👉 Read article

@webdev_trends

#devops #kubernetes #docker #contairen

Kubernetes: A beginner's guide

Kubernetes is an orchestration tool. It is often used alongside docker. Kubernetes is used when we want to scale our containers.

👉 Read article

@webdev_trends

#devops #kubernetes #docker #contairen

Docker Swarm vs Kubernetes: Which Should You Choose? 🚀

In the world of container orchestration, Docker Swarm and Kubernetes stand out as the most popular choices. Both tools aim to simplify the management of containerized applications, but they differ significantly in features, complexity, and use cases. This article will dive deep into the comparison, helping you decide which orchestration tool is best suited for your needs. 🛠

👉 Read article

@webdev_trends

#webdev #frontend #css #tips

Relative Color Syntax — Basic Use Cases

As of last month, Firefox 128’s support of the relative color syntax means we’ve now got support across the board. I’m excited about that as it’s an extremely powerful way to manipulate colors in CSS. Plus it was part of Interop this year so that is further proof that is trucking along nicely.

👉 Read article

@webdev_trends

#webdev #frontend #css #csswg

Partial Feature Queries, Relaxed Layout Containment, and More

Over the last month, the CSS Working Group has determined we can loosen containment restrictions for query containers, and agreed on a syntax for special-case support queries (like support for the gap property in a flex context, or support for align-content in a block flow context).

👉 Read article

@webdev_trends

#webdev #laravel #backend #api

Automated API documentation generation for Laravel with static code analysis using Scramble

Documenting an API in Laravel often involves using packages that rely on manual PHPDoc annotations. While this method works, it is time-consuming, error-prone, and often leads to documentation becoming outdated as the codebase evolves.

This disconnection between code and documentation can result in inaccuracies that mislead developers and hinder project maintenance.

There is also the option to maintain an OpenAPI spec file manually, but this too can become a ton of work and easily outdated.

👉 Read article

@webdev_trends

#webdev #laravel #backend

Block Known Spam IPs from Your Laravel App with the Abuse IP Package

The Laravel Abuse IP community package by Rahul Alam adds a layer of protection to your Laravel application from known spam IPs. This package provides an Artisan command to keep your IP list in sync with the Aggregated AbuseIPDB blocklist and middleware to check requests against the list.

To start using this package, you need sync the blocklist file of IPs. If you run your application on multiple servers, your storage drive will need to be centralized, or you'll need to sync and store the IP list data on each server.

👉 Read article

@webdev_trends

#webdev #laravel #mongodb #api #backend

How to Create Laravel 11 API with MongoDB Database

Hello, laravel web developers! In this article, we'll see how to create Laravel 11 API with MongoDB database. In laravel 11, we'll create an API. Also, we'll use the MongoDB database. Here, we'll install mongodb/laravel-mongodb composer package.

MongoDB is built on a scale-out architecture that has become popular with developers of all kinds for developing scalable applications with evolving data schemas.

As a document database, MongoDB makes it easy for developers to store structured or unstructured data. It uses a JSON-like format to store documents.

👉 Read article

@webdev_trends

#webdev #laravel #tips #backend

Understanding Reduce Operations in Laravel: A Beginner's Guide

Laravel has a handy Collection helper that can help you work with array data. It takes a functional programming approach to manipulate the data, and one of the operations you can perform is the reduce operation.

The concept of reduction operations might seem daunting at first. However, once you grasp the basic idea, you'll find it's a powerful tool that can simplify your code and make it more expressive. In this article, we'll break down reduction operations into easy-to-understand concepts and provide practical examples using Laravel's collection reduce() method.

👉 Read article

@webdev_trends

#webdev #laravel #symfony #arrays #tips #backend

How to Search in a PHP Associative Array – Fast tips

Associative arrays are a fundamental data structure in PHP, allowing developers to store key-value pairs. They are versatile and commonly used to represent structured data. Searching for specific elements within a PHP associative array is a common task. But the most native functions available in PHP work great with simple arrays.

For this reason we often have to find combinations of functions that allow us to do the same things on associative arrays. Possibly without out-of-memory errors 😁.

In this tutorial, we will explore various methods and techniques to search for values in a PHP associative array.

👉 Read article

@webdev_trends

#webdev #laravel #php #tutorial #backend

Setting Up a Laravel for Local Development Environment

Learn how to set up a local development environment for Laravel with our comprehensive guide. From installation to configuration, we've got you covered with best practices and tools for an efficient Laravel local setup.

👉 Read article

@webdev_trends

#webdev #laravel #twill #tutorial #backend

Getting Started with Twill, an Open Source Laravel-Based CMS

How do companies like OpenAI, The New York Times, Pentagram, and the Art Institute of Chicago manage their brand identity when publishing content online? They all use the same powerful and flexible tool to create bespoke content management systems. Follow along as we explore how leading companies use Twill to differentiate themselves in a competitive online landscape.

👉 Read article

@webdev_trends

#webdev #laravel #inertia #tutorial #backend

Create a custom error page with Laravel and Inertia

How to display a custom error page with Inertia instead of Laravel’s default error pages.

👉 Read article

@webdev_trends

#webdev #javascript #node #beginners

require Vs import In JavaScript

I remember when I started coding I would see some js files using require() to import modules and other files using import. This always confused me as I didn’t really understand what the difference was or why there was inconsistency across projects. If you’re wondering the same thing, continue reading!

👉 Read article

@webdev_trends

#webdev #javascript #nextjs #beginners

Exploring Advanced React: Unlocking the Power of Next.js

In the ever-evolving world of web development, staying ahead of the curve is crucial. Enter Next.js, a powerful React framework that's revolutionizing how we build modern web applications. Let's dive into what makes Next.js special and how it can supercharge your development process, complete with practical examples.

👉 Read article

@webdev_trends

#webdev #javascript

Why URL hashes are my favorite way to fire events

As a young web developer, I often wondered what the best way to fire events was (for example, to make a link display new content on the page, without reloading). I considered using HTML elements as event handlers, by changing a property when firing an event—but this just seemed too in the way. I needed something out of the way of my HTML.

👉 Read article

@webdev_trends

#webdev #javascript #react #reacthooks #customhook

Reusing Logic in React with Custom Hooks: a Practical guide

Custom hooks are a powerful feature in React that are used for more specific purposes unlike React build-in hooks, and it's done by encapsulating common functionalities into independent functions. custom hooks promote re-usability, improve component organization and overall enhance code maintainability.

In this guide will dive into the purposes of using a custom hooks, understanding the fundamental of creating custom hook and how to use it other components. then we will illustrate a real world example by building a fetch API custom hook.

👉 Read article

@webdev_trends

#webdev #javascript #beginners

How to Check if a Key Exists in JavaScript

When working with objects in JavaScript, it’s common to encounter situations where you need to verify the presence of a specific key. Whether you're dealing with API responses, configurations, or dynamic data structures, knowing how to javascript check if a key exists is essential for writing robust and error-free code. In this article, we’ll explore various methods to determine if a key exists in an object, discussing their usage, advantages, and best practices.

👉 Read article

@webdev_trends