Hello, {name || 'anonymous visitor'}!
> ) } ``` L'avantage de ce hook est sa simplicité d'utilisation. L'auteur de la librairie, [François Best](https://x.com/fortysevenfx) nous propose une **expérience développeur** d'exception. Ses nombreux `parsers` permettent de valider tout type de donnée (full typesafe) : - `parseAsString` (les paramètres sont des *string* par défaut) - `parseAsInteger` pour les entiers - `parseAsFloat` pour les chiffres à 2 décimales - `parseAsBoolean` pour les booléens - `parseAsStringLiteral` pour les *string literals* - et bien plus (les dates, les valeurs hexadécimales, les *enums* ...) Le hook **useQueryState** prend comme premier argument le nom du `paramètre d'URL`. Le deuxième argument est optionel, et peut soit être le `parser`, soit un objet de configuration : ```tsx useQueryState.tsx import { useQueryState, parseAsInteger } from 'nuqs' const [search] = useQueryState('search', { defaultValue: '' }) // ^? string const [count] = useQueryState('count', parseAsInteger) // ^? number | null -> no default value = nullable const [count2] = useQueryState('count', parseAsInteger.withDefault(0)) // ^? number ``` > J'ai de nombreux paramètres d'URL différents à gérer, comment faire ? Utilise le hook [useQueryStates](https://nuqs.47ng.com/docs/batching) (au pluriel), pour gérer un objet de plusieurs `paramètres d'URL`. ```tsx import { useQueryStates, parseAsFloat } from 'nuqs' const [{ latitude, longitude }, setCoordinates] = useQueryStates( { // Use variable names that make sense in your codebase latitude: parseAsFloat.withDefault(45.18), longitude: parseAsFloat.withDefault(5.72) }, { urlKeys: { // And remap them to shorter keys in the URL latitude: 'lat', longitude: 'lng' } } ) // No changes in the setter API, but the keys are remapped to: // ?lat=45.18&lng=5.72 setCoordinates({ latitude: 45.18, longitude: 5.72 }) ``` J'espère que ces hooks vous seront utiles ! --- ## Comment créer une API avec plusieurs actions dans Remix ? URL: https://algomax.fr/blog/comment-creer-une-api-avec-plusieurs-actions-dans-remix Publié le : 2024-06-28 Description : Améliore ton code en utilisant le concept Discriminated Union Type dans ton application Remix, avec Zod et Conform ! Il y a quelques semaines, j'ai découvert un nouveau concept Typescript en lisant un article intéressant sur les [Discriminated Union Types](https://www.hexa-web.fr/blog/discriminated-union-type-typescript) (merci encore [Dimitri](https://www.linkedin.com/in/dimitri-dumont/) 😉). Il m'a permis d'améliorer le code de mes applications **Remix**. Notamment sur la partie **serveur**, avec les **actions**. ## Pourquoi utiliser le Discriminated Union Type ? Je l'utilise parce qu'il me permet d'écrire une logique une seule fois. Au lieu de devoir écrire plusieurs fois la même logique de validation, pour des actions mineures comme la **suppression**, l'**édition** et la **création** d'une donnée, toute cette logique se retrouve dans le même fichier (et non pas dans 3-4 fichiers différents).Something went wrong:
{error.message}