React Ardublockly

A modern, React-based version of the senseBox Ardublockly environment. This project is the continuation of blockly.sensebox.de and offers an improved user interface and new features.

🚀 Features

• 📱 Modern, responsive user interface
• 🧩 Visual programming with Blockly
• 💾 Automatic project saving
• 🔄 Easy code export
• 📊 Support for various senseBox boards
• 🌍 Multilingual interface (German/English)
• 📱 Integration with senseBox Connect App

🛠 Installation

Prerequisites

• Node.js (Version 10.x or higher)
• npm (comes with Node.js)
• Git (optional, for version control)

Setting up the Development Environment

1. Clone or download repository:

   git clone https://github.com/sensebox/React-Ardublockly.git
   # or
   # Direct download: https://github.com/sensebox/React-Ardublockly/archive/master.zip

2. Change to project directory:

   cd React-Ardublockly

3. Install dependencies:

   npm ci   # Recommended for reproducible builds
   # or
   npm install   # Alternative

4. Start development server:

   npm start

5. Open browser and navigate to http://localhost:3000

🔧 Configuration

Board Selection

• senseBox MCU: Standard board with Arduino compatibility
• senseBox MCU-S2: ESP32-based board with extended functionality

Compiler Settings

The compiler URL can be configured in the .env file:

REACT_APP_COMPILER_URL=https://compiler.sensebox.de

📝 Development Guidelines

Code Style

• We use Prettier for consistent formatting
• Configuration in .prettierrc.json
• ESLint for JavaScript/React best practices

Branching Strategy

If you want to contribute please use the development branch ! The main branch is only used for production and may be outdated!

• main: Production branch
• development: Development branch
• Feature branches: feature/name-of-feature
• Bugfix branches: bugfix/name-of-bug

🤝 Contributing

1. Create a fork
2. Create feature branch (git checkout -b feature/AmazingFeature)
3. Commit changes (git commit -m '[Area] Add amazing feature')
4. Push branch (git push origin feature/AmazingFeature)
5. Create Pull Request

🐛 Known Issues

• Redux DevTools must be installed or the corresponding line in store.js must be commented out
• Some boards require special drivers for USB connection

📚 Documentation

• User Manual
• Hardware-Glossar

🌐 Demo

A live demo of the current version can be found at https://blockly.sensebox.de/

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

🙏 Acknowledgments

• Blockly - Google's visual programming language
• Create React App - React project template
• Material-UI - React UI Framework