Add readme

This commit is contained in:
Raven Scott 2025-01-15 01:13:10 -05:00
parent 5d6dd7eb69
commit c795b64fe2

93
README.md Normal file
View File

@ -0,0 +1,93 @@
### **`README.md`**
```markdown
# Hello World App 🌍
A simple **Hello World** desktop application built with [Pear](https://pear.io) and [Bootstrap](https://getbootstrap.com/). This project demonstrates how to create a modern GUI application with modals and responsive design.
---
## Features 🚀
- A clean title bar with draggable support.
- Two interactive modals:
- **Information Modal**: Displays a simple informational message.
- **Alert Modal**: Displays a warning or alert message.
- Built with Bootstrap for a beautiful and responsive design.
- Easily extendable for other use cases.
---
## Requirements 🛠️
- **Node.js**: v16 or higher
- **Pear**: Installed globally
```bash
npm install -g pear
```
---
## Setup Instructions 📝
1. **Clone the repository**:
```bash
git clone https://github.com/your-username/hello-world-app.git
cd hello-world-app
```
2. **Install dependencies**:
```bash
npm install
```
3. **Run the application**:
```bash
pear run --dev .
```
The application will launch in development mode, with developer tools enabled.
---
## Project Structure 📂
```
hello-world-app/
├── app.js # Main application logic
├── index.html # Application UI
├── package.json # Project metadata
├── styles.css # Custom styles
└── test/
└── index.test.js # Test skeleton
```
---
## Usage 💡
1. **Launch the app**:
- Use `pear run --dev .` to start the app.
- A draggable title bar and two buttons will appear in the main window.
2. **Interact with modals**:
- **Info Modal**: Click the "Show Info Modal" button to view a sample informational modal.
- **Alert Modal**: Click the "Show Alert Modal" button to display a warning.
---
## Customization 🛠️
### Changing the Title Bar Text
Modify the `<h5>` element in `index.html`:
```html
<h5 class="ms-auto mb-0">Your Custom Title</h5>
```
### Adding New Modals
1. Add a new modal block in `index.html`.
2. Update `app.js` to include the modal logic.
---
## Technologies Used 🛠️
- **Pear**: A peer-to-peer framework for desktop apps.
- **Bootstrap 5**: For responsive and styled components.