website deployment guide

workflow: vs code → mamp → github → auto-deploy to hostinger

required software

configure git (first time only)

set your name and email (required before first commit):

git config --global user.name "Your Name"
git config --global user.email "your-email@example.com"
use the same email as your github account

verify configuration:

git config --global user.name git config --global user.email

github authentication (personal access token)

github requires a personal access token instead of password:

  1. go to github.com/settings/tokens
  2. click "Generate new token" → "Generate new token (classic)"
  3. give it a name: "deployment" or "git-access"
  4. set expiration: choose "no expiration" or custom date
  5. check the "repo" permission (full control of repositories)
  6. scroll down and click "Generate token"
  7. copy the token immediately - you'll only see it once!
  8. save it somewhere safe (password manager or text file)

using the token:

when git asks for password during push, paste your token instead of your github password

save your token! if you lose it, you'll need to generate a new one

step 1: create project

  1. open visual studio code
  2. create project folder: my-new-project
  3. write your code
use lowercase with hyphens for project names

step 2 (php projects only): local testing with mamp

  1. open mamp
  2. click mamp -> preferences -> server tab
  3. in "Document Root" click "Select" button
  4. navigate to your project folder and select it
  5. click ok and start mamp server

test in browser:

http://localhost:8888
for static html/css/js projects, skip this step and just open index.html in your browser

step 3: create github repository

  1. go to github.com
  2. click [+] new repository
  3. name: my-new-project
  4. do not initialize with readme
  5. click create repository

step 4: push to github

first time setup

navigate to project:

cd C:\Users\Matej\Desktop\codelabhaven\projects\my-new-project

initialize git:

git init

stage files:

git add .

create commit:

git commit -m "Initial commit"

set branch:

git branch -M main

link remote:

git remote add origin https://github.com/Matej398/my-new-project.git
replace my-new-project with your repository name using the config above

push to github:

git push -u origin main

future updates

after making changes, run these three commands:

git add . git commit -m "describe your changes" git push
changes deployed to github, auto-deploy to server initiated

step 5: configure auto-deployment (one time per project)

this is easier than you think! no manual cloning needed - just add config and webhook, then push!

5.1 generate unique secret for your project

each project should have its own unique secret for security.

open powershell and run this command:

([System.BitConverter]::ToString((1..32 | ForEach-Object { Get-Random -Maximum 256 })) -replace '-','').ToLower()

this generates a 64-character secret that matches your existing format

save this secret! you'll need it for both repositories.json and github webhook

5.2 add project to repositories.json

option a: using filezilla (easier)

  1. open filezilla and connect:
    • host: srv751763.hstgr.cloud
    • username: root
    • password: your ssh password
    • port: 22
  2. navigate to: /var/www/html/codelabhaven/
  3. right-click repositories.json → "view/edit"
  4. it opens in your text editor

option b: using ssh terminal

ssh root@srv751763.hstgr.cloud
nano /var/www/html/codelabhaven/repositories.json

add your project to the repositories array (add a comma after the last project, then add this):

{ "name": "my-new-project", "owner": "Matej398", "branch": "main", "path": "/var/www/html/codelabhaven/projects/my-new-project", "secret": "YOUR_GENERATED_SECRET_HERE", "post_commands": [] }
replace YOUR_GENERATED_SECRET_HERE with the secret you generated in step 5.1

save the file:

5.3 set up github webhook (one time per project)

now configure github to trigger deployments when you push code:

  1. go to your repository on github.com
  2. click settings (top menu bar)
  3. click webhooks (left sidebar)
  4. click add webhook (green button)
  5. github will ask for your password - enter it to confirm

webhook configuration:

payload url: (copy this exactly)

https://codelabhaven.com/gh-hooks/webhook-handler.php

content type:

secret: (paste the secret you generated in step 5.1)

paste your unique secret here
important: use the SAME secret you put in repositories.json!

which events would you like to trigger this webhook?

active:

click the green add webhook button at the bottom

webhook created! github will now notify your server every time you push code

5.4 that's it! now just push to deploy

from now on, every time you push to github:
1. webhook triggers automatically
2. server clones repo (first push only)
3. future pushes just pull updates
4. your site is live!

test it by making a change and pushing:

git add . git commit -m "test auto-deploy" git push

your site should be live at:

https://codelabhaven.com/projects/my-new-project/

step 6: automated deployment active

workflow:

1. edit code → 2. test mamp → 3. git push → 4. webhook → 5. live

quick deploy commands:

git add . git commit -m "your changes" git push

command reference

git status

check repository state

git diff

view file changes

git log

view commit history

git checkout -- file

discard changes

git pull

fetch latest changes

git checkout -b branch

create new branch

troubleshooting

authentication failed

solution: use personal access token

  1. github -> settings -> developer settings
  2. personal access tokens -> tokens classic
  3. generate token with repo permissions
  4. use token as password when prompted

repository not found

solution: verify remote url

git remote -v

webhook not triggering

diagnostics:

  1. github → settings → webhooks → recent deliveries (check for errors)
  2. verify webhook url is correct: https://codelabhaven.com/gh-hooks/webhook-handler.php
  3. verify secret matches between repositories.json and github webhook
  4. check server logs via ssh:
    ssh root@srv751763.hstgr.cloud tail -f /var/www/html/codelabhaven/gh-hooks/deploy.log
  5. test webhook manually in github:
    • go to settings → webhooks → click your webhook
    • scroll down to "recent deliveries"
    • click "redeliver" on any delivery to test

merge conflicts

solution:

# check conflicted files git status # edit files to resolve # then stage and commit git add . git commit -m "resolved conflicts" git push

best practices


system: vs code -> mamp -> github -> hostinger vps (srv751763.hstgr.cloud)

webhook: https://codelabhaven.com/gh-hooks/webhook-handler.php

config: /var/www/html/codelabhaven/repositories.json

status: operational ✓