Tutorials Programming Tutorials, Guides & Best Practices

@tailwind base;
@tailwind components;
@tailwind utilities;

Vite handles React out of the box, so there isn't much configuration needed. However, it's good to review how Vite optimizes React for development and production.

   npm install @vitejs/plugin-vue @vitejs/plugin-pwa

Update your vite.config.js to include these plugins:

In the src directory, create a new file called Counter.js and add the following code:

   import React from 'react';
   import { useSelector, useDispatch } from 'react-redux';

   const Counter = () => {
     const count = useSelector((state) => state.count);
     const dispatch = useDispatch();

     const increment = () => {
       dispatch({ type: 'INCREMENT' });
     };

     const decrement = () => {
       dispatch({ type: 'DECREMENT' });
     };

     return (
       <div>
         <h1>Counter: {count}</h1>
         <button onClick={increment}>Increment</button>
         <button onClick={decrement}>Decrement</button>
       </div>
     );
   };

   export default Counter;