280 lines
8.1 KiB
Markdown
280 lines
8.1 KiB
Markdown
# AeThex Studio
|
|
|
|
A powerful, browser-based IDE specifically designed for Roblox Lua development with AI assistance, modern tooling, and an intuitive interface.
|
|
|
|
   
|
|
|
|
## ✨ Features
|
|
|
|
### 🎨 **Modern Code Editor**
|
|
- **Monaco Editor** - The same editor that powers VS Code
|
|
- **Lua syntax highlighting** with autocomplete
|
|
- **Real-time code validation** and linting
|
|
- **Multi-file editing** with tab management
|
|
- **File tree navigation** with drag-and-drop organization
|
|
|
|
### 🤖 **AI-Powered Assistant**
|
|
- Built-in AI chat for code help and debugging
|
|
- Context-aware suggestions
|
|
- Code explanation and documentation
|
|
- Roblox API knowledge
|
|
|
|
### 📁 **Project Management**
|
|
- **File Tree** - Organize your scripts into folders
|
|
- **Drag-and-drop** - Rearrange files easily
|
|
- **Quick file search** (Cmd/Ctrl+P) - Find files instantly
|
|
- **Search in files** (Cmd/Ctrl+Shift+F) - Global text search
|
|
|
|
### 🎯 **Productivity Features**
|
|
- **25+ Code Templates** - Ready-made scripts for common tasks
|
|
- Beginner templates (Hello World, Touch Detectors, etc.)
|
|
- Gameplay systems (DataStore, Teams, Combat, etc.)
|
|
- UI components (GUIs, Timers, etc.)
|
|
- Advanced features (Pathfinding, Inventory, etc.)
|
|
- **Command Palette** (Cmd/Ctrl+K) - Quick access to all commands
|
|
- **Keyboard Shortcuts** - Professional IDE shortcuts
|
|
- **Code Preview** - Test your scripts instantly
|
|
|
|
### 💻 **Interactive Terminal & CLI**
|
|
- **Built-in Terminal** - Full-featured command line interface
|
|
- **10+ CLI Commands** for Roblox development:
|
|
- `help` - Display available commands
|
|
- `run` - Execute current Lua script
|
|
- `check` - Validate syntax and find errors
|
|
- `count` - Count lines, words, characters
|
|
- `api <class>` - Lookup Roblox API documentation
|
|
- `template [list|name]` - Browse and load templates
|
|
- `export [filename]` - Export scripts to .lua files
|
|
- `clear` - Clear terminal output
|
|
- `info` - Display system information
|
|
- `echo` - Print text to terminal
|
|
- **Command History** - Navigate previous commands with ↑/↓ arrows
|
|
- **Auto-completion** - Tab-complete command names
|
|
- **Smart Suggestions** - Context-aware command hints
|
|
- **Toggle with Cmd/Ctrl + `** - Quick terminal access
|
|
|
|
### 🎨 **Customization**
|
|
- **5 Beautiful Themes**:
|
|
- **Dark** - Classic dark theme for comfortable coding
|
|
- **Light** - Clean light theme for bright environments
|
|
- **Synthwave** - Retro neon aesthetic
|
|
- **Forest** - Calming green tones
|
|
- **Ocean** - Deep blue theme
|
|
- **Persistent preferences** - Your settings are saved
|
|
|
|
### 📱 **Mobile Responsive**
|
|
- Optimized layouts for phones and tablets
|
|
- Touch-friendly controls
|
|
- Hamburger menu for mobile
|
|
- Collapsible panels
|
|
|
|
### 🚀 **Developer Experience**
|
|
- **Code splitting** for fast loading
|
|
- **Error boundaries** with graceful error handling
|
|
- **Loading states** with spinners
|
|
- **Toast notifications** for user feedback
|
|
- **Testing infrastructure** with Vitest
|
|
|
|
## 🎮 Perfect For
|
|
|
|
- **Roblox Developers** - Build game scripts faster
|
|
- **Students & Learners** - Learn Lua with templates and AI help
|
|
- **Rapid Prototyping** - Quickly test game ideas
|
|
- **Web-Based Development** - Code anywhere, no installation needed
|
|
|
|
## ⌨️ Keyboard Shortcuts
|
|
|
|
| Shortcut | Action |
|
|
|----------|--------|
|
|
| `Cmd/Ctrl + S` | Save file (auto-save enabled) |
|
|
| `Cmd/Ctrl + P` | Quick file search |
|
|
| `Cmd/Ctrl + K` | Command palette |
|
|
| `Cmd/Ctrl + N` | New project |
|
|
| `Cmd/Ctrl + F` | Find in editor |
|
|
| `Cmd/Ctrl + Shift + F` | Search in all files |
|
|
| ``Cmd/Ctrl + ` `` | Toggle terminal |
|
|
|
|
## 🚀 Getting Started
|
|
|
|
### Prerequisites
|
|
- Node.js 18+
|
|
- npm or yarn
|
|
|
|
### Installation
|
|
|
|
```bash
|
|
# Clone the repository
|
|
git clone https://github.com/AeThex-LABS/aethex-studio.git
|
|
|
|
# Navigate to the project directory
|
|
cd aethex-studio
|
|
|
|
# Install dependencies
|
|
npm install
|
|
|
|
# Start the development server
|
|
npm run dev
|
|
```
|
|
|
|
Visit `http://localhost:3000` to see the application.
|
|
|
|
### Building for Production
|
|
|
|
```bash
|
|
# Build the application
|
|
npm run build
|
|
|
|
# Start the production server
|
|
npm start
|
|
```
|
|
|
|
## 📖 Usage Guide
|
|
|
|
### Creating Your First Script
|
|
|
|
1. Click **"New File"** in the file tree
|
|
2. Choose a template or start from scratch
|
|
3. Write your Lua code in the Monaco editor
|
|
4. Click **"Preview"** to test
|
|
5. **Copy** or **Export** your script
|
|
|
|
### Using Templates
|
|
|
|
1. Click the **Templates** button in the toolbar
|
|
2. Browse categories: Beginner, Gameplay, UI, Tools, Advanced
|
|
3. Click a template to load it into your editor
|
|
4. Customize the code for your needs
|
|
|
|
### AI Assistant
|
|
|
|
1. Open the **AI Chat** panel (right side on desktop)
|
|
2. Ask questions about:
|
|
- Roblox scripting
|
|
- Code debugging
|
|
- API usage
|
|
- Best practices
|
|
3. Get instant, context-aware answers
|
|
|
|
### Organizing Files
|
|
|
|
- **Create folders** - Right-click in file tree
|
|
- **Drag and drop** - Move files between folders
|
|
- **Rename** - Click the menu (⋯) next to a file
|
|
- **Delete** - Use the menu to remove files
|
|
|
|
### Searching
|
|
|
|
- **Quick search** - `Cmd/Ctrl+P` to find files by name
|
|
- **Global search** - `Cmd/Ctrl+Shift+F` to search text across all files
|
|
- **In-editor search** - `Cmd/Ctrl+F` to find text in current file
|
|
|
|
## 🛠️ Tech Stack
|
|
|
|
- **Next.js 14** - React framework
|
|
- **React 18** - UI library
|
|
- **TypeScript** - Type safety
|
|
- **Monaco Editor** - Code editor
|
|
- **Tailwind CSS** - Styling
|
|
- **Radix UI** - Component primitives
|
|
- **Phosphor Icons** - Icon library
|
|
- **Vitest** - Testing framework
|
|
- **PostHog** - Analytics (optional)
|
|
- **Sentry** - Error tracking (optional)
|
|
|
|
## 🧪 Running Tests
|
|
|
|
```bash
|
|
# Run all tests
|
|
npm test
|
|
|
|
# Run tests in watch mode
|
|
npm run test:watch
|
|
|
|
# Run tests with UI
|
|
npm run test:ui
|
|
|
|
# Generate coverage report
|
|
npm run test:coverage
|
|
```
|
|
|
|
## 📂 Project Structure
|
|
|
|
```
|
|
aethex-studio/
|
|
├── src/
|
|
│ ├── components/ # React components
|
|
│ │ ├── ui/ # Reusable UI components
|
|
│ │ ├── CodeEditor.tsx
|
|
│ │ ├── FileTree.tsx
|
|
│ │ ├── AIChat.tsx
|
|
│ │ └── ...
|
|
│ ├── hooks/ # Custom React hooks
|
|
│ ├── lib/ # Utility functions
|
|
│ │ ├── templates.ts # Code templates
|
|
│ │ └── ...
|
|
│ └── App.tsx # Main application
|
|
├── app/ # Next.js app directory
|
|
│ └── globals.css # Global styles
|
|
├── public/ # Static assets
|
|
└── tests/ # Test files
|
|
```
|
|
|
|
## 🤝 Contributing
|
|
|
|
Contributions are welcome! Please feel free to submit a Pull Request.
|
|
|
|
1. Fork the repository
|
|
2. Create your feature branch (`git checkout -b feature/AmazingFeature`)
|
|
3. Commit your changes (`git commit -m 'Add some AmazingFeature'`)
|
|
4. Push to the branch (`git push origin feature/AmazingFeature`)
|
|
5. Open a Pull Request
|
|
|
|
## 📝 Code Templates
|
|
|
|
AeThex Studio includes 25+ production-ready templates:
|
|
|
|
**Beginner:**
|
|
- Hello World, Player Join Handler, Part Touch Detector, etc.
|
|
|
|
**Gameplay:**
|
|
- DataStore System, Teleport Part, Team System, Combat System, etc.
|
|
|
|
**UI:**
|
|
- GUI Buttons, Proximity Prompts, Countdown Timers, etc.
|
|
|
|
**Tools:**
|
|
- Give Tool, Sound Manager, Admin Commands, Chat Commands, etc.
|
|
|
|
**Advanced:**
|
|
- Round System, Inventory System, Pathfinding NPC, Shop System, etc.
|
|
|
|
## 🐛 Bug Reports
|
|
|
|
Found a bug? Please open an issue on GitHub with:
|
|
- Description of the bug
|
|
- Steps to reproduce
|
|
- Expected vs actual behavior
|
|
- Screenshots (if applicable)
|
|
|
|
## 📜 License
|
|
|
|
This project is licensed under the MIT License - see the LICENSE file for details.
|
|
|
|
## 🙏 Acknowledgments
|
|
|
|
- **Monaco Editor** - For the powerful code editor
|
|
- **Roblox** - For the game platform
|
|
- **Radix UI** - For accessible component primitives
|
|
- **Vercel** - For Next.js framework
|
|
|
|
## 📧 Contact
|
|
|
|
- **Website**: [aethex.com](https://aethex.com)
|
|
- **GitHub**: [@AeThex-LABS](https://github.com/AeThex-LABS)
|
|
- **Issues**: [GitHub Issues](https://github.com/AeThex-LABS/aethex-studio/issues)
|
|
|
|
---
|
|
|
|
**Built with ❤️ by the AeThex team**
|
|
|
|
Happy coding! 🎮✨
|