Revert "update website main page and repo readme, add scroll bar to markdown tool"
This reverts commit a6b9f8430f.
This commit is contained in:
Shawn Anderson
parent
0ecbddc333
commit
2ce19aa4cb
153
README.md
153
README.md
|
|
@ -1,152 +1,3 @@
|
|||
# Jeff Emmett's Website
|
||||
A website.
|
||||
|
||||
This is a collaborative canvas-based website built with React, TLDraw, and Cloudflare Workers.
|
||||
|
||||
## Features
|
||||
|
||||
- Interactive canvas with custom shapes and tools
|
||||
- Real-time collaboration
|
||||
- Markdown editing
|
||||
- Video chat integration with Daily.co
|
||||
- AI-powered text generation
|
||||
- Responsive design
|
||||
|
||||
## Getting Started
|
||||
|
||||
### Prerequisites
|
||||
|
||||
- Node.js 18.0.0 or higher
|
||||
- npm (comes with Node.js)
|
||||
- A Cloudflare account (for deploying the worker)
|
||||
- Daily.co API key (for video chat functionality)
|
||||
- OpenAI or Anthropic API key (for AI features)
|
||||
|
||||
### Installation
|
||||
|
||||
1. Clone the repository:
|
||||
```bash
|
||||
git clone https://github.com/your-username/jeffemmett.git
|
||||
cd jeffemmett
|
||||
```
|
||||
|
||||
2. Install dependencies:
|
||||
```bash
|
||||
npm install
|
||||
```
|
||||
|
||||
3. Create environment files:
|
||||
|
||||
Create a `.env.development` file in the root directory:
|
||||
```
|
||||
VITE_TLDRAW_WORKER_URL=http://localhost:5172
|
||||
VITE_DAILY_API_KEY=your_daily_api_key
|
||||
```
|
||||
|
||||
For production, create a `.env.production` file:
|
||||
```
|
||||
VITE_TLDRAW_WORKER_URL=https://api.yourdomain.com
|
||||
VITE_DAILY_API_KEY=your_daily_api_key
|
||||
```
|
||||
|
||||
4. Start the development server:
|
||||
```bash
|
||||
npm run dev
|
||||
```
|
||||
|
||||
This will start both the client (on port 5173) and the worker (on port 5172).
|
||||
|
||||
5. Open your browser and navigate to:
|
||||
```
|
||||
http://localhost:5173
|
||||
```
|
||||
|
||||
## Development
|
||||
|
||||
The project uses a dual-server architecture:
|
||||
|
||||
- **Client**: A Vite-powered React application (port 5173)
|
||||
- **Worker**: A Cloudflare Worker for handling real-time collaboration and asset storage (port 5172)
|
||||
|
||||
### Project Structure
|
||||
|
||||
- `/src` - Frontend React application
|
||||
- `/routes` - React Router routes
|
||||
- `/shapes` - Custom TLDraw shape definitions
|
||||
- `/tools` - Custom TLDraw tool definitions
|
||||
- `/ui` - UI components
|
||||
- `/lib` - Utility libraries
|
||||
- `/worker` - Cloudflare Worker code
|
||||
- `/public` - Static assets
|
||||
|
||||
### Adding API Keys
|
||||
|
||||
To use AI features, you'll need to add your API keys:
|
||||
|
||||
1. Open the application in your browser
|
||||
2. Click on the settings icon in the toolbar
|
||||
3. Enter your OpenAI API key
|
||||
4. Click "Close" to save
|
||||
|
||||
## Deployment
|
||||
|
||||
### Deploying the Client
|
||||
|
||||
The client is deployed using Vercel:
|
||||
|
||||
```bash
|
||||
npm run deploy:dev # Deploy to development
|
||||
npm run deploy:prod # Deploy to production
|
||||
```
|
||||
|
||||
### Deploying the Worker
|
||||
|
||||
The worker is deployed using Wrangler:
|
||||
|
||||
```bash
|
||||
npm run deploy:dev # Deploy to development
|
||||
npm run deploy:prod # Deploy to production
|
||||
```
|
||||
|
||||
You can also deploy the worker separately:
|
||||
|
||||
```bash
|
||||
cd worker
|
||||
npx wrangler deploy --env production
|
||||
```
|
||||
|
||||
## Configuration
|
||||
|
||||
### Wrangler Configuration
|
||||
|
||||
The `wrangler.toml` file contains configuration for the Cloudflare Worker. You'll need to set up:
|
||||
|
||||
- R2 buckets for asset storage
|
||||
- Durable Objects for real-time collaboration
|
||||
- Environment variables for API keys
|
||||
|
||||
### Vercel Configuration
|
||||
|
||||
The `vercel.json` file contains configuration for the Vercel deployment, including:
|
||||
|
||||
- Build commands
|
||||
- Output directory
|
||||
- Routing rules
|
||||
- Cache headers
|
||||
|
||||
## Contributing
|
||||
|
||||
1. Fork the repository
|
||||
2. Create your feature branch (`git checkout -b feature/amazing-feature`)
|
||||
3. Commit your changes (`git commit -m 'Add some amazing feature'`)
|
||||
4. Push to the branch (`git push origin feature/amazing-feature`)
|
||||
5. Open a Pull Request
|
||||
|
||||
## License
|
||||
|
||||
This project is licensed under the ISC License - see the LICENSE file for details.
|
||||
|
||||
## Acknowledgments
|
||||
|
||||
- [TLDraw](https://tldraw.com) for the collaborative canvas
|
||||
- [Daily.co](https://daily.co) for video chat functionality
|
||||
- [Cloudflare Workers](https://workers.cloudflare.com) for serverless backend
|
||||
Do `npm i` and `npm run dev`
|
||||
|
|
|
|||
14
index.html
14
index.html
|
|
@ -1,7 +1,8 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>Jeff Emmett's Website</title>
|
||||
<title>Jeff Emmett</title>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
|
|
@ -37,17 +38,6 @@
|
|||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/src/App.tsx"></script>
|
||||
|
||||
<footer style="margin-top: 40px; padding: 20px; font-family: 'Recursive', sans-serif; font-size: 0.9rem; color: #666; text-align: center; max-width: 800px; margin-left: auto; margin-right: auto;">
|
||||
<div class="footer-links">
|
||||
<p>Explore more of Jeff's mycelial tendrils:</p>
|
||||
<ul style="list-style: none; padding: 0;">
|
||||
<li><a href="https://draw.jeffemmett.com" style="color: #555; text-decoration: underline;">draw.jeffemmett.com</a> - An AI-augmented art generation tool</li>
|
||||
<li><a href="https://quartz.jeffemmett.com" style="color: #555; text-decoration: underline;">quartz.jeffemmett.com</a> - A glimpse into Jeff's Obsidian knowledge graph</li>
|
||||
<li><a href="https://jeffemmett.com/board/explainer" style="color: #555; text-decoration: underline;">jeffemmett.com/board/explainer</a> - A board explaining how boards work</li>
|
||||
</ul>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -111,7 +111,7 @@ export class MarkdownShape extends BaseBoxShapeUtil<IMarkdownShape> {
|
|||
})
|
||||
}}
|
||||
preview='live'
|
||||
visibleDragbar={true}
|
||||
visibleDragbar={false}
|
||||
style={{
|
||||
height: 'auto',
|
||||
minHeight: '100%',
|
||||
|
|
@ -120,13 +120,13 @@ export class MarkdownShape extends BaseBoxShapeUtil<IMarkdownShape> {
|
|||
}}
|
||||
previewOptions={{
|
||||
style: {
|
||||
padding: '12px',
|
||||
padding: '8px',
|
||||
backgroundColor: 'transparent',
|
||||
}
|
||||
}}
|
||||
textareaProps={{
|
||||
style: {
|
||||
padding: '12px',
|
||||
padding: '8px',
|
||||
lineHeight: '1.5',
|
||||
height: 'auto',
|
||||
minHeight: '100%',
|
||||
|
|
|
|||
Loading…
Reference in New Issue