react-dsfr
tsafe
Our great sponsors
react-dsfr | tsafe | |
---|---|---|
9 | 11 | |
395 | 384 | |
3.5% | - | |
9.6 | 6.7 | |
8 days ago | 3 months ago | |
TypeScript | TypeScript | |
MIT License | MIT License |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
react-dsfr
- French State Design System React Integration
-
The french government's design system
My advice if you don't have a multi-million budget and you only need to support React is to start from MUI components. Components like Date pickers, or Autocomplete are complex and time consuming to code from scratch. First thing you want to do is to build a custom theme for MUI (example DSFR, Example OnyxiaUI) this will make the MUI components roughly match your design system out of the box. Then you can create your own components that are wrapper around MUI components and customize them until they match your design (Example). Trust me, we always underestimate the complexity of building base component from scratch. There are tons of things to consider, I don't even mention the accessibility concerns... Customizing MUI components is the quick win route.
-
Ensure you never forget a case in a switch
If you want a real-world use case you can consider this function, it has a very opaque and complex return type that is inferred from the input it receives. Having type-level unit test for this function is very useful both for ensuring the return type is inferred correctly and as an implicit documentation.
-
tsafe enables to unit test your types.
Do you think it's totological to test the return type of this function?
tsafe
-
Ensure you never forget a case in a switch
Hello, This is a use case for tsafe, a utility that let you make assertions on types.
- tsafe enables to unit test your types.
-
Ensure a Zod validator actually valid given type.
Zod is a solution for generating validators. I used to be reluctant to use it because I like to declare my types with the TypeScript syntax. I am not satisfied by getting the type inferred from the validator. The solution I found is to use tsafe, a utility that enables to make sure that two types are equals. With this solution you'll have to declare your type twice, once with the TypeScript syntax and once when declaring your zod parser but you are garentied that if you update your type and forget to update the corresponding zod parser your app won't build.
-
GitLanding: A beautiful landing page for your Github project in a matter of minutes.
tsafe.dev
-
How to Troubleshoot Types?
Hi, Checkout tsafe. It enables to test types definition. Checkout this GIF in particular. Let's say for example that we have an objectFromEntries function and we want to test it typewise, we can do: ```typescript import { objectEntries } from "../myObjectFromEntries"; import { assert } from "tsafe";
-
Object.fromEntries() with a return type more precise than just { [k: sting]: any; } π₯³
`Object.fromEntries()`, `Object.entries()` and `Object.keys()` are barely usable when in a TypeScript codebase because their return type are very vague. [tsafe](https://github.com/garronej/tsafe) features three new utilities: [objectFromEntries()](https://docs.tsafe.dev/objectfromentries), [objectEntries()](https://docs.tsafe.dev/objectentries) and [objectKeys()](https://docs.tsafe.dev/objectkeys), functionally equivalent to their built-in counterpart but featuring much better return types.
- tsafe: The missing TypeScript builtins
- tsafe: A powerful TypeScript assertion function
-
tsafe: A new assertion function for TypeScript
Three GIFs to convince you that you need tsafe in your life:
What are some alternatives?
denoify - π¦For NPM module authors that would like to support Deno but do not want to write and maintain a port.
type-fest - A collection of essential TypeScript types
rescript-compiler - The compiler for ReScript.
tss-react - β¨ Dynamic CSS-in-TS solution, based on Emotion
onyxia-ui - π Onyxia UI toolkit
eslint-plugin-total-functions - An ESLint plugin to enforce the use of total functions (and prevent the use of partial functions) in TypeScript.
compodio - Putting the podcast in community radio
TypeScript - TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
clean-architecture - π A clean architecture framework
ts-pattern - π¨ The exhaustive Pattern Matching library for TypeScript, with smart type inference.
gitlanding - βοΈ React components for creating landingpages