Photo by Jukan Tateisi on Unsplash

How to Plan a Big App from Scratch as a Sideproject

Understanding the Core Problem and Scope Before diving into development, understand the problem you’re trying to solve. Articulate this clearly to avoid feature creep and stay focused. Define the Problem Statement A well-defined problem statement guides your entire project. Consider these questions: What specific issue does the app address? Who are the primary users? What value does it bring to users? Document the problem statement and revisit it periodically to ensure you’re on track....

May 15, 2024 · 6 min · Helder Esteves
Photo by Daniela Cuevas on Unsplash

Next.JS 14 Tips You Need to Know in 2024

Tip 1: Leverage Middleware for Authenticated SSR Routes Next.js 14 enhances middleware capabilities, allowing developers to handle authentication more efficiently at the server side. Instead of traditional methods of guarding routes, use middleware to intercept requests and validate authentication tokens before rendering. This reduces unnecessary client-side checks and streamlines the SSR process. Use Case: Secure an admin dashboard route to render server-side based on user roles. 1 2 3 4 5 6 7 8 9 10 11 12 // middleware....

May 8, 2024 · 5 min · Helder Esteves
Photo by Tim Chow on Unsplash

15 Advanced JavaScript Tips for Clean and Efficient Code

1. Utilize Tagged Template Literals for Cleaner HTML/SVG Generation Use Case: Dynamically generate HTML or SVG content. Benefits: Improves readability and maintainability. Example: 1 2 3 4 5 6 7 const item = 'cup'; const quantity = 3; const htmlContent = html`<div>You ordered ${quantity} ${item}s.</div>`; function html(strings, ...values) { return strings.reduce((acc, str, i) => `${acc}${str}${values[i] || ''}`, ''); } 2. Adopt Object.observe for Reactive Programming Use Case: Implement data-binding for web components without external libraries....

April 23, 2024 · 4 min · Helder Esteves
Photo by Andrew Ridley on Unsplash

5 JS Design Patterns Every Developer Should Know

Design patterns are reusable solutions to common programming problems. They help developers write code that is more modular, maintainable, and efficient. Do you know all of these 5? 1. Singleton Pattern This pattern ensures that there is only one instance of a class and provides a global point of access to that instance. For example, a database connection object can be created as a Singleton to ensure that only one connection is made to the database throughout the entire application....

March 6, 2023 · 7 min · Helder Esteves
Photo by Peter Olexa on Unsplash

React useEffect: 4 Tips Every Developer Should Know

Let’s talk about useEffects in React Hooks! I’m going to share with you 4 tips you should have in mind when using useEffect. Use a useEffect for a single purpose In React Hooks, you can have multiple useEffect functions. This is a great feature because, if we analyze how to write clean code, you’ll see that functions should serve a single purpose (much like how a sentence should communicate one idea only)....

August 9, 2020 · 6 min · Helder Esteves