aewing
c33ee3dfe7
- Create modular project structure with src/backend, src/frontend, public - Hono server with routing, static file serving, and API endpoints - TailwindCSS styling pipeline with Tailwind CLI - Vanilla JS frontend (extensible for frameworks) - Complete TypeScript configuration and type checking - Auth module as self-contained submodule - Ready for development: bun run dev (port 3000) - All dependencies installed and tested Also: - Lock main branch with read-only settings in VS Code - Create .github/copilot-instructions.md with Monica persona - Initialize session logging system Status: Project ready for feature development
89 lines
2.3 KiB
Markdown
89 lines
2.3 KiB
Markdown
# NewApproach
|
|
|
|
A full-stack TypeScript application with Hono backend, TailwindCSS styling, and Bun runtime.
|
|
|
|
## Stack
|
|
|
|
- **Runtime**: Bun (fast JavaScript runtime and package manager)
|
|
- **Backend**: Hono (lightweight web framework)
|
|
- **Language**: TypeScript (both frontend and backend)
|
|
- **Styling**: TailwindCSS + PostCSS
|
|
- **Package Manager**: Bun
|
|
|
|
## Project Structure
|
|
|
|
```
|
|
NewApproach/
|
|
├── src/
|
|
│ ├── backend/
|
|
│ │ ├── server.ts # Hono server entry point
|
|
│ │ └── api.ts # API utilities
|
|
│ ├── frontend/
|
|
│ │ └── (UI components, if needed)
|
|
│ └── auth/
|
|
│ ├── auth.ts # Universal auth module
|
|
│ └── auth-test.html # Auth testing
|
|
├── public/
|
|
│ ├── index.html # Main HTML entry point
|
|
│ ├── app.js # Frontend logic
|
|
│ └── output.css # Compiled TailwindCSS
|
|
├── styles/
|
|
│ └── input.css # TailwindCSS directives
|
|
├── package.json
|
|
├── tsconfig.json
|
|
├── tailwind.config.js
|
|
├── postcss.config.js
|
|
└── README.md
|
|
```
|
|
|
|
## Installation
|
|
|
|
```bash
|
|
bun install
|
|
```
|
|
|
|
## Development
|
|
|
|
```bash
|
|
# Start development server with hot reload
|
|
bun run dev
|
|
```
|
|
|
|
Server runs on `http://localhost:3000`
|
|
|
|
## Build
|
|
|
|
```bash
|
|
# Build CSS and TypeScript
|
|
bun run build
|
|
```
|
|
|
|
## Available Scripts
|
|
|
|
- `bun run dev` - Start development server with watch mode
|
|
- `bun run build` - Build styles and backend code
|
|
- `bun run build:styles` - Compile TailwindCSS to output.css
|
|
- `bun run start` - Run production build
|
|
- `bun run typecheck` - Check TypeScript types without building
|
|
|
|
## Architecture Notes
|
|
|
|
- **Backend**: Hono with simple routing and static file serving
|
|
- **Frontend**: Vanilla JavaScript with TailwindCSS (no framework required, extensible)
|
|
- **Styling**: TailwindCSS utilities only; custom CSS documented when added
|
|
- **Auth**: Modular auth system in `/src/auth` (decoupled from app logic)
|
|
|
|
## Environment
|
|
|
|
Configure with environment variables (`.env` file):
|
|
```
|
|
PORT=3000
|
|
```
|
|
|
|
## Notes
|
|
|
|
- The auth module is self-contained and can be used independently
|
|
- TypeScript compilation and type checking ensure type safety
|
|
- TailwindCSS purges unused styles in production builds
|
|
- Bun handles all package management and script execution
|