Update readmes
This commit is contained in:
@@ -1,44 +1,81 @@
|
||||
# Development Notes
|
||||
|
||||
## Initial Setup for Tailwind CSS and Recharts
|
||||
## Current Tech Stack (2025-11-26)
|
||||
|
||||
- **React 19.1.1** with TypeScript 5.9.3
|
||||
- **shadcn/ui** component library (Radix UI + Tailwind)
|
||||
- **Tailwind CSS 3.4.18** for styling
|
||||
- **Recharts 3.3.0** for data visualization
|
||||
- **Create React App 5.0.1** as build tool
|
||||
|
||||
## Initial Setup (Fresh Clone)
|
||||
|
||||
```sh
|
||||
# Hard reset in case of version conflicts / existing installs
|
||||
npm uninstall tailwindcss postcss autoprefixer recharts nodemon
|
||||
npm install -D tailwindcss@^3.0.0 postcss@^8.0.0 autoprefixer@^10.0.0
|
||||
|
||||
npm install --save recharts
|
||||
rm -rf node_modules package-lock.json
|
||||
|
||||
# Fresh install
|
||||
# Install all dependencies
|
||||
npm install
|
||||
|
||||
# Initialize tailwind CSS (creates config files)
|
||||
# Note: This may overwrite existing project files
|
||||
npx tailwindcss init -p
|
||||
# Run development server
|
||||
npm start
|
||||
|
||||
# Build for production
|
||||
npm run build
|
||||
```
|
||||
|
||||
Content of ./tailwind.config.js:
|
||||
## shadcn/ui Setup (Already Done)
|
||||
|
||||
The project was set up with shadcn/ui components. If you need to add more components:
|
||||
|
||||
```sh
|
||||
# Add new shadcn/ui components
|
||||
npx shadcn@latest add [component-name]
|
||||
|
||||
# Example:
|
||||
npx shadcn@latest add dialog
|
||||
```
|
||||
|
||||
## TypeScript Configuration
|
||||
|
||||
TypeScript is configured with:
|
||||
- Strict mode enabled
|
||||
- Path aliases: `@/*` → `./src/*`
|
||||
- Target: ES5
|
||||
- Module: ESNext
|
||||
- JSX: react-jsx
|
||||
|
||||
## Tailwind CSS Configuration
|
||||
|
||||
Content paths in `tailwind.config.js`:
|
||||
|
||||
```javascript
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
module.exports = {
|
||||
content: [
|
||||
"./src/**/*.{js,jsx,ts,tsx}",
|
||||
],
|
||||
theme: {
|
||||
extend: {},
|
||||
extend: {
|
||||
colors: {
|
||||
// HSL-based color system for shadcn/ui
|
||||
},
|
||||
},
|
||||
},
|
||||
plugins: [],
|
||||
plugins: [require("tailwindcss-animate")],
|
||||
}
|
||||
```
|
||||
|
||||
Content of ./src/index.css:
|
||||
Global styles in `./src/styles/global.css`:
|
||||
|
||||
```css
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
@layer base {
|
||||
:root {
|
||||
--background: 0 0% 98%;
|
||||
--foreground: 222 47% 11%;
|
||||
/* ... more CSS variables for shadcn/ui theme */
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## WSL Networking Issues
|
||||
|
||||
Reference in New Issue
Block a user