4.1 KiB
Deploying AeThex to Hostinger
Step 1: Build Your Application
Run these commands in your local project directory:
# Install dependencies
npm install
# Build the client-side application
npm run build:client
This creates a dist/spa folder with your built application.
Step 2: Prepare Environment Variables
Create a .env.production file with your Supabase credentials:
VITE_SUPABASE_URL=https://kmdeisowhtsalsekkzqd.supabase.co
VITE_SUPABASE_ANON_KEY=your-anon-key-here
Then rebuild with production environment:
npm run build:client
Step 3: Upload to Hostinger
-
Access Hostinger File Manager:
- Login to your Hostinger control panel
- Go to "File Manager"
- Navigate to
public_htmlfolder
-
Upload Files:
- Upload ALL contents of
dist/spafolder topublic_html - Your file structure should look like:
public_html/ ├── index.html ├── assets/ │ ├── index-[hash].js │ ├── index-[hash].css │ └── ... ├── placeholder.svg └── robots.txt
- Upload ALL contents of
Step 4: Configure DNS for core.aethex.biz
Option A: Use Hostinger DNS (Recommended)
- In Hostinger control panel, go to DNS Zone Editor
- Update/Add these records:
Type: A Name: core Value: [Your Hostinger server IP] TTL: 3600
Option B: Update at Domain Registrar
- Go to your domain registrar (where you bought aethex.biz)
- Update DNS to point
core.aethex.bizto your Hostinger hosting
Step 5: Configure SPA Routing
Create .htaccess file in public_html to handle React Router:
RewriteEngine On
RewriteBase /
# Handle Angular and React requests
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]
# Enable compression
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
</IfModule>
# Cache static assets
<IfModule mod_expires.c>
ExpiresActive on
ExpiresByType text/css "access plus 1 year"
ExpiresByType application/javascript "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType image/jpg "access plus 1 year"
ExpiresByType image/jpeg "access plus 1 year"
</IfModule>
Step 6: Test Your Deployment
- Wait 5-15 minutes for DNS propagation
- Visit
https://core.aethex.biz - Test login functionality
- Verify Supabase connection works
Step 7: Optional - API Functions
Your current Netlify functions won't work on Hostinger. You have two options:
Option A: Remove Server Functions (Simplest)
Since you're using Supabase, you may not need the Express server. Simply remove server-side code.
Option B: Use Hostinger Node.js Hosting
If you need server functions:
- Upgrade to Hostinger plan that supports Node.js
- Deploy your Express server separately
- Update API endpoints in your React app
Benefits of Hostinger vs Netlify:
✅ Direct DNS control - No more DNS propagation issues
✅ Better domain management - Full control over core.aethex.biz
✅ Lower cost - Often cheaper than Netlify Pro
✅ Traditional hosting - More familiar cPanel interface
Potential Issues & Solutions:
Issue: API functions not working
Solution: Use Supabase Edge Functions or upgrade to Node.js hosting
Issue: Environment variables not loading
Solution: Ensure VITE_ prefix and rebuild application
Issue: 404 errors on routes
Solution: Ensure .htaccess file is uploaded and configured
Rollback Plan:
If issues occur, you can quickly revert:
- Update DNS back to Netlify
- Your Netlify deployment remains active
- Switch takes 5-15 minutes