React Setup Guide
Project Structure
We recommend the following structure for your React project:
src/
├── components/
│ ├── ui/ # TonuComponent components
│ ├── layout/ # Layout components
│ └── features/ # Feature-specific components
├── styles/
│ └── globals.css # Global styles
└── App.tsxTailwind Configuration
Add this to your `src/styles/globals.css`:
css
@tailwind base;
@tailwind components;
@tailwind utilities;Using Components
Example of using a button component:
tsx
import { PrimaryButton } from './components/ui/button';
function App() {
return (
<div className="p-8">
<PrimaryButton onClick={() => alert('Clicked!')}>
Click Me
</PrimaryButton>
</div>
);
}
export default App;