https://www.arnaudrenaud.com/ Recent content in Home on Arnaud Renaud Hugo en-US Fri, 29 Aug 2025 00:00:00 +0000 https://www.arnaudrenaud.com/articles/free-static-website-cms/ Fri, 29 Aug 2025 00:00:00 +0000 https://www.arnaudrenaud.com/articles/free-static-website-cms/ Your browser does not support the video tag. TL;DR 🌎 Live Demo: ssg-nextjs-cms-sanity.netlify.app 📑 Source Code: github.com/arnaudrenaud/ssg-nextjs-cms-sanity Is this for you? This guide is meant to help if: you want a public, mostly read-only website (no user-supplied content) content is not supposed to change dozens of times per day, as each update will trigger a rebuild Advantages If the above fits your needs, you’ll get: a graphical CMS interface to manage content in the cloud no server or database to maintain (less work, more security) no deployment or hosting fees at all fast-loading pre-rendered pages browser-side interactivity, if wanted some form functionality (see contact page) The toolkit 📝 Language: TypeScript 🛠️ Build: Static Site Generation (SSG) with Next. https://www.arnaudrenaud.com/articles/nextjs-forms-both-sides-validation/ Mon, 07 Apr 2025 00:00:00 +0000 https://www.arnaudrenaud.com/articles/nextjs-forms-both-sides-validation/ TL;DR ✅ Result: a form that submits to a server-side action shared validation logic on both client and server browser-side form state management: loading, success, and error states 🛠️ Tech stack: Next.js Server Actions next-safe-action Zod React Hook Form 📦 Code: https://github.com/arnaudrenaud/nextjs-forms-both-sides-validation The problem Forms have been – and still are – a pain for the web developer. In particular, one has to enforce server-side validation for security, while also providing client-side validation for user experience (HTML-only validation does not cover all cases). https://www.arnaudrenaud.com/articles/clean-architecture-typescript-prisma-next/ Sun, 25 Aug 2024 00:00:00 +0000 https://www.arnaudrenaud.com/articles/clean-architecture-typescript-prisma-next/ TL;DR Explore the code produced in this article: https://github.com/arnaudrenaud/clean-architecture-typescript-prisma-nextjs For step-by-step guidance, review the commit history. What is the purpose of Clean Architecture? The Clean Architecture software design pattern, as defined by Robert C. Martin in this article, is one of a handful of patterns that propose a way to separate concerns in an application codebase. Achieving a proper separation of concerns will make your code more readable, testable, adjustable: have you ever tried to make a clean cut in a plate of spaghetti? https://www.arnaudrenaud.com/articles/ways-to-improve-junior-developer/ Fri, 05 Jul 2024 00:00:00 +0000 https://www.arnaudrenaud.com/articles/ways-to-improve-junior-developer/ I taught the practice of web development to around 200 students in six years. Here are ways to improve on the mistakes and misconceptions I noticed most often. TL;DR Use automatic code formatting Look for error messages Simplify your code until the bug goes away Solve only one problem at a time Split tasks and commits Give symbols a proper name Refrain from DRYing everything out Optimize reasonably Test the risky parts first Avoid persisting redundant data Use automatic code formatting Even if you work alone, automatic formatting is a free time saver: you can write code faster, and will be able to read it more easily later. https://www.arnaudrenaud.com/articles/handle-errors-exceptions/ Mon, 29 Apr 2024 00:00:00 +0000 https://www.arnaudrenaud.com/articles/handle-errors-exceptions/ Errors are painful for the developer and the user alike. Errors without a clear message even more. And what about silent errors that make debugging a pain? TL;DR Do not blindly use try-catch blocks Uncaught errors end up in logs, making debugging easier If an error is not your fault, catch it (it is called an exception) If an error is the user’s fault, tell them clearly Goals The objective of this practical guide is to help you, the developer: