This template should help get you started developing with Reac and Typescript in webpack.. Questions, feedback, and for now, even bikeshedding are welcome.
- React & TypeScript already: webpack tool & TypeScript has included making React great
- Thorough documentation: All knowledge was care for (tested) & written very details
- Guaranteed consistency: Lint and prettier / Git hook for caring code type convention
- First-class tests: Practice test-driven development with sample unit(Jest - by Facebook)
- From begin 2024, the React team release the React version 19, please look careful for all new features: https://react.dev/blog/2024/04/25/react-19
- Micro change but affect to all layout its the feature
turn Ref into props
with methodforwardRef
- Please got this example to change
Before:
const CardHeader = React.forwardRef<
HTMLDivElement,
React.HTMLAttributes<HTMLDivElement>
>(({ className, ...props }, ref) => (
<div
ref={ref}
className={classNames("flex flex-col space-y-1.5 p-6", className)}
{...props}
/>
));
After:
const CardHeader: React.FC<React.ComponentProps<"div">> = ({
className,
...props
}) => (
<div
className={classNames("flex flex-col space-y-1.5 p-6", className)}
{...props}
/>
);
Additional Notes
- You will not need to change how the components are being used. They should all still work as before. All tests were passing before I made this PR.
- I cannot confirm if all warnings are eliminated. However, in my personal project, these changes removed the warnings.
This project includes a docs
folder with more details on:
- Setup and development
- Architecture
- Languages and technologies
- Routing, layouts, and views
- State management
- Tests and mocking the API
- Linting and formatting
- Editor integration
- Building and deploying to production
Should we need to add all configs for the new current project?
No, you can choose one or maybe several of the richest features for your project.
This template it's just like the normal project.
TypeScript may be new to me, should I use it?
Trending is important for the developer world, if you don't follow that, you can be foggy
npm install
npm start
npm build