https://patrickdesjardins.com/blogTechnical blog posts by Patrick DesjardinsenWed, 12 Aug 2026 00:00:00 +0000https://patrickdesjardins.com/blog/using-epaper-for-studyingA few months ago, I and within a few weeks I was taking page after page of notes using . I initially liked it, but I missed taking notes with a pen. Something about scribbling, annotating, and illustrating my thoughts helps me focus and retain better than copy-pasting or typing. When I was doing my…Mon, 20 Jul 2026 00:00:00 +0000https://patrickdesjardins.com/blog/using-epaper-for-studyinghttps://patrickdesjardins.com/blog/hateoas-as-the-natural-interface-for-autonomous-agentsThe web was built for humans using a browser. APIs were built for developers who read documentation. Both scenarios never anticipate autonomous agents that must reason about what to do next. As LLM agents increasingly interact with services, a question emerges that few people are addressing directly…Fri, 17 Jul 2026 00:00:00 +0000https://patrickdesjardins.com/blog/hateoas-as-the-natural-interface-for-autonomous-agentshttps://patrickdesjardins.com/blog/generating-documentation-with-aiI will argue that generating documentation with AI is useful, specifically the kind that lives as dedicated documentation files in folders alongside the code, and specifically for business logic and architecture. My thesis is that this documentation is valuable because it serves humans and AI agents…Mon, 13 Jul 2026 00:00:00 +0000https://patrickdesjardins.com/blog/generating-documentation-with-aihttps://patrickdesjardins.com/blog/how-to-unit-test-private-method-in-typescript-2026-editionI wrote in , , , and about TypeScript and private functions. Eleven years later, I still believe that relaxing encapsulation to ease testability has the best return on investment (ROI). In this blog post I will argue that separating classes and interfaces preserves a portion of the encapsulation wh…Thu, 09 Jul 2026 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-unit-test-private-method-in-typescript-2026-editionhttps://patrickdesjardins.com/blog/mastodon-thread-static-websiteI recently visited and noticed a simple idea that I liked: comments do not need to live inside the website database. They can live on the social web, and the website can point to the discussion. For a static website, this is appealing because I do not want to run a comment server, to moderate a loc…Sat, 20 Jun 2026 00:00:00 +0000https://patrickdesjardins.com/blog/mastodon-thread-static-websitehttps://patrickdesjardins.com/blog/replacing-nextjs-with-a-rust-static-site-generatorI recently moved this website away from NextJS as the static generation engine. The site was working, but it had become heavier than what I needed. Most pages are static. Most content is markdown. The build was doing a lot of framework work for a problem that had become much smaller than the framewo…Thu, 18 Jun 2026 00:00:00 +0000https://patrickdesjardins.com/blog/replacing-nextjs-with-a-rust-static-site-generatorhttps://patrickdesjardins.com/blog/audiomachine-version3-using-esp32-rotary-displayI built an audiobook machine for my daughter in January 2022 using a Raspberry Pi and RFID cards (). In early 2026, I built a second version for my son using an ESP32 and a TFT display (). Over time, I wanted to replace my daughter's original device because the RFID cards became cumbersome whenever…Sat, 13 Jun 2026 00:00:00 +0000https://patrickdesjardins.com/blog/audiomachine-version3-using-esp32-rotary-displayhttps://patrickdesjardins.com/blog/how-to-transfer-files-between-computers-using-HDMI-Part-8-registration-and-crc ended on a frustrating note. Pagination was supposed to fix missing frames, but the real capture path still failed. I could loop the video twelve times, record 850 megs of footage, and still be short six frames. The decoder would report something like: > We have not receive all frames. We received…Fri, 05 Jun 2026 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-transfer-files-between-computers-using-HDMI-Part-8-registration-and-crchttps://patrickdesjardins.com/blog/how-a-gpu-turned-kokoro-bottleneck-from-minutes-into-secondsI recently ran into a very practical performance problem in a study-generation pipeline. The application takes lesson notes from Trilium, turns them into teaching scripts, generates flashcards, synthesizes narration with Kokoro TTS, renders a simple MP4 with ffmpeg, and uploads the result to YouTube…Mon, 01 Jun 2026 00:00:00 +0000https://patrickdesjardins.com/blog/how-a-gpu-turned-kokoro-bottleneck-from-minutes-into-secondshttps://patrickdesjardins.com/blog/automatic-audio-note-summary-with-flash-card-using-aiI recently and I am taking my notes in which allows accessing notes through an API. Since I save all my courses in a hierarchy of course → lesson → objective, I can automatically generate summaries from my own notes. My idea was not to generate notes from the course content itself but rather t…Tue, 26 May 2026 00:00:00 +0000https://patrickdesjardins.com/blog/automatic-audio-note-summary-with-flash-card-using-aihttps://patrickdesjardins.com/blog/react-to-react-native-using-aiEarly in my career, I started with VB5 and VB6 before moving to web development using PHP. Since then, I have stayed focused on the web because the ease of distribution and the ability to reach millions of users across devices always felt like a major advantage. Throughout those years, the iPhone ap…Tue, 05 May 2026 00:00:00 +0000https://patrickdesjardins.com/blog/react-to-react-native-using-aihttps://patrickdesjardins.com/blog/codex-usage-as-bad-as-claudeA month ago : >I’ve ended up using Codex every day. Last weekend I even used it for 5 hours straight and never hit a limit. That honeymoon phase lasted about three weeks. Lately, I’ve noticed I can barely use it for normal coding for more than 30 to 45 minutes before hitting a wall. Even worse,…Wed, 22 Apr 2026 00:00:00 +0000https://patrickdesjardins.com/blog/codex-usage-as-bad-as-claudehttps://patrickdesjardins.com/blog/what-is-code-quality-in-the-era-of-aII have been coding for over 28 years now. I have worked with Visual Basic, Java, C++, PHP, JavaScript, TypeScript, Python, and even a little bit of Rust. Having worked at over 15 companies and on at least double that many projects, I have seen a great deal of code. Throughout my education, my profes…Mon, 20 Apr 2026 00:00:00 +0000https://patrickdesjardins.com/blog/what-is-code-quality-in-the-era-of-aIhttps://patrickdesjardins.com/blog/silicon-valley-pursuit-of-leadershipSilicon Valley is an interesting place to be. It sits at the center of innovation with large companies and funders shaping entire industries. After spending enough time here, it is easy to believe that the world operates like Silicon Valley. However, when you stay connected with family and friends o…Wed, 15 Apr 2026 00:00:00 +0000https://patrickdesjardins.com/blog/silicon-valley-pursuit-of-leadershiphttps://patrickdesjardins.com/blog/speed-parallel-of-ai-to-carsI recently had an interesting conversation with one of our VPs. I was describing that we need to embrace the direction of AI. Today, AI is moving people from walking speed to car speed. When you think about it, that level of speed on a highway is significant, and it comes with real risk. Humans had…Mon, 13 Apr 2026 00:00:00 +0000https://patrickdesjardins.com/blog/speed-parallel-of-ai-to-carshttps://patrickdesjardins.com/blog/new-ai-work-process-of-5-daysI am currently leading a squad of four engineers, and we are working in an unconventional way: one week at a time. While short sprints have existed in the past, we are taking a slightly different twist. The reason I introduced this new work lifecycle was that we are developing a product with an AI-f…Thu, 09 Apr 2026 00:00:00 +0000https://patrickdesjardins.com/blog/new-ai-work-process-of-5-dayshttps://patrickdesjardins.com/blog/automating-the-gatekeeperAs AI continues to transform the development of software, we must fundamentally shift our habits to keep pace. Many traditional workflows have not yet adapted to this new reality, including early requirement gathering, permission systems, and the standard practices for design and code reviews. I hav…Mon, 06 Apr 2026 00:00:00 +0000https://patrickdesjardins.com/blog/automating-the-gatekeeperhttps://patrickdesjardins.com/blog/the-ai-first-lifecycleToday, I want to talk about how software engineering is changing with AI. More specifically, how the entire software lifecycle needs to adapt. Right now, most of the attention is on coding. We see constant updates about tools like Claude, Codex, or Cursor, and how they improve developer productivity…Thu, 02 Apr 2026 00:00:00 +0000https://patrickdesjardins.com/blog/the-ai-first-lifecyclehttps://patrickdesjardins.com/blog/the-ai-meeting-paradoxToday I want to talk about how AI is transforming meetings. I have noticed more and more people using it during discussions. In the past, it was already common to have laptops open in meetings, and sometimes a few people would search Google while someone was speaking. Today it feels different. Many…Mon, 30 Mar 2026 00:00:00 +0000https://patrickdesjardins.com/blog/the-ai-meeting-paradoxhttps://patrickdesjardins.com/blog/the-vibe-coding-plateauToday, I want to talk about the difference between having a vibe coding project as a side project and using the same approach at work. The main difference is the long-term consequences of the code, but also the fact that the code will continue to be worked on by other people. I notice that many deve…Fri, 27 Mar 2026 00:00:00 +0000https://patrickdesjardins.com/blog/the-vibe-coding-plateauhttps://patrickdesjardins.com/blog/Kokoro-tts-free-using-gpu-with-many-voicesI recently had many voices to generate from English text. By many, I mean about 5,000 paragraphs. One requirement I had was to produce a non-robotic voice. After searching, I was open to using a service like OpenAI TTS and paying for it, but it was quite a large amount of text to generate. Since I h…Wed, 25 Mar 2026 00:00:00 +0000https://patrickdesjardins.com/blog/Kokoro-tts-free-using-gpu-with-many-voiceshttps://patrickdesjardins.com/blog/Gemini-my-son-wrong-contextFor a little while, I moved from ChatGPT to Gemini for questions that were not related to a specific code base. Recently, I was doing some research in a new thread about houses in different areas of the United States. Suddenly, I noticed that Gemini added a note: > If you are moving to a new propert…Sat, 21 Mar 2026 00:00:00 +0000https://patrickdesjardins.com/blog/Gemini-my-son-wrong-contexthttps://patrickdesjardins.com/blog/the-consequences-of-easy-access-to-aiThe Dunning–Kruger effect occurs when individuals with limited knowledge in a domain believe that they have suddenly become experts in it. With easy access to AI tools, the Dunning–Kruger effect appears stronger than ever. Software engineering has always had areas, such as user interface design,…Thu, 19 Mar 2026 00:00:00 +0000https://patrickdesjardins.com/blog/the-consequences-of-easy-access-to-aihttps://patrickdesjardins.com/blog/ai-playwright-mcpUser interfaces and automation have always been tricky. After all, part of the process requires seeing the final result, as theoretically styling can fall into many traps. For a long time, people created unit tests using Jest or other UI frameworks and, with utility functions, could test React compo…Mon, 16 Mar 2026 00:00:00 +0000https://patrickdesjardins.com/blog/ai-playwright-mcphttps://patrickdesjardins.com/blog/cancelled-claude-code-proAt the beginning of the year, I subscribed to a year of Claude Code Pro (200$). Last weekend, I cancelled it. The reason is simple: I was hitting the limit every evening after 30 to 60 minutes. Instead of upgrading from Pro to Max, which would have increased the price by 10x, I decided to try OpenAI…Thu, 12 Mar 2026 00:00:00 +0000https://patrickdesjardins.com/blog/cancelled-claude-code-prohttps://patrickdesjardins.com/blog/AI-blinders-remain-why-humans-still-have-an-edge-for-now> The black side panels added to a horse's head during a race are primarily called blinkers (or blinders in the United States). These devices are plastic cups attached to a fabric hood placed over the horse's head and under the bridle to limit the animal's wide peripheral vision Much like a racehors…Mon, 09 Mar 2026 00:00:00 +0000https://patrickdesjardins.com/blog/AI-blinders-remain-why-humans-still-have-an-edge-for-nowhttps://patrickdesjardins.com/blog/20-codex-20-claudeI have paid $20 a month for Claude Pro since the start of the year. I usually only have time to code at night once my kids are sleeping, which gives me a tight window of two to three hours. The problem is how Claude handles usage. You get a set amount of data you can use every five hours. Even if yo…Fri, 06 Mar 2026 00:00:00 +0000https://patrickdesjardins.com/blog/20-codex-20-claudehttps://patrickdesjardins.com/blog/ai-trust-and-reviewThe more I use AI, the more I believe it represents the future of accelerated development; however, I am also increasingly wary of its tendency to "drift" in the wrong direction. While it consistently finds solutions, they aren't always the optimal ones, a reality that persists whether using Claude,…Wed, 04 Mar 2026 00:00:00 +0000https://patrickdesjardins.com/blog/ai-trust-and-reviewhttps://patrickdesjardins.com/blog/transforming-software-development-one-agent-at-timeMy journey into professionally developing agents that perform software engineering tasks is going beyond having the system simply write code. As I work more and more with agents, I realize that they are excellent at following very clear directives, but they often won’t think further. A part of me…Mon, 02 Mar 2026 00:00:00 +0000https://patrickdesjardins.com/blog/transforming-software-development-one-agent-at-timehttps://patrickdesjardins.com/blog/how-to-make-agent-ai-remember-and-forgetLike humans, an agent interacting with a large language model has memory constraints. Similarly, some models have larger capacity to retain information and act upon it. The LLM receives a limited number of tokens describing the memory it can use to reason and generate accurate responses. This capaci…Wed, 25 Feb 2026 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-make-agent-ai-remember-and-forgethttps://patrickdesjardins.com/blog/code-quality-2026-with-aiI have been working extensively with multiple AI agents coding in parallel. Imagine dozens of agents operating at the speed of ten engineers. The volume of new code reaches thousands of lines every day. The question is inevitable: how do we preserve quality? The answer may surprise some, but it is n…Mon, 23 Feb 2026 00:00:00 +0000https://patrickdesjardins.com/blog/code-quality-2026-with-aihttps://patrickdesjardins.com/blog/multi-agents-and-the-futureI joined Roblox few months ago. My job description contained this paragraph: > Driving technical excellence and strategic innovation across Roblox's core operations. Lead the development of high-impact internal products that empower teams and shape the future of how Roblox operates. Use AI to trans…Thu, 19 Feb 2026 00:00:00 +0000https://patrickdesjardins.com/blog/multi-agents-and-the-futurehttps://patrickdesjardins.com/blog/making-systemd-journal-dashboardI’m running several projects on my mini PC: 1. Discord bot 2. YouTube Radio 3. My personal note-taking server using Trilium 4. An AI RAG system I developed for Trilium 5. A Google Home audiobook service All of them write their logs to the Linux systemd journal. To inspect logs, I had to manually S…Thu, 12 Feb 2026 00:00:00 +0000https://patrickdesjardins.com/blog/making-systemd-journal-dashboardhttps://patrickdesjardins.com/blog/runninglocal-llm-nvidia-5080-for-codingFew weekends ago, I wanted to see what would be the best model of coding that I could run locally on my Intel 9 with 32 gig of ram and my Nvidia 5080 with 8gig of vram. The idea was to run to QWEN 3.0 to have a local Claude. The result was impressive in term of how fast the response occured but the…Mon, 09 Feb 2026 00:00:00 +0000https://patrickdesjardins.com/blog/runninglocal-llm-nvidia-5080-for-codinghttps://patrickdesjardins.com/blog/youtube-streaming-radio-with-auto-ai-summary-with-more-aiI recently built a that allows me to queue YouTube videos from my phone and stream only the audio back to me. I've been using it during my commute for over two weeks now. I've since improved several parts of the system, such as having AI suggest other videos to queue based on the last few tracks I…Thu, 05 Feb 2026 00:00:00 +0000https://patrickdesjardins.com/blog/youtube-streaming-radio-with-auto-ai-summary-with-more-aihttps://patrickdesjardins.com/blog/youtube-streaming-radio-with-auto-ai-summaryI go to the office every day of the week. I , and my commute is only 15–20 minutes, perfect for listening to an audiobook you can find on YouTube. Many of the videos I like are roughly that length. However, streaming a YouTube video from my phone has a few inconveniences. The first issue is that I…Fri, 30 Jan 2026 00:00:00 +0000https://patrickdesjardins.com/blog/youtube-streaming-radio-with-auto-ai-summaryhttps://patrickdesjardins.com/blog/audiobook-machine-version-2-with-esp-32Several years ago, I built an audiobook machine using a Raspberry Pi and RFID cards (see the about the project). My daughter has been using it almost every night. I recorded more than 50 different stories, and it quickly became a hit. However, the machine was clunky. It had a few issues with wires…Thu, 22 Jan 2026 00:00:00 +0000https://patrickdesjardins.com/blog/audiobook-machine-version-2-with-esp-32https://patrickdesjardins.com/blog/trilium-rag-ai-promptI recently . I like Trilium a lot for its simplicity and because it is easy to move to another system later. At the same time, it remains flexible without becoming complex. Trilium has a BETA feature that allows you to provide a ChatGPT API key to perform AI prompting. Unfortunately, it never worked…Mon, 19 Jan 2026 00:00:00 +0000https://patrickdesjardins.com/blog/trilium-rag-ai-prompthttps://patrickdesjardins.com/blog/recapitulation-2025I realized that I skipped the recapitulation of 2024 and 2023. The last one was . Another year with a lower amount of writing with 22 blog posts. 2024 had 18 and 2023 exactly 25. Far from the average of one per 1.5 per week in the first 7 years. Nonetheless, I continue enjoying the time I spend on t…Sun, 28 Dec 2025 00:00:00 +0000https://patrickdesjardins.com/blog/recapitulation-2025https://patrickdesjardins.com/blog/trilium-note-taking-with-mini-pc-server-hostI have been using Microsoft OneNote since I joined Microsoft as a software engineer in 2014. I am paying Microsoft for storage as my notes increased largely when I did my Master's degree. I was uploading PDFs, annotating with a pen and taking note with a pen as well. However, I am slowly taking only…Fri, 12 Dec 2025 00:00:00 +0000https://patrickdesjardins.com/blog/trilium-note-taking-with-mini-pc-server-hosthttps://patrickdesjardins.com/blog/python-retirement-simulator-sp-500I have recently read more about Monte Carlo simulation and the . I opted for Python and a framework called to try different hyperparameters. I never used Optuna, but I recall from my machine learning master's degree that it is ideal to optimize toward a maximum value, which in my case would be the…Thu, 06 Nov 2025 00:00:00 +0000https://patrickdesjardins.com/blog/python-retirement-simulator-sp-500https://patrickdesjardins.com/blog/software-engineering-and-remote-workI will skim some of the context, but in recent years, I have been in many different companies and teams with different operational models, including remote, hybrid, and in-office. In one of my experiences, the team was entirely on-site and then moved to a hybrid model. In this short article, I'll de…Wed, 29 Oct 2025 00:00:00 +0000https://patrickdesjardins.com/blog/software-engineering-and-remote-workhttps://patrickdesjardins.com/blog/typescript-decorator-injection-valueTypeScript is a great language for writing code that is type-safe and easy to read. However, sometimes you need to inject a value into a class or function. This can be done using a decorator. In this article, we will see how we can inject from a single source of truth values into a class. We will al…Tue, 21 Oct 2025 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-decorator-injection-valuehttps://patrickdesjardins.com/blog/sse-streaming-using-http-post known as SSE uses by default HTTP GET with the EventSource JavaScript object. However, when handling a large volume of data, HTTP GET using a query string falls short. Relying on HTTP Post and a large body is better. In this article, I'll show how to use SSE with HTTP POST when connecting to an API…Mon, 13 Oct 2025 00:00:00 +0000https://patrickdesjardins.com/blog/sse-streaming-using-http-posthttps://patrickdesjardins.com/blog/python-coroutine-futureMost of my day, I use TypeScript and JavaScript. The concept of asynchronous programming is relatively straightforward, involving async functions that must be awaited. To set everything in perspective for a TypeScript developer, here is a simple code: function mySyncFunction(): string { return "Test…Thu, 04 Sep 2025 00:00:00 +0000https://patrickdesjardins.com/blog/python-coroutine-futurehttps://patrickdesjardins.com/blog/python-asynchronous-to_threadUp to recently, I was using an older style to invoke a synchronous function in Python that required using a worker pool. However, there is a more elegant way, more concise and straightforward possibility using Python 3.9+. The new function is part of async.io and is named to_thread. Before Python ve…Thu, 28 Aug 2025 00:00:00 +0000https://patrickdesjardins.com/blog/python-asynchronous-to_threadhttps://patrickdesjardins.com/blog/python-moduloI was writing code in Python that required a modulo. The code worked until the number was negative. -321 % 10 Applying a modulo 10 to a number is an easy way to get the last digit. 321 modulo 10 is 1. I was expecting -321 modulo 10 to be 1. That is the case in JavaScript, not in Python. In Python, -…Tue, 26 Aug 2025 00:00:00 +0000https://patrickdesjardins.com/blog/python-modulohttps://patrickdesjardins.com/blog/3dprinting-race-lap-counterMy son received a Carrera race track for his birthday. He loves it! I recently started learning CAD and 3D printing and quickly built a simple dual-flap system that flips when the car crosses the finish line. It was simple, cost less than 1$ to print. However, looking at the design, I could see some…Tue, 19 Aug 2025 00:00:00 +0000https://patrickdesjardins.com/blog/3dprinting-race-lap-counterhttps://patrickdesjardins.com/blog/python-asynchronous-queueThe library asyncio offers a queue. A producer injects data into the queue. A consumer reads data from the queue. The queue is first-in, first-out (FIFO) and is useful when there is incoming data that is difficult to synchronize with the output process. For example, a system might receive data and s…Fri, 15 Aug 2025 00:00:00 +0000https://patrickdesjardins.com/blog/python-asynchronous-queuehttps://patrickdesjardins.com/blog/python-asynchronous-codePython offers various methods for handling code that executes in a non-sequential manner. Python can use asynchronous programming, threading (threading module), and multiprocessing (multiprocessing module) to achieve concurrency. In this article, we will focus on the library called asyncio, which is…Wed, 13 Aug 2025 00:00:00 +0000https://patrickdesjardins.com/blog/python-asynchronous-codehttps://patrickdesjardins.com/blog/electronic-water-bottle-3d-printedWhen I was young, I had a dot-matrix printer, followed by an inkjet, a color inkjet, and, for over 15 years, a laser printer. A month ago, I bought my first 3d printer. I am late to the party, as they became more available a few years ago, but I never found the appeal, as many people seem to print t…Fri, 18 Jul 2025 00:00:00 +0000https://patrickdesjardins.com/blog/electronic-water-bottle-3d-printedhttps://patrickdesjardins.com/blog/discord-bot-that-uses-LLM-to-access-user-statisticsI own a Discord server where I have over 140 members. I have a bot that perform several automation like role assignation, finding games for the users, provide daily statistics, and more. The latest feature gives the user the ability to ask questions about their statistics using a large language mode…Tue, 15 Jul 2025 00:00:00 +0000https://patrickdesjardins.com/blog/discord-bot-that-uses-LLM-to-access-user-statisticshttps://patrickdesjardins.com/blog/adding-embedded-vector-search-next-js-ssg-blogThe last time I had a search on my blog was when it was hosted using WordPress. Using Next JS static site generation (SSG) for my blog and hosting it on GitHub Pages, I needed a way to implement search functionality without relying on a backend. I implemented a vector search using Python that genera…Sun, 01 Jun 2025 00:00:00 +0000https://patrickdesjardins.com/blog/adding-embedded-vector-search-next-js-ssg-bloghttps://patrickdesjardins.com/blog/my-basic-go-stock-game-first-iterationLast month, I started learning the programming language Go (golang). Anytime I am learning, I always do two things: write about it and start projects. Writing helps me write my thoughts, what I've learned, but also it always opens my mind to other ideas and questions to further my comprehension. Doi…Tue, 22 Apr 2025 00:00:00 +0000https://patrickdesjardins.com/blog/my-basic-go-stock-game-first-iterationhttps://patrickdesjardins.com/blog/unit-testing-go-functionsI have developed in many ways throughout the years from a very strict object-oriented approach with Java and C# to a more functional approach using JavaScript, TypeScript, and Python. In the first project, I started using Go, and I was in the mindset of creating a function that takes an object as a…Mon, 07 Apr 2025 00:00:00 +0000https://patrickdesjardins.com/blog/unit-testing-go-functionshttps://patrickdesjardins.com/blog/starting-to-learn-goStepping back from this single blog post, we can see a huge shift in programming languages. I started blogging in 2011, and my focus was mainly on web development using C# (.Net framework) and JavaScript. My programming language interest was tightly coupled to my day-to-day programming language. Whi…Tue, 25 Mar 2025 00:00:00 +0000https://patrickdesjardins.com/blog/starting-to-learn-gohttps://patrickdesjardins.com/blog/python-unit-testI wrote about 200 automated (unit and integration) tests in the last few months in my , and I am delighted by the experience. The best is the extremely low friction to mock using pytest and unit test.mock. Mocking a function is as simple as using @patch.object and the module (file) that contains the…Wed, 05 Mar 2025 00:00:00 +0000https://patrickdesjardins.com/blog/python-unit-testhttps://patrickdesjardins.com/blog/my-thoughts-on-python-2025My first hand with Python was between 2018 and 2021 when I studied machine learning master's degree. Last year, I started building a Discord Bot which increased in size in the last few months. Here are my thoughts. Python introduced types in 2015 in Python 3.5. During my assignments I never used the…Fri, 31 Jan 2025 00:00:00 +0000https://patrickdesjardins.com/blog/my-thoughts-on-python-2025https://patrickdesjardins.com/blog/the-curse-of-overloaded-peopleIn this short essay, I'll explain why people who overload their time are not only inefficient but a detriment to a team. I will tackle the topic using the perspective of a software engineer, a project/product manager, and an engineering manager. Before splitting into three different personas, the ma…Fri, 24 Jan 2025 00:00:00 +0000https://patrickdesjardins.com/blog/the-curse-of-overloaded-peoplehttps://patrickdesjardins.com/blog/10-points-to-increase-software-qualityIn my career, I have noticed a few details that significantly increase the quality of a software product. Here is a summary followed by a more detailed explanation: 1) Use the system that is being developed 2) The financial incentive must not be aligned to the KPI 3) Freedom to add features, improve…Tue, 14 Jan 2025 00:00:00 +0000https://patrickdesjardins.com/blog/10-points-to-increase-software-qualityhttps://patrickdesjardins.com/blog/the-evolution-gaming-discord-bot-using-pythonI have been coding a Discord bot for about 6 months now in Python (see this introduction ). I have learned a lot about the Discord API, Python, and how to manage a bot. I wanted to share my experience with you. This post will cover few features with a glimpse of the code. The bot's initial goal was…Thu, 02 Jan 2025 00:00:00 +0000https://patrickdesjardins.com/blog/the-evolution-gaming-discord-bot-using-pythonhttps://patrickdesjardins.com/blog/how-long-does-it-take-to-write-a-system-design-bookI landed a new job in November 2023 and I had two weeks before starting. I had a lot of notes from my interviews and I wanted to reorganize them. I decided to write a system design book to collect everything in an easy way to consume the information for the next time I need to interview. Drafting th…Mon, 11 Nov 2024 00:00:00 +0000https://patrickdesjardins.com/blog/how-long-does-it-take-to-write-a-system-design-bookhttps://patrickdesjardins.com/blog/why-i-wrote-a-system-design-bookIn 2023, I was in a period of interviews for a new job. The process splits the interview in three topics: algorithms, system design and behavioral. The system design was interesting as it has a large scope of potential questions. Most of the questions are about design that most engineer never had to…Thu, 07 Nov 2024 00:00:00 +0000https://patrickdesjardins.com/blog/why-i-wrote-a-system-design-bookhttps://patrickdesjardins.com/blog/python-discord-bot-introductionI have been playing video games sporadically for a few months and have a small group of people with whom I enjoy playing. However, we needed help finding a way to communicate in advance who would be online after work to play. After a quick search in Discord's marketplace, I couldn't find a simple wa…Sat, 26 Oct 2024 00:00:00 +0000https://patrickdesjardins.com/blog/python-discord-bot-introductionhttps://patrickdesjardins.com/blog/hosting-a-discord-bot-on-raspberry-piI recently worked on a Discord bot that allows the user of the guild (Discord server) to react to an emoji for a specific time of the day. The bot posts a single message daily and lets people vote when they will be active. Once the code was written, I was looking for a place to host the script. I ch…Sat, 21 Sep 2024 00:00:00 +0000https://patrickdesjardins.com/blog/hosting-a-discord-bot-on-raspberry-pihttps://patrickdesjardins.com/blog/git-notification-macos-pull-requestDepending on your situation, you may be limited in receiving notifications when it is time for you to review a pull request. Depending on your seniority and role, you may quickly provide code feedback to keep the pull request flowing into the development branch. Thus, having a notification on your s…Fri, 06 Sep 2024 00:00:00 +0000https://patrickdesjardins.com/blog/git-notification-macos-pull-requesthttps://patrickdesjardins.com/blog/next-js-api-pipe-and-filter-patternEvery endpoint of an API service has different steps, such as receiving the request and sending a response. Every step can fail, requiring stopping the flow of operation and sending an HTTP response with an error code, message, and other information. Without an established pattern, the code becomes…Thu, 25 Jul 2024 00:00:00 +0000https://patrickdesjardins.com/blog/next-js-api-pipe-and-filter-patternhttps://patrickdesjardins.com/blog/typescript-noinfer-utility-typeThe latest TypeScript version, 5.4, brings a new utility type. The type NoInfer is a utility type that helps to prevent the inference of a type variable in a generic function. This utility type is proper when using generic types in a function, but TypeScript doesn't want to infer the type. The NoInf…Thu, 09 May 2024 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-noinfer-utility-typehttps://patrickdesjardins.com/blog/git-hook-nextjs-project-typescript-lintGit Hooks are scripts that run automatically before or after a Git command. They help enforce coding standards, run tests, and perform other tasks. In this article, we will create a pre-commit Git Hook in a NextJS project using TypeScript and Lint. The first step is to install Husky and Lint-Staged.…Wed, 24 Apr 2024 00:00:00 +0000https://patrickdesjardins.com/blog/git-hook-nextjs-project-typescript-linthttps://patrickdesjardins.com/blog/nextjs14-authentication-and-middlewareMiddleware has changed since NextJS 13. A single middleware file exists at the root, restricting access to the request and response objects. Enforcing authentication for web and API routes fits well in the middleware as they are a required path for each request. The advantage is that authentication…Sun, 14 Apr 2024 00:00:00 +0000https://patrickdesjardins.com/blog/nextjs14-authentication-and-middlewarehttps://patrickdesjardins.com/blog/adding-console-and-network-logs-in-playwrightI will show you how to add console and network logs in Playwright. Logs are helpful when you have tests working locally but not on a CI/CD pipeline. You can use these logs to debug and understand what's happening. The first step is to add the logs to the test. You can use the page.on('console') and…Mon, 01 Apr 2024 00:00:00 +0000https://patrickdesjardins.com/blog/adding-console-and-network-logs-in-playwrighthttps://patrickdesjardins.com/blog/how-to-silence-bash-commandsThere are ways to redirect the outputs of a terminal's command if the output is not desirable. Before getting into the _how_, let's describe the concept of "File Descriptor" or fd. Using a terminal, you have three fd. The first one is the input. The terminal refers to the input file descriptor as fd…Thu, 21 Mar 2024 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-silence-bash-commandshttps://patrickdesjardins.com/blog/how-to-debug-a-kubernetes-podYour code is working locally and then you push into your testing environment, or worse your production environment and it does not. How can you debug the code running into your Kubernetes pod? Two ways to get insight are: reading the console log from the pod or to get access using a terminal to the…Wed, 13 Mar 2024 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-debug-a-kubernetes-podhttps://patrickdesjardins.com/blog/typescript-and-jest-to-mock-a-module-functionThe use case is this one: you have a function that live directly into a TypeScript (.ts) file. The function returns an array using a service. The service does an HTTP request and use crypto hashing function from an old library not compatible with Jest. In any case, you do not want to perform the HTT…Fri, 08 Mar 2024 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-and-jest-to-mock-a-module-functionhttps://patrickdesjardins.com/blog/coding-a-blog-with-nextjs-ssg-and-mdxI recently posted that I migrated from Gatsby to NextJS. I am sharing how I built my blog with NextJS, SSG, and MDX. NextJS is currently one of the most popular React frameworks for building server-side logic. NextJS allows some operations to run not on the client side but on the server side. Static…Wed, 21 Feb 2024 00:00:00 +0000https://patrickdesjardins.com/blog/coding-a-blog-with-nextjs-ssg-and-mdxhttps://patrickdesjardins.com/blog/migrating-static-blog-gatsby-to-nextjsIn 2021, I migrated my WordPress Blog to Gatsby (see ). The main goal was to reduce the hosting cost and have a faster website. Within two years, I started to feel the pain of Gatsby. The core problem was twofold: It was impossible to migrate from Gatsby v3 to v4 and v5, and slow build time. The mig…Wed, 14 Feb 2024 00:00:00 +0000https://patrickdesjardins.com/blog/migrating-static-blog-gatsby-to-nextjshttps://patrickdesjardins.com/blog/git-to-steelseries-keyboardThe has a small OLED screen. Steelseries offers an application called where you can configure LED and OLED. The application is a marketplace with several game and application integrations. The most interesting is the . The SDK contains an HTTP JSON API. The API, using JSON messages, allows you to…Wed, 07 Feb 2024 00:00:00 +0000https://patrickdesjardins.com/blog/git-to-steelseries-keyboardhttps://patrickdesjardins.com/blog/git-autostashKeeping your branch up-to-date with the main branch or the feature branch is a necessity. Waiting too long and you may have more conflicts to resolve. The normal command is invoking git pull. However, if you have uncommitted changes, you will need to stash them first or create a commit before receiv…Tue, 30 Jan 2024 00:00:00 +0000https://patrickdesjardins.com/blog/git-autostashhttps://patrickdesjardins.com/blog/typescript-react-reasons-not-to-desctruct-propsI have been using React with TypeScript for over seven years. With the transition toward the function component, I see a widely used pattern in JavaScript React emerging into TypeScript React but without a solid gain for the developer experience. I am talking about the use of property destruction in…Fri, 26 Jan 2024 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-react-reasons-not-to-desctruct-propshttps://patrickdesjardins.com/blog/implementing-the-map-and-reduce-javascript-function-in-typescriptJavaScript is a language with several built-in functions. In this article, we will implement some of them in TypeScript. The goal is to understand how they work and to have a better understanding of the language. The map function loops each element of an array. The function takes a callback function…Fri, 08 Dec 2023 00:00:00 +0000https://patrickdesjardins.com/blog/implementing-the-map-and-reduce-javascript-function-in-typescripthttps://patrickdesjardins.com/blog/learning-lsof-awk-by-killing-a-processDeveloping web applications and services requires opening ports on a machine. In some situations, a process using a port might die without releasing the port -- the process is dead but runs in the background, keeping the port reserved. Thus, the solution is to kill the process. Sometimes, some ports…Tue, 19 Sep 2023 00:00:00 +0000https://patrickdesjardins.com/blog/learning-lsof-awk-by-killing-a-processhttps://patrickdesjardins.com/blog/typescript-consuming-producing-redpanda-messageRedpanda is a C++ implementation of Kafka that is very performance and easy to install because it does not require Java or Apache Zookeeper. Redpanda, like Kafka, is a pub/sub system allowing messages to travel from a producer to one or many consumers. The goal is to start an instance of Redpanda, c…Mon, 11 Sep 2023 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-consuming-producing-redpanda-messagehttps://patrickdesjardins.com/blog/how-to-build-nodejs-with-opensslOnce in a while, your work environment could be more optimal for what you try to achieve. The current situation was that I had to use a MacOS with LibreSSL under a supervised man-in-the-middle security loop that mangled the SSL certificates. The network had changed, and using Microsoft Identity Clie…Tue, 15 Aug 2023 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-build-nodejs-with-opensslhttps://patrickdesjardins.com/blog/how-to-transfer-files-between-computers-using-HDMI-Part-7-paginationTransferring data using the HDMI cable and the capture card continues to demonstrate how easily corruption can cause the file to be unusable. Let's review a few points that demonstrate that we have some inconsistancy around frames. ffmpeg -f dshow -list_options true -i video="USB Video" Shows vcodec…Sat, 08 Jul 2023 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-transfer-files-between-computers-using-HDMI-Part-7-paginationhttps://patrickdesjardins.com/blog/how-to-transfer-files-between-computers-using-HDMI-Part-6-instruction-black-whiteLast time, we determined that the original idea of relying on a insignificant character to fill the frame is not great. It causes non-text content to break as soon as the selected character can be found in the middle of the content. The solution is to reserve space at the beginning of the first fram…Wed, 14 Jun 2023 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-transfer-files-between-computers-using-HDMI-Part-6-instruction-black-whitehttps://patrickdesjardins.com/blog/how-to-transfer-files-between-computers-using-HDMI-Part-5-instruction-headerThis fifth article is about how to transfer a file using only video from one computer to another. Using a capture card and a HDMI output, we can play a video containing a file's content and read the video on the other end. Once the video is received, we can extract the content and have the file. At…Sun, 04 Jun 2023 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-transfer-files-between-computers-using-HDMI-Part-5-instruction-headerhttps://patrickdesjardins.com/blog/how-to-transfer-files-between-computers-using-HDMI-Part-4-hdmi-failureReading the video without going by the video card and the HDMI cable was a success. However, when it was the time to send the video in these additional steps, the video received was corrupted. The failure was subtle as the footage could play and had the red frame and some colors on the top. However,…Fri, 26 May 2023 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-transfer-files-between-computers-using-HDMI-Part-4-hdmi-failurehttps://patrickdesjardins.com/blog/how-to-transfer-files-between-computers-using-HDMI-Part-3-reading-videoIn this third part, we assume the Rust code has generated the video and the source computer, containing the file to transfer, is playing the video in loops into the HDMI display. The HDMI display is the one connected to the HDMI capture card and thus is on the second computer (target) is a web camer…Tue, 23 May 2023 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-transfer-files-between-computers-using-HDMI-Part-3-reading-videohttps://patrickdesjardins.com/blog/how-to-transfer-files-between-computers-using-HDMI-Part-2-prototype-code-videoThe second part of transferring a file via video using HDMI will focus on the file-to-video and video-to-file code portions. The following blog article will explain flaws when communicating via HDMI. Even with the appearance of flaws, the prototype in this article works: a video file will contain th…Tue, 16 May 2023 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-transfer-files-between-computers-using-HDMI-Part-2-prototype-code-videohttps://patrickdesjardins.com/blog/how-to-transfer-files-between-computers-using-HDMI-Part-1-PlanIn this series of blog posts, I will discuss transferring files using an HDMI port to a USB port of another computer. The goal of transferring a file using HDMI is to share a file without using the computer USB or Internet, or Ethernet between two machines. The blog posts are written as the solution…Fri, 12 May 2023 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-transfer-files-between-computers-using-HDMI-Part-1-Planhttps://patrickdesjardins.com/blog/how-to-create-a-dispatch-function-strongly-typed-payloadYou want to send an action from a list of specific possible actions. The action (called in this article trigger) must be accompanied of data that need to be strongly typed. Thus, each trigger must have a unique name and a payload with a type determined when the developer writes down the list of poss…Wed, 12 Apr 2023 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-create-a-dispatch-function-strongly-typed-payloadhttps://patrickdesjardins.com/blog/typescript-iterators-generator-functions-an-infinite-stream-of-dataWe discussed about in a recent blog article. Today, we introduce generator functions that are a step further into iterable behavior in TypeScript. Similar to a normal TypeScript function, a generator returns a value. However, a generator can return many values. A generator function is a function th…Fri, 07 Apr 2023 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-iterators-generator-functions-an-infinite-stream-of-datahttps://patrickdesjardins.com/blog/understand-typeScript-iterator-and-iterableTypeScript follows ECMAScript (JavaScript) specification, and the concept of iteration grew up in the language in the past few years. Thus, TypeScript support since many versions of the idea of iterator and iterable. I only had a use case to rely on them outside looping collection recently, where I…Fri, 24 Mar 2023 00:00:00 +0000https://patrickdesjardins.com/blog/understand-typeScript-iterator-and-iterablehttps://patrickdesjardins.com/blog/how-to-use-typeScript-satisfies-operator-keywordMy first reaction when satisfies operator launched with TypeScript 4.9 was that it was one more complex to understand in the language. I continued my way without spending much of my time understand the goal until one day I stumble into a scenario that was problematic for many years. TypeScript shoul…Fri, 17 Mar 2023 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-use-typeScript-satisfies-operator-keywordhttps://patrickdesjardins.com/blog/how-to-set-nodejs-apollo-graphql-subscription-contextUsing entails relying on the . There is some documentation surrounding handling context in both libraries, but a minor detail escapes both sides: where to set the context. Before digging into the specifics of the implementation, let's quickly talk about the context. Context is a mechanism to share…Thu, 09 Mar 2023 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-set-nodejs-apollo-graphql-subscription-contexthttps://patrickdesjardins.com/blog/migration-from-create-react-app-cra-to-vitejsCreate React App (CRA) has been around since 2016 and has been a delight since its origin. CRA allows starting coding fast by avoiding the recurrent problem with a project to configure its tools. The web development ecosystem surrounding JavaScript has been 2010 changing a lot with tools that requir…Thu, 02 Mar 2023 00:00:00 +0000https://patrickdesjardins.com/blog/migration-from-create-react-app-cra-to-vitejshttps://patrickdesjardins.com/blog/recruit-someone-in-90-minutesAfter many years and many different software companies, I concluded that spending a total of 90 minutes with one candidate gives the same result as the current trend of spending over 6 to 8h. Therefore, the current time format could be more effective, and the interview content needs to be geared tow…Fri, 24 Feb 2023 00:00:00 +0000https://patrickdesjardins.com/blog/recruit-someone-in-90-minuteshttps://patrickdesjardins.com/blog/migrating-typescript-library-to-rustI recently migrated a couple of Rust libraries from TypeScript using a subset of features of well-known TypeScript libraries. So far, I have the following Rust repositories: - : Hide message into an image - : Perform hilbert calculation - : Format the number of byte in a human readable format - : Fo…Thu, 16 Feb 2023 00:00:00 +0000https://patrickdesjardins.com/blog/migrating-typescript-library-to-rusthttps://patrickdesjardins.com/blog/how-to-have-many-graphql-servers-with-apollo-clientApollo client and React are two popular libraries and an excellent combination for fetching GraphQL data from a server into a web application. The well-documented approach is to use the Apollo Client and then the Apollo React Context. const client = new ApolloClient({ uri: "//yourgraphqlserver_1/gra…Thu, 09 Feb 2023 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-have-many-graphql-servers-with-apollo-clienthttps://patrickdesjardins.com/blog/react-apollo-client-local-state-default-valueThe best approach is to rely on the local state if you need to add additional value to an existing GraphQL entity from your GraphQL server. Apollo has several patterns, and in this article, I am showing how to use the local state using the InMemoryCache and the writeFragment method. The main reason…Thu, 02 Feb 2023 00:00:00 +0000https://patrickdesjardins.com/blog/react-apollo-client-local-state-default-valuehttps://patrickdesjardins.com/blog/react-client-side-state-management-zustandIn a I explained that the React Context is re-rendering a lot if you change the state inside the context. I concluded that using a state management, like Redux, might still be relevant. However, Redux comes with its baggage of middleware, connection, hooks, actions, etc. So, here enters a more stra…Fri, 27 Jan 2023 00:00:00 +0000https://patrickdesjardins.com/blog/react-client-side-state-management-zustandhttps://patrickdesjardins.com/blog/react-context-how-to-avoid-renderingIn this article, we will see how to optimize the usage of a context to avoid rendering components along the path of the context. We already explored . This time, we will focus on children that are not functions. The small project is an application with three layers. The top layer, named Layer1 is wr…Fri, 20 Jan 2023 00:00:00 +0000https://patrickdesjardins.com/blog/react-context-how-to-avoid-renderinghttps://patrickdesjardins.com/blog/how-to-pause-apollo-graphql-subscriptionUsing is my first instinct when consuming a GraphQL on the front end. It works flawlessly by producing strongly typed TypeScript code to perform your custom GraphQL queries. There is a plugin to generate the operation called typescript-operation. In the past, I decided to avoid but recently been a…Thu, 12 Jan 2023 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-pause-apollo-graphql-subscriptionhttps://patrickdesjardins.com/blog/what-is-steganography-how-to-hide-text-in-imageThe word steganography means to hide something, like a text into something else, like an image. The definition is very high level. Hence, it has a variety of ways to accomplish the goal of steganography. I'll show you how to use the least significant bits in this article. Wikipedia a as short mentio…Mon, 02 Jan 2023 00:00:00 +0000https://patrickdesjardins.com/blog/what-is-steganography-how-to-hide-text-in-imagehttps://patrickdesjardins.com/blog/keys-success-remote-work-hybrid-environmentAfter working in 100% office, 100% remote, and in a hybrid situation, I gathered 11 elements for having a thriving hybrid work environment. Note that I am writing this article in a hybrid position but as an individual, like working in-person, fully remote, and hybrid. At the root of a successful hyb…Wed, 28 Dec 2022 00:00:00 +0000https://patrickdesjardins.com/blog/keys-success-remote-work-hybrid-environmenthttps://patrickdesjardins.com/blog/recapitulation-2022Last year I started my recapitulation with the impression that it was not a year in which I accomplished much compared to all the previous years. 2022 was similar in the sense of feeling but taking the time to write about my years showed me wrong. 2021 was low in blog posts with . 2022 was way more…Wed, 28 Dec 2022 00:00:00 +0000https://patrickdesjardins.com/blog/recapitulation-2022https://patrickdesjardins.com/blog/typescript-sharing-code-with-git-submodulesImagine you have two TypeScript projects that have a similarity. You can avoid duplication and share some code. A viable solution to share is to extract the code into a reusable NPM library and use the NPM library in both projects. However, it has some overhead and might not fit your current process…Thu, 15 Dec 2022 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-sharing-code-with-git-submoduleshttps://patrickdesjardins.com/blog/rust-how-to-use-mpsc-unbounded-to-share-data-between-rust-threadsMoving information between threads is always a delicate task. This is because so many issues can occur, and Rust is built around safety; hence it has a safe way to send information between two threads. One way is to rely on the futures crate and use a unbounded. The documentation is fuzzy around how…Sat, 26 Nov 2022 00:00:00 +0000https://patrickdesjardins.com/blog/rust-how-to-use-mpsc-unbounded-to-share-data-between-rust-threadshttps://patrickdesjardins.com/blog/rust-how-to-debug-cli-Before debugging using Visual Studio Code (VSCode), you need to have VsCode and . VsCode's debug configuration file is under .vscode/launch.json. You need two entries: one for your executable (command line) to test the _cli_ and one for the unit tests. { "version": "0.2.0", "configurations": [ { "ty…Mon, 21 Nov 2022 00:00:00 +0000https://patrickdesjardins.com/blog/rust-how-to-debug-cli-https://patrickdesjardins.com/blog/react-children-function-renderIf you have a hierarchy of components, you may have one or more components that wrap HTML elements around something else. For example, you can have a Layout component that wraps a child component. The child can be anything from now to the future- it does not matter. React uses the term to inject an…Wed, 16 Nov 2022 00:00:00 +0000https://patrickdesjardins.com/blog/react-children-function-renderhttps://patrickdesjardins.com/blog/rust-struct-memory-functionI recently learned about the tool called clippy that is available if you use cargo. It provides lint information on your Rust code to ensure you are using good practices but also helps to use Rust idiomatic and consistent code. For example, one recommendation was to not use .clone() on one of my str…Fri, 04 Nov 2022 00:00:00 +0000https://patrickdesjardins.com/blog/rust-struct-memory-functionhttps://patrickdesjardins.com/blog/rust-hilbert-curve-implementationI developed a to compute the a few months ago. The library transforms from a point to a coordinate (1d to 2d) and the other way around. In addition, I am slowly getting familiar with ), a language developed to be as fast as C++ with type safety in the last few days. One way to learn is to develop…Tue, 01 Nov 2022 00:00:00 +0000https://patrickdesjardins.com/blog/rust-hilbert-curve-implementationhttps://patrickdesjardins.com/blog/react-css-variable-component-css-filesIf you want to define at a single place values to use inside your React components and inside CSS files, you need a central location. I enjoy keeping colors and styles all in CSS files (or CSS modules). Settling into a solution of defining all values in CSS as the source of truth is technically poss…Thu, 27 Oct 2022 00:00:00 +0000https://patrickdesjardins.com/blog/react-css-variable-component-css-fileshttps://patrickdesjardins.com/blog/framermotion-keyframe-animationIn this article, we will fade in a tiny box into the viewport by using animated steps. The animation uses , which is a React library that helps perform animation using CSS transitions. This article focus on using animation with steps, also known as key frames. The keyframes change the position and t…Thu, 20 Oct 2022 00:00:00 +0000https://patrickdesjardins.com/blog/framermotion-keyframe-animationhttps://patrickdesjardins.com/blog/framermotion-animate-children-unmountImagine the situation where you have one parent and a direct child component. The child component has a list of elements. These elements are animated as the parent component is mounted. The parent renders the child that renders the list of elements, and each element is animated in a staggered fashio…Mon, 10 Oct 2022 00:00:00 +0000https://patrickdesjardins.com/blog/framermotion-animate-children-unmounthttps://patrickdesjardins.com/blog/framermotion-div-position-transitionIn this article, we will see how to have an HTML div at a specific boundary (x, y, width and height) and moving it to a second boundary to actually load another component. Visually the transparent to the user we will mount/unmount behind the curtain! Confusing! In other words, we have two React comp…Tue, 04 Oct 2022 00:00:00 +0000https://patrickdesjardins.com/blog/framermotion-div-position-transitionhttps://patrickdesjardins.com/blog/azure-kubernetes-httpsThe article's goal is to expose enhance your Kubernetes Ingress allowing HTTPS (certificate SSL/TLS). Next step, the ingress certificate manager: REGISTRY_NAME=realtimepixel CERT_MANAGER_REGISTRY=quay.io CERT_MANAGER_TAG=v1.8.0 CERT_MANAGER_IMAGE_CONTROLLER=jetstack/cert-manager-controller CERT_MAN…Sat, 01 Oct 2022 00:00:00 +0000https://patrickdesjardins.com/blog/azure-kubernetes-httpshttps://patrickdesjardins.com/blog/create-react-app-framer-typescript is a library that animates React components. The library allows many interactions, from moving HTML elements to moving SVG paths. What is particularly interesting with Framer is the capability to animate when a React component is mounted and unmounted, making the HTML fade in and out or move more a…Wed, 21 Sep 2022 00:00:00 +0000https://patrickdesjardins.com/blog/create-react-app-framer-typescripthttps://patrickdesjardins.com/blog/azure-kubernetes-pod-debug-crashI had a pod that worked well on my machine but was not once deployed on Azure Kubernetes. It was constantly rebooting with the status CrashLoopBackOff. It was impossible to use kubectl exec -it on the ill pod: it was always closing and restarting. However, there is a trick that is not perfect but mi…Wed, 07 Sep 2022 00:00:00 +0000https://patrickdesjardins.com/blog/azure-kubernetes-pod-debug-crashhttps://patrickdesjardins.com/blog/azure-kubernetes-public-accessThe article's goal is to expose your web application on the Internet. We already our three Docker images. However, while having the deployment and service up and running, the load-balancer was still not accessible when performing an HTTP request. Between the article where I and now, I decided to p…Wed, 07 Sep 2022 00:00:00 +0000https://patrickdesjardins.com/blog/azure-kubernetes-public-accesshttps://patrickdesjardins.com/blog/typescript-utility-type-partial-expectThe situation is that you want to transform an existing type into all optional fields except a subset of the fields to be required. A use case is that you wish to have all fields except the primary key and many other keys you know must always be present. We need to create a custom TypeScript utility…Mon, 05 Sep 2022 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-utility-type-partial-expecthttps://patrickdesjardins.com/blog/docker-image-reverse-proxy-nodeThe title is a little longer to hold all the proper keywords, but we will discuss how you can have your web application perform HTTP requests to your frontend instead of directly accessing your backend API. The reason can be multiple, sometimes is a question of permission. The backend is only availa…Tue, 23 Aug 2022 00:00:00 +0000https://patrickdesjardins.com/blog/docker-image-reverse-proxy-nodehttps://patrickdesjardins.com/blog/docker-vitejs-hot-reloadSuppose you are using ViteJS to automate your TypeScript, JSX, and CSS, then you will need to adjust the ViteJS configuration to use the hot-reload mechanism still. Likewise, you will need to perform these steps using SolidJS instead of CRA since SolidJS relies on ViteJS. My current example works if…Tue, 09 Aug 2022 00:00:00 +0000https://patrickdesjardins.com/blog/docker-vitejs-hot-reloadhttps://patrickdesjardins.com/blog/azure-intro-kubernetesKubernetes is a convenient way to deploy an infrastructure of services in a central place. Once you have your service Docker images built and deployed you can use Kubernetes to deploy multiple instances across the cloud. In this article, we will see how Microsoft Azure can use a Kubernetes configura…Fri, 05 Aug 2022 00:00:00 +0000https://patrickdesjardins.com/blog/azure-intro-kuberneteshttps://patrickdesjardins.com/blog/azure-docker-container-repository-githubKubernetes is a convenient way to deploy an infrastructure of services in a central place. Once you have your service Docker images built and deployed you can use Kubernetes to deploy multiple instances across the cloud. In this article, we will see how Microsoft Azure can use a Kubernetes configura…Thu, 28 Jul 2022 00:00:00 +0000https://patrickdesjardins.com/blog/azure-docker-container-repository-githubhttps://patrickdesjardins.com/blog/azure-docker-container-repositoryThere are many resources about hosting an image on Microsoft Azure but most assume some expertise around Azure -- I have none. At least, I have not touched Azure for at least five years (at that time, the user interface was using the "blade" format). In this article, I'll describe how to host a Dock…Thu, 14 Jul 2022 00:00:00 +0000https://patrickdesjardins.com/blog/azure-docker-container-repositoryhttps://patrickdesjardins.com/blog/how-to-output-audio-video-windows-macosI currently work in a rigorous and secure environment. Therefore, I cannot install everything I need to have a high-quality meeting production. I mean using my XLR microphone and my few cameras by high quality. Currently, I am not an administrator of my Macbook Pro M1 machine. Hence, I cannot instal…Fri, 17 Jun 2022 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-output-audio-video-windows-macoshttps://patrickdesjardins.com/blog/graphql-map-typeThe battle between science and art in software engineering is constantly appearing. On one end, softwares are based on scientific mathematical concepts. On the other end, it lies in opinions and personal preferences. However, regardless of your situation, you must decide and move on. This article wi…Fri, 20 May 2022 00:00:00 +0000https://patrickdesjardins.com/blog/graphql-map-typehttps://patrickdesjardins.com/blog/docker-nodejs-shared-folderIn this article, I explain how to configure Docker to have two independent services in two different containers, but both of them reference a shared folder. repository |----> service1 |----> service2 |----> shared The article focus on: 1. Docker configuration 2. TypeScript configuration The challeng…Mon, 09 May 2022 00:00:00 +0000https://patrickdesjardins.com/blog/docker-nodejs-shared-folderhttps://patrickdesjardins.com/blog/typescript-nodejs-sibling-projectImagine you have two kinds of services inside your project: frontend and backend. You may want to share some interfaces or other TypeScript files. The idea is to have a sibling folder to the frontend and backend folders called shared. The idea is far from being exotic and workout naturally without d…Mon, 02 May 2022 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-nodejs-sibling-projecthttps://patrickdesjardins.com/blog/docker-nodejs-frontend-backendIn this article, I explain how to configure Docker to have two independent services (server): 1. One service hosts the static files from a SolidJS framework (same apply to React) 2. One service operates a NodeJS server that hosts a basic REST service (could be used for any backend service) The artic…Tue, 26 Apr 2022 00:00:00 +0000https://patrickdesjardins.com/blog/docker-nodejs-frontend-backendhttps://patrickdesjardins.com/blog/typescript-codegen-graphql-custom-scalarImagine you must interact with a system that provides 64 bits type, like a long in by GraphQL. The for 64 bits. Relying on number cause issue with a number above . Hence, above that size, in JavaScript you must create a wrapped type called BigInt. While this article focuses on Long to BigInt, it i…Tue, 19 Apr 2022 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-codegen-graphql-custom-scalarhttps://patrickdesjardins.com/blog/solidjs-animated-waveIn this short article, we will see how to create with SolidJS this dynamic wave effect that simulates a water wave that goes from the bottom of the screen. Of course, performing the same with React would be very similar. The goal is to create a dynamic wave over the current application. Hence, we ne…Tue, 12 Apr 2022 00:00:00 +0000https://patrickdesjardins.com/blog/solidjs-animated-wavehttps://patrickdesjardins.com/blog/gym-projectLast summer, I unsuccessfully moved a kid-inflated pool - it contained too much water. The mass volumic of the water tricked me! Forward to this past winter, I had the idea to create an exercise machine where the source of weight is water. Water has the characteristic to be almost free and also that…Thu, 07 Apr 2022 00:00:00 +0000https://patrickdesjardins.com/blog/gym-projecthttps://patrickdesjardins.com/blog/solidjs-where-is-usecallbackIf you are coming from React, you may wonder where the hook useCallback is? SolidJS does not have an equivalency because it does not need one! React relies on reference to know if something is changing or not. Similarly, SolidJS does the same thing. However, React executes the component code at ever…Sat, 02 Apr 2022 00:00:00 +0000https://patrickdesjardins.com/blog/solidjs-where-is-usecallbackhttps://patrickdesjardins.com/blog/typescript-full-optional-type-issueI recently received a message from one of my teammates asking to look at a piece of code that was compiled but wrong. After a moment, I realized that the interface (type) that was used was coming from a generated package from one of our gRPC. Because all the gRPC Protobuf type had their fields optio…Wed, 30 Mar 2022 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-full-optional-type-issuehttps://patrickdesjardins.com/blog/solidjs-context-patternI have discussed in the past two patterns that can be used with . In this article, we will see in action the _second pattern_ described in the previous article with SolidJS. The pattern is the one described in the official documentation and the one I have been using recently. Why use this pattern? -…Tue, 22 Mar 2022 00:00:00 +0000https://patrickdesjardins.com/blog/solidjs-context-patternhttps://patrickdesjardins.com/blog/solidjs-effect-reaction-initializationIn SolidJS, it is possible to listen to a specific variable. When the reference change (object) or value (primitive type), the effect is triggered. Coming from React, you might relate to the useEffect hook. In the ecosystem of SolidJS, it is called createEffect. React does not handle a use case well…Fri, 18 Mar 2022 00:00:00 +0000https://patrickdesjardins.com/blog/solidjs-effect-reaction-initializationhttps://patrickdesjardins.com/blog/gatsbyjs-mdx-video-mp4-supportI have a love and hate relationship with GatsbyJS. I like how fast it renders my blog compared to WordPress. However, a basic feature like hosting MP4 requires some particular configurations. After a couple of evenings trying, I finally found the right recipe. You need to have the ffmpeg open-source…Tue, 15 Mar 2022 00:00:00 +0000https://patrickdesjardins.com/blog/gatsbyjs-mdx-video-mp4-supporthttps://patrickdesjardins.com/blog/solidjs-cleanupI'll cover two scenarios here: 1) You want to execute code when your component is unmounted 2) You want to execute code when an effect is completed In React, unmounting code was once upon a time the job of a dedicated method of the component class componentWillUnmount. With React Hooks, the unmounti…Thu, 10 Mar 2022 00:00:00 +0000https://patrickdesjardins.com/blog/solidjs-cleanuphttps://patrickdesjardins.com/blog/solidjs-react-on-props-changeIn this article, we will show a couple of ways to react to a change of property with SolidJS. There are many types of reactions: - We can recompute another variable. For example, a value is built upon a property. - We can execute code. For example, clearing a list or a canvas. The first case is call…Mon, 07 Mar 2022 00:00:00 +0000https://patrickdesjardins.com/blog/solidjs-react-on-props-changehttps://patrickdesjardins.com/blog/solidjs-first-try-reviewAfter building a smallish component in a few hours, this blog post is a quick review of framework. Thus, it is not an in-depth review. In a nutshell, SolidJS is an alternative to React. The main selling point of the SolidJS framework is that it relies on JSX, with a very similar way to build compon…Thu, 03 Mar 2022 00:00:00 +0000https://patrickdesjardins.com/blog/solidjs-first-try-reviewhttps://patrickdesjardins.com/blog/typescript-immutable-default-valuesRegardless of the framework you are using, you will end up having some area of code that relies on default values. When the state relies on an object, there is a way to ensure that the default values are not mutated in the future. The simplest way to define a set of default values is to assign an ob…Thu, 24 Feb 2022 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-immutable-default-valueshttps://patrickdesjardins.com/blog/typescript-react-children-typesWhen you are using TypeScript and React, a good practice is to type your property. Each component is well defined and clear with what to provide. For example: interface MyOptions { name: string; } export const MyComponent = (props: MyOptions) => { // ... }; In React, a popular pattern is allowing th…Mon, 21 Feb 2022 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-react-children-typeshttps://patrickdesjardins.com/blog/typescript-compiler-option-helpersTypeScript transpiles your code into JavaScript. In the process, some common functions must be injected into the code if the target does not support the feature. For example, if you are using the spread operator and target an old version of ECMAScript that does not support it, TypeScript must shim a…Tue, 15 Feb 2022 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-compiler-option-helpershttps://patrickdesjardins.com/blog/typescript-override-keywordTypeScript added the keyword override with version 4.3. The keyword allows to mark a function in a class which marks the function to be expected to be redefined in a subclass. Before that keyword, or if you do not use it today (at version 4.5) the code still compiles. You can define the same functio…Fri, 11 Feb 2022 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-override-keywordhttps://patrickdesjardins.com/blog/typescript-ergonomic-brand-checksIn short, the term "Ergonomic Brand Checks" is linked to branding. Branding is a way to dynamically check for a type. It comes with JavaScript being schemaless. In JavaScript, you need to check for a field/property that exist on an object to ensure you are manipulating an object desired. For example…Fri, 04 Feb 2022 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-ergonomic-brand-checkshttps://patrickdesjardins.com/blog/typescript-dynamic-discriminant-with-template-stringAn improvement with TypeScript 4.5 compared to 4.4 is the ability to discriminate on a dynamically constructed type with a pattern. Template string type has been around for a few versions, but it was impossible to narrow down until 4.5. Before getting into the specific, here is an example of two int…Mon, 31 Jan 2022 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-dynamic-discriminant-with-template-stringhttps://patrickdesjardins.com/blog/typescript-awaited-typeBefore TypeScript version 4.5, there was a unexpected type conversion happening with Promise. The current code is working prior to version 4.5. async function computationLogic<T>(arg: Promise<T>): Promise<T[]> { return [await arg]; } class Observer<T> { private value: T | undefined; public construct…Wed, 26 Jan 2022 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-awaited-typehttps://patrickdesjardins.com/blog/typescript-webproject-environment-variablesMany projects require to have configurations. These configurations change depending on the environment. For example, you can have a different service DNS address and port to connect depending if you are developing locally or in a testing environment, or in production. A typical pattern is to set var…Wed, 26 Jan 2022 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-webproject-environment-variableshttps://patrickdesjardins.com/blog/typescript-static-methodsTypeScript version 4.4 gives the possibility to have a static block inside a class. The addition follows the EcmaScript standard to allow an unnamed function to be called when the static class is accessed for the first time. Like initializing a static variable in a class, the static block is called…Thu, 20 Jan 2022 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-static-methodshttps://patrickdesjardins.com/blog/typescript-index-signature-dynamic-propertiesJavaScript as a way to key-value in a dictionary/map way that is very flexible. It works by using a string for the name of the property, and then you can assign a value. TypeScript is providing type association to the value, but before 4.4 you could not. We can summarize what was possible before Typ…Fri, 14 Jan 2022 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-index-signature-dynamic-propertieshttps://patrickdesjardins.com/blog/typescript-guard-condition-improvementsTypeScript allows variables to be of several types. For example, a function's parameter can be a number or a string. Or another example can be a variable within a function can be a union of several types. function transform(arg: number | string) { let result = ""; if (typeof arg === "string") { resu…Mon, 10 Jan 2022 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-guard-condition-improvementshttps://patrickdesjardins.com/blog/the-cap-theorem-explainedThe CAP theorem consists of three characteristics that are pillars to distributed system. The premise of the CAP theorem is that you can only have two of the three characteristics enabled at the same time. But is that true? First, let's define a distributed system. A distributed system is a solution…Thu, 06 Jan 2022 00:00:00 +0000https://patrickdesjardins.com/blog/the-cap-theorem-explainedhttps://patrickdesjardins.com/blog/recaptulation-year-2021For several years, when I was looking back at what I accomplished during the year, I had the feeling that it was another year that had beaten all my previous ones. Strangely, I do not have that sensation for the first time (as I can remember). I am writing these first few lines and realizing that 20…Tue, 28 Dec 2021 00:00:00 +0000https://patrickdesjardins.com/blog/recaptulation-year-2021https://patrickdesjardins.com/blog/i-completed-my-master-degreeIn 2017, I decided to adhere to . During that year, I wrote two books, built an online course, read 22 books, had two new patents, changed team at Microsoft, moved to California, started to work at Netflix, and got admitted into Georgia Tech Master Program (OMSC) that would start the year after. For…Thu, 16 Dec 2021 00:00:00 +0000https://patrickdesjardins.com/blog/i-completed-my-master-degreehttps://patrickdesjardins.com/blog/typeScript-performance-tests-github-workflowAutomation is vital for delivering a product of consistent quality. In that domain, automated assertive unit tests are the epitome. Unit tests are a well-accepted cog in a software engineer arsenal and rarely contested. While avoiding injecting new errors in the code is critical, ensuring another no…Mon, 13 Dec 2021 00:00:00 +0000https://patrickdesjardins.com/blog/typeScript-performance-tests-github-workflowhttps://patrickdesjardins.com/blog/how-to-be-notified-of-an-action-between-react-componentsThe topic of this article follows the recent topic of . The following example is based on two sibling components. One has a textbox, and one has a button. The button triggers the action to reset the field to an initial value. Thus, the component that fires the event is **unaware** of the initial val…Mon, 08 Nov 2021 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-be-notified-of-an-action-between-react-componentshttps://patrickdesjardins.com/blog/communicating-between-sibling-react-hook-componentsCommunication between React's components is natural using the properties of each component. However, if a child wants to send information back the tree of components, some additional work is required. In this article, I'll clarify how to communicate top-down, bottom-up, and side-to-side. Let's start…Mon, 01 Nov 2021 00:00:00 +0000https://patrickdesjardins.com/blog/communicating-between-sibling-react-hook-componentshttps://patrickdesjardins.com/blog/how-to-schedule-blog-articles-with-gatsbyjsComing from writing my blog articles on WordPress, I was rapidly disappointed that I couldn't write down a blog article in advance. Indeed, I could write the article without pushing to the master branch or leverage Git by creating a branch for each article and merge when ready to publish. However, I…Tue, 05 Oct 2021 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-schedule-blog-articles-with-gatsbyjshttps://patrickdesjardins.com/blog/migrating-my-wordpress-blog-to-gatsbyWhen I renewed my VPS account for the year, I realized something: I do not have much going on anymore. In the last five years, I have been relying on the VPS because of my blog. I have been hosting since 2011 on WordPress my blog using Apache and MySql. So, one of my objectives was to transfer my…Thu, 23 Sep 2021 00:00:00 +0000https://patrickdesjardins.com/blog/migrating-my-wordpress-blog-to-gatsbyhttps://patrickdesjardins.com/blog/two-patterns-with-react-contextFor some reason, I am always copying a previous React Context before creating a new one. I recently realized that I was copying two different patterns. In this article, I'll expose the two patterns. The first pattern is succinct but requires relying on a class. First, the logic of the shared code, t…Fri, 27 Aug 2021 00:00:00 +0000https://patrickdesjardins.com/blog/two-patterns-with-react-contexthttps://patrickdesjardins.com/blog/my-recapitulation-of-2020-another-great-yearI wrote a recapitulative in and skipped in 2019. After blogging weekly since 2011, I decided to take a hiatus with my second children's upcoming. In 2020, I wrote a single post about my custom made desk -- that's it. However, today is different. Today, I will re-iterate the idea for the year 2020 b…Mon, 28 Dec 2020 00:00:00 +0000https://patrickdesjardins.com/blog/my-recapitulation-of-2020-another-great-yearhttps://patrickdesjardins.com/blog/working-from-home-deskWorking from home can be challenging for many reasons. My situation is that I have a four years old and a one-year-old child. I like working from home but not confined in a small room alone. With Covid-19, I have been working from home and my old Ikea desk was flawed. I had to barricade my surroundi…Mon, 11 May 2020 00:00:00 +0000https://patrickdesjardins.com/blog/working-from-home-deskhttps://patrickdesjardins.com/blog/book-of-2019Since few years (, I dress a list of books that I read. Last year, I recognized that a brief summary along the book titles would be beneficial for me and for the reader. I started the year with a few books/reading on machine learning. I took the class "Machine Learning" at Georgia Tech as being one…Thu, 26 Dec 2019 00:00:00 +0000https://patrickdesjardins.com/blog/book-of-2019https://patrickdesjardins.com/blog/sending-telemetry-from-graphql-under-nodejs-without-spammingI am running a GraphQL server hosted with NodeJS. Under the hood, it is an Express server with Apollo Middleware. I am collecting different information along with errors. The way it works is that I have an Elastic Search server fronted by a simple REST API facade. The endpoint on the REST accepts a…Tue, 11 Jun 2019 00:00:00 +0000https://patrickdesjardins.com/blog/sending-telemetry-from-graphql-under-nodejs-without-spamminghttps://patrickdesjardins.com/blog/georgia-tech-online-master-degree-review-after-4-semestersI joined at the end of 2017 with the idea to expand my knowledge in an area I am interested: machine learning. At the time I am writing this blog entry, I have completed four semesters with a grade of "A", and six more remain to complete the program. At the dawn of the Summer 2019 semester, I decid…Thu, 06 Jun 2019 00:00:00 +0000https://patrickdesjardins.com/blog/georgia-tech-online-master-degree-review-after-4-semestershttps://patrickdesjardins.com/blog/how-to-collect-http-request-telemetry-with-graphql-and-restdatasourceI have been working in a GraphQL solution at Netflix for few months now. I am always keen to have insight about what is going on. While I created from the ground-up the GraphQL server with NodeJS I had in mind to find a way to give me, the software engineer, some insights by providing some direct fe…Tue, 28 May 2019 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-collect-http-request-telemetry-with-graphql-and-restdatasourcehttps://patrickdesjardins.com/blog/validating-consumer-of-graphqlI will demonstrate a way to configure a continuous environment that gives insight on if a change on the GraphQL server can impact negatively a consumer. The solution assumes that both code bases are under the same organization, not under the same repository and that Jenkins is used. I like to start…Wed, 22 May 2019 00:00:00 +0000https://patrickdesjardins.com/blog/validating-consumer-of-graphqlhttps://patrickdesjardins.com/blog/a-single-graphqls-schema-for-internal-and-external-usersImagine the scenario that you have a GraphQL schema that is consumed only by engineers of your organization. However, some engineers work on external facing applications while some other works on internal applications. The difference is subtle, but some information must remain confidential. While it…Tue, 14 May 2019 00:00:00 +0000https://patrickdesjardins.com/blog/a-single-graphqls-schema-for-internal-and-external-usershttps://patrickdesjardins.com/blog/how-to-pass-value-to-usecallback-in-react-hooksUseCallback allows having the same reference for a call back function which has the benefit of only changing when something changes. This is primordial when callbacks are passed down the React component chain to avoid component to be rendered without an actual real reason causing performance issue.…Thu, 09 May 2019 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-pass-value-to-usecallback-in-react-hookshttps://patrickdesjardins.com/blog/typescript-exhaustive-check-your-reducerA few weeks ago, I wrote about how to use . The natural follow-up for many is to ensure that the set of action allowed is all served with the reducer. Not only it helps to tidy up the accepted actions by reducers when building the reducer, it also help ensuring during the lifetime of the reducer tha…Wed, 01 May 2019 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-exhaustive-check-your-reducerhttps://patrickdesjardins.com/blog/the-authorization-and-authentication-in-graphqlImplementing a service that covers many systems might be frightful in term of data exposition. While wandering the Internet for resources about GraphQL and security, we often see cases where the security is not paramount -- it is easier to ignore security. The reality is that most corporation that d…Thu, 25 Apr 2019 00:00:00 +0000https://patrickdesjardins.com/blog/the-authorization-and-authentication-in-graphqlhttps://patrickdesjardins.com/blog/how-to-consume-graphql-in-typescript-and-reactIn this article I'll cover two different approach concerning rendering information coming from a GraphQL server in React while being strongly typed. The first approach is the one I prefer because it is not intrusive. It is very similar of to do a normal REST Ajax call. It can be swapped from an exis…Wed, 17 Apr 2019 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-consume-graphql-in-typescript-and-reacthttps://patrickdesjardins.com/blog/graphql-extension-to-collect-http-and-resolvers-telemetryThe more my graph was increasing, the more resolvers I built. The more resolvers I had, the more data loaders I created, the more HTTP endpoints I had to call and so on. The complexity of the code was rising as well as the possibility to have a catastrophic amount of HTTP requests to be performed by…Tue, 09 Apr 2019 00:00:00 +0000https://patrickdesjardins.com/blog/graphql-extension-to-collect-http-and-resolvers-telemetryhttps://patrickdesjardins.com/blog/how-to-automatically-generate-typescript-for-consumer-of-your-graphqlOne strength of GraphQL is that it has types. In an ideal world, the consumer of the GraphQL would receive the payload strongly typed. The reason that it is not the case is natural. The data that is moving from the server to the client who invoked the query receives a JSON format that does not have…Tue, 02 Apr 2019 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-automatically-generate-typescript-for-consumer-of-your-graphqlhttps://patrickdesjardins.com/blog/accessing-your-local-machine-from-a-docker-containerA small entry about Docker. I am using Docker mostly in development to have one Docker per web application I am running. It gives me the advantage to have different instances of Apache running that are isolated. A few time ago, I wanted to perform an HTTP request from inside the Docker container bac…Fri, 22 Mar 2019 00:00:00 +0000https://patrickdesjardins.com/blog/accessing-your-local-machine-from-a-docker-containerhttps://patrickdesjardins.com/blog/how-to-curl-a-graphql-apiIn the last few months, I have been implementing a GraphQL server in TypeScript and NodeJS using Apollo. You can build your query with the playground and see the result immediately. At the top, a "Curl" button generates a Curl command. However, it writes the command with many options that are not re…Tue, 19 Mar 2019 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-curl-a-graphql-apihttps://patrickdesjardins.com/blog/configuring-apollo-playground-and-api-on-two-different-urlBy default, Apollo GraphQL middleware install the server in Express under the same URL. If you use the URL in the browser (GET), the playground loads. If you use the URL as a POST the data is returned. The website and the API are both using the same URL. It is problematic if you want the playground…Wed, 13 Mar 2019 00:00:00 +0000https://patrickdesjardins.com/blog/configuring-apollo-playground-and-api-on-two-different-urlhttps://patrickdesjardins.com/blog/typescript-with-strong-typed-action-when-using-usereducer-of-react-hooksThe technic I will demonstrate in this article comes from what I was using with the traditional React and Redux. Now, with React Hooks we do not need to use Redux anymore but the same principles exist with the hook _useReducer_. I have witnessed many people struggling using TypeScript and Redux beca…Tue, 05 Mar 2019 00:00:00 +0000https://patrickdesjardins.com/blog/typescript-with-strong-typed-action-when-using-usereducer-of-react-hookshttps://patrickdesjardins.com/blog/graphql-resolvers-with-apolloIn this article, we will discuss about two topics that concern resolvers and performance. So far, and by default, everytime a resolver is invoked, this one execute its actions which is mostly be to fetch the data. The problem is that in a graph there is potentially redundant information that will be…Tue, 26 Feb 2019 00:00:00 +0000https://patrickdesjardins.com/blog/graphql-resolvers-with-apollohttps://patrickdesjardins.com/blog/how-to-setup-a-typescript-nodejs-express-apollo-server-to-easy-debugging-with-vscodeThere is a lot of keyword in the title but this is not a clickbait, we will setup without too much burden a simple configuration that will allow Visual Studio Code (VsCode) to hook into a GraphQL installation. The idea is that everytime a TypeScript file is saved that automatically the file is trans…Thu, 21 Feb 2019 00:00:00 +0000https://patrickdesjardins.com/blog/how-to-setup-a-typescript-nodejs-express-apollo-server-to-easy-debugging-with-vscodehttps://patrickdesjardins.com/blog/apollo-graphql-resolvers-and-data-source-separationResolvers can perform asynchronous call to fetch data. Using the specific implementation to perform the fetch in the resolver cause the resolver to have high-coupling into the technology to access the data but also increase the complexity of the resolver by boosting the size of each function with th…Wed, 13 Feb 2019 00:00:00 +0000https://patrickdesjardins.com/blog/apollo-graphql-resolvers-and-data-source-separationhttps://patrickdesjardins.com/blog/graphql-query-with-argumentA part of me wish that the flexibility of GraphQL would extend further in term of parameter to a query. The reality is that the maintainer of a GraphQL service must provide a set of acceptable inputs. The rational is that GraphQL needs to query a services or any source of data in a known way. For ex…Thu, 07 Feb 2019 00:00:00 +0000https://patrickdesjardins.com/blog/graphql-query-with-argumenthttps://patrickdesjardins.com/blog/graphql-contextGraphQL has a mechanism to pass information to every resolver. The resolvers are at the core of resolving core logic about how to fetch the data. It is a centerpiece in term of security by allowing to know which user is authenticated and how to filter the information of this particular one. The reso…Mon, 28 Jan 2019 00:00:00 +0000https://patrickdesjardins.com/blog/graphql-contexthttps://patrickdesjardins.com/blog/apollo-server-and-secured-playgroundIn the I demonstrate how easy is to setup the playground. However, there is still a piece that is missing and is authentication. , I explicitly mentioned that every request goes first through Apache that has a special module that handles authentication. Apache will set in the HTTP request some h…Fri, 25 Jan 2019 00:00:00 +0000https://patrickdesjardins.com/blog/apollo-server-and-secured-playgroundhttps://patrickdesjardins.com/blog/apollo-server-playgroundApollo comes with a handy playground. The playground is simple web portal that allows a rich experience to craft a GraphQL query against the Apollo GraphQL server. The interactive system gives autocomplete, schema discovery and display the response. It is a very valuable tool when developing because…Tue, 22 Jan 2019 00:00:00 +0000https://patrickdesjardins.com/blog/apollo-server-playgroundhttps://patrickdesjardins.com/blog/install-apollo-server-to-host-a-graphql-serviceThis is the second post about my journey on prototyping a GraphQL service to abstract all REST and gRPC services that we have at Netflix Open Connect. You can consult the and the high-level architecture to have a better idea of the motivation. In this article, I'll start diving into how to get star…Mon, 14 Jan 2019 00:00:00 +0000https://patrickdesjardins.com/blog/install-apollo-server-to-host-a-graphql-servicehttps://patrickdesjardins.com/blog/getting-started-with-graphql-for-netflix-open-connectI recently started an initiative about GraphQL for Netflix Open Connect. Netflix already invests in GraphQL and some of the other teams previously discussed on the Netflix's Medium page and . I'll approach the writing of my discovery with GraphQL not in hindsight but during my journey. is an open…Thu, 10 Jan 2019 00:00:00 +0000https://patrickdesjardins.com/blog/getting-started-with-graphql-for-netflix-open-connecthttps://patrickdesjardins.com/blog/recapitulation-of-2018In a fast-paced life, we often lose track of all accomplishments realized thorough the year. Since 2017, I have written my year review. You can consult . As mentioned in the introduction of my 2017 review, since the previous five years or so, everything keeps growing and improving in my life. Thanks…Fri, 28 Dec 2018 00:00:00 +0000https://patrickdesjardins.com/blog/recapitulation-of-2018https://patrickdesjardins.com/blog/book-of-2018Here is the list of book I read in 2018. You can consult my in my 2017's accomplishments. - - - - - - - - - - - - - - - - - - - - - - - - - Next year, I plan to write down a paragraph for each book but for this year, it will be a plain list.Wed, 19 Dec 2018 00:00:00 +0000https://patrickdesjardins.com/blog/book-of-2018https://patrickdesjardins.com/blog/using-onenote-to-record-online-classesI am taking online classes for my . For the first three semesters, I used Google Doc to write down all my notes during lecture. The lectures are provided by Udacity which are using videos to teach the content. After three semesters, I realized that my way of taking notes was not efficient. First, I…Tue, 11 Dec 2018 00:00:00 +0000https://patrickdesjardins.com/blog/using-onenote-to-record-online-classeshttps://patrickdesjardins.com/blog/the-best-development-browser-resolutionAn interesting challenge with web development is the unlimited different combination of width and height that people can consume the application. I am developing with a wide screen most of the time and once in a while directly on my MacBook Pro that has a retina resolution. In all cases, I have the…Wed, 28 Nov 2018 00:00:00 +0000https://patrickdesjardins.com/blog/the-best-development-browser-resolutionhttps://patrickdesjardins.com/blog/adding-telemetry-to-your-web-applicationI wrote several months ago about . In this article, I'll write how it works more technically. First and foremost, the application needs a thin layer to send the telemetry to the backend. I wrote a small internal library that handles basic telemetry needs. For example, if we want to collect a user be…Wed, 21 Nov 2018 00:00:00 +0000https://patrickdesjardins.com/blog/adding-telemetry-to-your-web-applicationhttps://patrickdesjardins.com/blog/re-reselect-your-whole-redux-stateRe-Reselect is a library that uses Reselect. Both have the capability to memoize a function returns by its input. It means that if the input of a determine function change, the function is executed and the return is saved in memory. The saved copy of the information is used until one of the specifie…Tue, 13 Nov 2018 00:00:00 +0000https://patrickdesjardins.com/blog/re-reselect-your-whole-redux-statehttps://patrickdesjardins.com/blog/testing-redux-next-and-api-dispatch-with-typescript-and-jestA middleware in Redux can have quite a lot of logic. In fact, this is my favorite place to place logic. The rationale is that it can be triggered by an action, still, have the time to request data from the backend server with an Ajax call and can dispatch other actions that can be computed by anothe…Wed, 07 Nov 2018 00:00:00 +0000https://patrickdesjardins.com/blog/testing-redux-next-and-api-dispatch-with-typescript-and-jesthttps://patrickdesjardins.com/blog/redux-structure-best-practicesI have been coding in one of our web application at Netflix for more than 15 months, and I realized that my Redux's state got better in time. In hindsight, it is easy to recognize that the initial draft of the state was performing its job but not efficiently. However, after a few Internet searches,…Tue, 30 Oct 2018 00:00:00 +0000https://patrickdesjardins.com/blog/redux-structure-best-practiceshttps://patrickdesjardins.com/blog/react-ref-with-children-caveatRecently, I had the requirement to disable some parts of the user interface if an entity is under a specific state. I decided to create a reusable component that would blur its child and show a message to the user explaining why a section of the screen is inaccessible. You can see the final renderin…Wed, 24 Oct 2018 00:00:00 +0000https://patrickdesjardins.com/blog/react-ref-with-children-caveathttps://patrickdesjardins.com/blog/mocking-every-functions-of-an-object-with-jest-and-typescriptMost of the time, it is enough to simply mock a handful amount of member of an object while performing unit tests. However, if you are using the dependency injection pattern, it is faster to not send an actual object and manually cherry-pick which function to test. Since you are injected an external…Thu, 18 Oct 2018 00:00:00 +0000https://patrickdesjardins.com/blog/mocking-every-functions-of-an-object-with-jest-and-typescripthttps://patrickdesjardins.com/blog/dragging-a-dom-element-visually-properlyA few weeks ago, I started using a web appliance (Trello) to handle my side projects priority.  The main action is moving the cards between columns and I realized that I did a way better job when I worked at Microsoft with Visual Studio Team Services than Trello. You can compare with the following…Tue, 09 Oct 2018 00:00:00 +0000https://patrickdesjardins.com/blog/dragging-a-dom-element-visually-properly