REACT-POWER-STRAP

React Power Strap is a Bash script that automates the process of creating a Vite-powered React project using either TypeScript or JavaScript templates. It also scaffolds basic folders and resets default files.

---

Few features

• Somewhat 'interactive' setup
• Supports React + TypeScript and React + JavaScript
• Automatically installs dependencies
• Verifies required files are present
• Clears default content from main styling and app files
• Creates src/components and src/pages directories
• Simple, clean, and fast project bootstrap

---

Installation

1. Clone the repository:

   git clone https://github.com/24stefan/REACT-POWER-STRAP

2. **Navigate to the directory**:

   ```bash
   cd REACT-POWER-STRAP

3. Make the script executable:

   chmod +x react-power-strap.sh

4. Run the script:

   ./react-power-strap.sh

---

Usage

When you run the script, you'll be prompted to:

1. Enter your project name

   • Press Enter to default to front-end.

2. Choose your template

   • Enter ts for React + TypeScript (default)
   • Enter js for React + JavaScript

The script will then:

• Generate a Vite project using the selected template
• Install node_modules
• Clear contents of App.tsx/App.jsx, App.css, and index.css
• Create src/components and src/pages directories

---

Example Output

Enter your project name (default: front-end): my-app
Enter ts (react + ts) or js (react + js) - default: ts: js
Creating new Vite React project with template 'react'...
Installing dependencies...
Resetting contents of App.jsx, App.css, and index.css...
Creating src/pages and src/components directories...
Project setup complete.

---

If you really want to run tests

Tests are written using Bats (Bash Automated Testing System).

To install Bats:

npm install -g bats

To run the tests:

cd tests
bats react-power-strap.bats

These tests will (maybe):

• Verify the project directory is created
• Ensure necessary files exist
• Confirm that content is reset in core files
• Check that folders like src/pages and src/components are created

---

my-app/
├── node_modules/
├── package.json
├── vite.config.(ts|js)
├── tsconfig.json (if using TypeScript)
└── src/
    ├── App.(ts|js)x
    ├── App.css
    ├── index.css
    ├── components/
    └── pages/

---

• Requires Node.js and npm
• Vite must be accessible via npm create vite@latest
• If any core files are missing, the script will attempt to reinstall dependencies
• Existing directories with the same project name will be preserved

---

MIT License

---