#css #frontend #webdev

Popover API 101

Browsers have been getting some pretty important features at a rapid pace lately. Features that might take several JavaScript (or CSS) libraries to implement are now available in browsers out of the box.

First Dialogs and now Popovers! The Popover API that can be used to create Popovers is now widely available in most modern browsers.

In this article, I will cover the basics of the Popover API and how to use it to create a Popover in the no-fluff way possible.

👉 Read article 📄

👉 @webdev_trends

#Laravel #php #backend #webdev

Building fast, fuzzy site search with Laravel and Typesense

Modern applications have high demands for data storage capabilities. Over the past 10 years, the rise of purpose-built data platforms has taken off with segmentation around data and analytics, transactional, related entities and graphs, as well as search and artificial intelligence. The search space alone has seen tremendous growth which is requiring vendors to push their platforms into new and emerging areas including support for vector embeddings. All of this sounds amazing and futuristic, but what if the same platform that supported AI also supported good old traditional search? And what about support for a more human search that includes things like typographical errors? I want to explore a platform by the company Typesense and how well it pairs with the web stalwart in PHP with Laravel.

👉 Read article 📄

👉 @webdev_trends

#laravel #php #Eloquent #ORM #backend #webdev

Laravel Tip💡: The firstWhere Method

We often need to get the first record matching a where statement. While where() combined with first() does the job, Laravel ships with a shortcut firstWhere() to do exactly that 🚀

👉 @webdev_trends

#DevOps #serverless

Serverless architecture is popular with developers for many reasons.

One of them is that it lets you focus on building and deploying code instead of managing servers.

In this guide, Faith teaches you serverless architecture patterns and best practices.

👉 Read article 📄

👉 @webdev_trends

#js #JavaScript #guide #tutorial #frontend #webdev

Arrays and objects are key data structures in JavaScript.

And while JS provides built-in methods to work with them, using a library like Collect.js can help.

👉 Read article 📄

👉 @webdev_trends

#ImpostorSyndrome

How to Overcome Impostor Syndrome as a Developer

Impostor syndrome is a pervasive feeling of self-doubt and inadequacy that makes you believe you are a fraud despite your achievements and skills.

👉 Read article 📄

@webdev_trends

#js #JavaScript #beginners #frontend #webdev

Handling dates and times is a common task in JavaScript development. While JavaScript's native Date object offers a variety of methods to work with dates, there are scenarios where using external libraries like Day.js or Moment.js can simplify your workflow and provide more robust solutions.

In this article, we’ll explore common cases that can be solved by JavaScript’s native Date object and those that are best handled by external libraries. We’ll also compare Day.js and Moment.js to help you choose the right tool for your needs.

👉 Read article 📄

👉 @webdev_trends

#html5 #html #js #JavaScript #frontend #webdev

MediaElement.js is a powerful JavaScript library that allows developers to create a consistent and feature-rich video and audio player across different browsers and devices. By integrating MediaElement.js into your HTML5 video player, you can take advantage of its extensive customization options and plugins to enhance the media playback experience.

👉 Read article 📄

👉 @webdev_trends

#SEO #Frontend #webdev

Hey there, fellow web developers! Ever clicked on a website and felt like you were waiting an eternity for it to load? Yeah, we've all been there. That's where frontend optimization comes in. It's like giving your website a turbo boost to make it lightning-fast. And to make sure your website is actually speedy, we have Web Vitals – a set of metrics that measure user experience.

👉 Read article 📄

👉 @webdev_trends

#typeScript Frontend #webdev

Branded types in TypeScript allow us to write code more clearly and provide more type-safe solutions. This powerful feature is also very simple to implement and can help us maintain our code more efficiently.

👉 Read article 📄

👉 @webdev_trends

#devops #GitHubActions #docker #nginx #webdev

I got a job a few months ago as a Golang Developer and I was ecstatic to finally work on a project that uses Go. For the past 3 years, I worked with Python and Node and had self-taught Go. I was eager to work on production-level code and not just my personal projects (of which I had built a lot), so when the opportunity came, I jumped at it. Due to some circumstances, I had to work on the project alone and I was left to manage a lot of the codebase, not just backend alone now but also frontend. The most troubling part, however, had to do with deployments.

All deployments were done manually, which meant that changes were slow and dependent on a developer. I had never really handled anything related to DevOps, but I knew there had to be an easier way to do this. But first, I needed to understand how the deployment even worked.

👉 Read article 📄

👉 @webdev_trends

#kubernetes #docker #devops #webdev

Understanding Deployments and Replica Sets in Kubernetes

Welcome to the next instalment of our CK 2024 blog series, where we dive deep into Kubernetes concepts and practices. In this post, we'll be focusing on Deployments and Replica Sets, which are fundamental to managing applications in a Kubernetes cluster.

👉 Read article 📄

👉 @webdev_trends

#TypeScript #ts #JavaScript #js #docker #webdev

IMPORTANT: This is about running JavaScript and TypeScript code only. That being said, the writing might also be the direction to run other code in other languages.

Allowing users to execute their code within your application opens up a world of customization and functionality, yet it also exposes your platform to significant security threats.

Given that it is user code, everything is expected, from halting the servers (it could be infinity loops) to stealing sensitive information.

This article will explore various strategies to mitigate run user code, including Web Workers, static code analysis, and more…

👉 Read article 📄

👉 @webdev_trends

#devops #jenkins #docker #grafana

DevOps Monitoring and Automation Tool using Jenkins, Prometheus, Grafana and Docker

In this guide, we will walk through the process of setting up a DevOps monitoring and automation tool and understanding how different tools can be used together for this purpose: Jenkins for continuous integration and continuous deployment(CI/CD), Prometheus for metrics collection, Grafana for visualization, and Docker for containerization.

👉 Read article 📄

👉 @webdev_trends

#kubernetes #docker #devops #beginners

ConfigMaps and Secrets in Kubernetes

Hello everyone, welcome back to my blog series CK 2024! Today we’ll be diving into the concepts of ConfigMaps and Secrets in Kubernetes. Although we touched on these topics briefly in earlier posts, I realized we haven’t given them the full attention they deserve. So, let's rectify that today with an in-depth look and a hands-on demo.

👉 Read article 📄

👉 @webdev_trends

#typescript #webdev #javascript #programming

In TypeScript, when we want to define an object type, there are several concise options such as Object, {}, and object. What are the differences between them?

👉 Read article 📄

👉 @webdev_trends

#javascript #websecurity #clickjacking #secureweb #webdev

Preventing Clickjacking Attacks in JavaScript

Clickjacking, also known as UI redressing, is a type of attack where malicious actors trick users into clicking on something different from what they perceive by embedding web pages within iframes. This can lead to unauthorized actions and compromise user security. In this blog, we will explore how to prevent clickjacking attacks using JavaScript and server configurations for Apache and Nginx, along with user-friendly examples.

👉 Read article 📄

👉 @webdev_trends

#Python #cheatsheet

This cheat sheet provides a quick reference for essential Python data types, helping you navigate the world of data with confidence.

👉 @webdev_trends

#js #JavaScript #nextjs #security #webdev

9 Tips for Building a Secure Web Application with tRPC, Next.js, Prisma, Turbo, and NextAuth

Read these 9 key security tips on building a secure web app with tRPC, Next.js, Prisma, Turbo, and NextAuth. Practical insights from a weekend project.

👉 Read article 👈

@webdev_trends

#js #JavaScript #OOP #webdev

Understand the four pillars of Object-Oriented Programming in JavaScript:
✅ Encapsulation
✅ Abstraction
✅ Inheritance
✅ Polymorphism

👉 Read article 👈

@webdev_trends

#Docker #DevOps #GitHubActions #webdev

Learn about setting up containerized apps with load balancing using Caddy, and automating deployment with GitHub Actions in my latest article! Check it out.

👉 Read article 👈

@webdev_trends