Align Git Flow branches and add CI/test/deploy baseline

.github/workflows/build.yml

@@ -1,14 +1,13 @@
-name: Build
+name: Build and Test
 
 on:
-  workflow_run:
-    workflows: ["Linters"]
-    types:
-      - completed
+  pull_request:
+    branches: [develop, main]
+  push:
+    branches: [develop, main]
 
 jobs:
   build:
-    if: ${{ github.event.workflow_run.conclusion == 'success' }}
     runs-on: ubuntu-latest
 
     steps:
@@ -21,4 +20,4 @@ jobs:
 
       - run: npm ci
       - run: npm test
-      - run: npm run build
+      - run: npm run build

.github/workflows/deploy-dev.yml

@@ -1,4 +1,32 @@
+name: Deploy Develop (Firebase Hosting)
+
+on:
+  push:
+    branches: [develop]
+
 jobs:
   deploy:
-    if: false
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-latest
+    environment: development
+
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: npm
+
+      - run: npm ci
+      - run: npm run build
+
+      - name: Install Firebase CLI
+        run: npm install --global firebase-tools
+
+      - name: Deploy to Firebase Hosting target world
+        env:
+          GOOGLE_APPLICATION_CREDENTIALS_JSON: ${{ secrets.FIREBASE_SERVICE_ACCOUNT }}
+        run: |
+          echo "$GOOGLE_APPLICATION_CREDENTIALS_JSON" > "$RUNNER_TEMP/firebase-sa.json"
+          export GOOGLE_APPLICATION_CREDENTIALS="$RUNNER_TEMP/firebase-sa.json"
+          firebase deploy --only hosting:world --project pickaapp-79307 --non-interactive

.github/workflows/deploy-prod.yml

@@ -1,5 +1,32 @@
+name: Deploy Main (Firebase Hosting)
+
+on:
+  push:
+    branches: [main]
+
 jobs:
   deploy:
-    if: false
     runs-on: ubuntu-latest
-    environment: production
+    environment: production
+
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: npm
+
+      - run: npm ci
+      - run: npm run build
+
+      - name: Install Firebase CLI
+        run: npm install --global firebase-tools
+
+      - name: Deploy to Firebase Hosting target world
+        env:
+          GOOGLE_APPLICATION_CREDENTIALS_JSON: ${{ secrets.FIREBASE_SERVICE_ACCOUNT }}
+        run: |
+          echo "$GOOGLE_APPLICATION_CREDENTIALS_JSON" > "$RUNNER_TEMP/firebase-sa.json"
+          export GOOGLE_APPLICATION_CREDENTIALS="$RUNNER_TEMP/firebase-sa.json"
+          firebase deploy --only hosting:world --project pickaapp-79307 --non-interactive

.github/workflows/linters.yml

@@ -2,7 +2,9 @@ name: Linters
 
 on:
   pull_request:
-    branches: [development, main]
+    branches: [develop, main]
+  push:
+    branches: [develop, main]
 
 env:
   FORCE_COLOR: 1
@@ -21,4 +23,4 @@ jobs:
 
       - run: npm ci
       - run: npm run lint:js
-      - run: npm run lint:css
+      - run: npm run lint:css

README.md

@@ -1,49 +1,51 @@
-# WEBPACK 5 TEMPLATE
+# world
 
-> Everything you need to start using webpack is all setup and ready to use just run the following commands to get started:
+Portfolio website for Mwila Kaunda, built with webpack and deployed to Firebase Hosting.
 
-Get started by copying and pasting the following in your terminal: 
+## Stack
 
-- 1 
-```
-git clone git@github.com:Tchilo/webpack.git
-```
-- 2
+- Node.js 20
+- webpack
+- ESLint + Stylelint
+- Firebase Hosting
 
-```
-cd webpack
-```
+## Local development
 
-- 3
-```
+```bash
 npm install
+npm start
 ```
 
-- 4
+Development server opens in your browser.
 
- This will generate a dist folder you never edit what is in there.
-```
+## Quality checks
+
+```bash
+npm run lint:js
+npm run lint:css
+npm test
 npm run build
 ```
 
+## Branch workflow
 
-- 5
+This repository is set up for Git Flow-style branching:
 
-```
-npm start
-```
-The browser will open and you should see this text : "Let's Make it Happen!", if this is not the case please stay calm and simply open your browser and paste this.
-```
-http://localhost:3000
-```
+- `main`: production
+- `develop`: integration
+- `feature/*`, `release/*`, `hotfix/*`: short-lived branches
 
+## CI/CD
 
-- 6
+GitHub Actions workflows:
 
- You can start editing the files in the "src" folder
+- `Linters`: runs JS/CSS lint on `develop` and `main`
+- `Build and Test`: runs tests and webpack build on `develop` and `main`
+- `Deploy Develop`: deploys on push to `develop`
+- `Deploy Main`: deploys on push to `main`
 
-## Happy coding! 🌈
+## Deployment prerequisites
 
-if you are interested in learning more about webpack click the link below
+Set this GitHub repository secret before deploy workflows can succeed:
 
-[click here!](https://webpack.js.org/guides/getting-started/)
+- `FIREBASE_SERVICE_ACCOUNT`: full JSON credentials for a Firebase service account with Hosting deploy permissions in project `pickaapp-79307`

package.json

@@ -1,18 +1,22 @@
 {
-  "name": "webpack-demo",
+  "name": "world-portfolio-site",
   "version": "1.0.0",
-  "description": "",
-  "private": "true",
+  "description": "Mwila World portfolio site built with webpack and deployed to Firebase Hosting.",
+  "private": true,
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
+    "test": "node --test test/*.test.js",
     "build": "webpack",
     "start": "webpack serve --open",
     "dev": "webpack --mode development",
     "lint:js": "eslint .",
     "lint:css": "stylelint \"**/*.{css,scss}\""
   },
-  "keywords": [],
-  "author": "",
+  "keywords": [
+    "portfolio",
+    "webpack",
+    "firebase-hosting"
+  ],
+  "author": "Mwila Kaunda",
   "license": "ISC",
   "devDependencies": {
     "@babel/core": "^7.28.6",

public/index.html

@@ -6,10 +6,76 @@
   <link rel="stylesheet" href="style.css">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Document</title>
+
+  <!-- ================= SEO ADDITIONS ================= -->
+
+  <title>Android & iOS App Developer | Firebase & GCP | Mwila Kaunda</title>
+
+  <meta name="description"
+    content="Senior Android and iOS app developer with 10+ years experience building production mobile, web, and cloud systems using Kotlin, Swift, Firebase, and Google Cloud Platform.">
+  <meta name="keywords"
+    content="Android App Developer, iOS App Developer, Mobile App Developer, Firebase Developer, Google Cloud Developer, Kotlin Developer, Swift Developer">
+  <meta name="author" content="Mwila Kaunda">
+
+  <link rel="canonical" href="https://mwila.world/" />
+
+  <!-- Open Graph -->
+  <meta property="og:title" content="Senior Android & iOS App Developer | Mwila Kaunda">
+  <meta property="og:description"
+    content="I build and fix production Android and iOS applications, full-stack platforms, and cloud systems using Firebase and Google Cloud.">
+  <meta property="og:type" content="website">
+  <meta property="og:url" content="https://mwila.world/">
+  <meta property="og:image"
+    content="https://firebasestorage.googleapis.com/v0/b/pickaapp-79307.appspot.com/o/public%2Fpp.jpg">
+
+  <!-- Twitter Card -->
+  <meta name="twitter:card" content="summary_large_image">
+  <meta name="twitter:title" content="Senior Android & iOS App Developer | Mwila Kaunda">
+  <meta name="twitter:description"
+    content="Production Android, iOS, web, and cloud systems built with Kotlin, Swift, Firebase, and GCP.">
+  <meta name="twitter:image"
+    content="https://firebasestorage.googleapis.com/v0/b/pickaapp-79307.appspot.com/o/public%2Fpp.jpg">
+
+  <script type="application/ld+json">
+  {
+    "@context": "https://schema.org",
+    "@type": "Person",
+    "name": "Mwila Kaunda",
+    "jobTitle": "Senior Android and iOS App Developer",
+    "url": "https://mwila.world/",
+    "sameAs": [
+      "https://github.com/swengineermwi",
+      "https://www.linkedin.com/in/mwila-k-5479b2168/",
+      "https://www.hackerrank.com/profile/mbkcust"
+    ],
+    "knowsAbout": [
+      "Android Development",
+      "iOS Development",
+      "Kotlin",
+      "Swift",
+      "Firebase",
+      "Google Cloud Platform",
+      "REST APIs",
+      "Full Stack Development"
+    ]
+  }
+  </script>
 <script defer src="main.js"></script></head>
 
-<body data-theme="">
+<body data-theme="dark">
+
+  <!-- ================= HIDDEN SEO SECTION (SAFE) ================= -->
+  <section style="position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;">
+    <h2>Android App Developer</h2>
+    <h2>iOS App Developer</h2>
+    <h2>Mobile App Development Services</h2>
+    <p>
+      Senior Android and iOS app developer building production mobile applications,
+      Firebase backends, REST APIs, and Google Cloud systems for startups and businesses.
+    </p>
+  </section>
+  <!-- ============================================================= -->
+
   <section class="socials-v3">
     <div class="container max-width-lg">
       <ul class="socials-v3__btns">
@@ -360,6 +426,7 @@ <h1 class="text-center">Interested in working together?</h1>
       </ul>
     </div>
   </section>
+
 </body>
 
 </html>

test/project-structure.test.js

@@ -0,0 +1,23 @@
+const test = require('node:test');
+const assert = require('node:assert/strict');
+const fs = require('node:fs');
+
+const requiredFiles = [
+  'src/index.html',
+  'src/index.js',
+  'src/assets/css/style.min.css',
+  'src/assets/js/scripts.js',
+  'webpack.config.js',
+  'firebase.json',
+];
+
+test('required project files exist', () => {
+  requiredFiles.forEach((filePath) => {
+    assert.equal(fs.existsSync(filePath), true, `${filePath} should exist`);
+  });
+});
+
+test('firebase hosting is configured to publish from public/', () => {
+  const firebaseConfig = JSON.parse(fs.readFileSync('firebase.json', 'utf8'));
+  assert.equal(firebaseConfig.hosting.public, 'public');
+});