Skip to content
/ React-ts-startkit Public template

⚛ React webpack4 with TypeScript startkit (in WIP) ✨🎉

Notifications You must be signed in to change notification settings

b0yblake/React-ts-startkit

Repository files navigation

[WIP] - React CRA TypeScript startkit

This template should help get you started developing with Reac and Typescript in webpack.. Questions, feedback, and for now, even bikeshedding are welcome.

Features

Migrations

  • 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 method forwardRef
  • 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.

Documentation

This project includes a docs folder with more details on:

  1. Setup and development
  2. Architecture
  3. Languages and technologies
  4. Routing, layouts, and views
  5. State management
  6. Tests and mocking the API
  7. Linting and formatting
  8. Editor integration
  9. Building and deploying to production

FAQ's

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

Getting started

npm install
npm start
npm build