Skip to content

Commit 1b01e1a

Browse files
weaponsforgeweaponsforge
authored
Merge pull request #26 from weaponsforge/dev
v2.1.1
2 parents 2a5a007 + 8c68d3e commit 1b01e1a

File tree

4 files changed

+151
-3
lines changed

4 files changed

+151
-3
lines changed

‎.dockerignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ node_modules/
22
dist/
33
.vscode
44
.git
5+
.github
56
.gitignore
67
.dockerignore
78
Dockerfile

‎.github/workflows/pull-images.yml‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
# Pull the Docker images from Docker Hub on schedule
2+
name: Pull Docker Images
3+
4+
on:
5+
schedule:
6+
# Runs "At 00:00 on day-of-month 1 in every 2nd month."
7+
- cron: '0 0 1 */2 *'
8+
9+
jobs:
10+
pull-images:
11+
name: Pull Development Images
12+
runs-on: ubuntu-latest
13+
steps:
14+
- name: Checkout the repository
15+
uses: actions/checkout@v3
16+
17+
- name: Fetch and check out latest tag
18+
run: |
19+
git fetch --tags
20+
LATEST_TAG=$(git describe --tags `git rev-list --tags --max-count=1`)
21+
echo "Checking out latest tag: $LATEST_TAG"
22+
git checkout $LATEST_TAG
23+
echo "LATEST_TAG=$LATEST_TAG" >> $GITHUB_ENV
24+
25+
- name: Pull Development Image
26+
run: docker compose -f docker-compose.dev.yml pull
27+
28+
- name: Pull Tagged Image
29+
run: |
30+
sed -i -e "s/latest/${{ env.LATEST_TAG }}/g" docker-compose.dev.yml
31+
docker compose -f docker-compose.dev.yml pull

‎.github/workflows/release.yml‎

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
name: Deploy to Production Environment
2+
3+
on:
4+
release:
5+
types: [published]
6+
7+
jobs:
8+
docker-build-push-tag:
9+
name: Push Tagged Image
10+
if: github.event.release.target_commitish == 'master' && vars.DOCKERHUB_USERNAME != ''
11+
runs-on: ubuntu-latest
12+
steps:
13+
- name: Login to Docker Hub
14+
uses: docker/login-action@v3
15+
with:
16+
username: ${{ secrets.DOCKERHUB_USERNAME }}
17+
password: ${{ secrets.DOCKERHUB_TOKEN }}
18+
- name: Checkout the repository
19+
uses: actions/checkout@v3
20+
with:
21+
ref: ${{ github.event.release.tag_name }}
22+
- name: Set release version number
23+
run: sed -i -e "s/latest/${{ github.event.release.tag_name }}/g" docker-compose.dev.yml
24+
- name: Build Image
25+
run: docker compose -f docker-compose.dev.yml build
26+
- name: Push Image to Docker Hub
27+
run: docker compose -f docker-compose.dev.yml push
28+
29+
docker-build-push:
30+
name: Push Development Image
31+
if: github.event.release.target_commitish == 'master' && vars.DOCKERHUB_USERNAME != ''
32+
runs-on: ubuntu-latest
33+
steps:
34+
- name: Login to Docker Hub
35+
uses: docker/login-action@v3
36+
with:
37+
username: ${{ secrets.DOCKERHUB_USERNAME }}
38+
password: ${{ secrets.DOCKERHUB_TOKEN }}
39+
40+
- name: Checkout the repository
41+
uses: actions/checkout@v3
42+
with:
43+
ref: ${{ github.event.release.tag_name }}
44+
45+
- name: Build Image
46+
run: docker compose -f docker-compose.dev.yml build
47+
48+
- name: Push Image to Docker Hub
49+
run: docker compose -f docker-compose.dev.yml push

‎README.md‎

Lines changed: 70 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,11 @@
22

33
Simple localhost static website development environment for plain HTML, CSS, and JavaScript files with live reload.
44

5-
Its development and static hosting and file-serving architecture are closer to traditional static web servers. Uses **Gulp** and **Browser-Sync**
5+
Its development static hosting and file-serving architecture are closer to traditional static web servers. Uses **Gulp** and **Browser-Sync**
6+
7+
> [!NOTE]
8+
> An alternate localhost static development environment, also with live reload using Webpack is available at<br>
9+
> https://github.com/weaponsforge/livereload-webpack
610
711
### Content
812

@@ -11,8 +15,10 @@ Its development and static hosting and file-serving architecture are closer to t
1115
- [Usage](#usage)
1216
- [Available Scripts](#available-scripts)
1317
- [Usage with Docker](#usage-with-docker)
18+
- [Using the Pre-Built Docker Image](#using-the-pre-built-docker-image)
1419
- [Local-Built Development Image](#local-built-development-image)
1520
- [Building Docker Images](#building-docker-images)
21+
- [Deployment with GitHub Actions](#deployment-with-github-actions)
1622
- [Debugging Notes](#debugging-notes)
1723
- [Debugging Traditional Web Apps in VSCode](#debugging-traditional-webapps-in-vscode)
1824
- [References](#references)
@@ -72,6 +78,48 @@ Starts a simple ExpressJS web server serving the static website app from its sta
7278

7379
## Usage with Docker
7480

81+
### Using the Pre-Built Docker Image
82+
83+
This project deploys the latest **development** Docker image to Docker Hub on the creation of new Release/Tags. It is available at:
84+
85+
https://hub.docker.com/r/weaponsforge/livereload-basic
86+
87+
1. Pull the pre-built development Docker image using any of the two (2) options:
88+
- Open a terminal and run:<br>
89+
`docker pull weaponsforge/livereload-basic:latest`
90+
- Navigate to the livereload-basic root project directory, then run:<br>
91+
`docker compose -f docker-compose.dev.yml pull`
92+
93+
2. Run the development image.
94+
- Using only Docker (1st option):
95+
> **INFO:** This option requires having the static website development HTML, CSS and JavaScript files inside a "/public" directory, consisting of at least:
96+
97+
```
98+
├─ my-website-project
99+
│ ├─ public
100+
│ ├─── index.html
101+
│ ├─── ...
102+
```
103+
104+
```
105+
# On Linux OS
106+
docker run -it --rm -p 3000:3000 -v $(pwd)/public:/opt/app/public -e IS_DOCKER=true weaponsforge/livereload-basic:latest
107+
108+
# On Windows OS
109+
docker run -it --rm -p 3000:3000 -v %cd%\public:/opt/app/public -e USE_POLLING=true -e IS_DOCKER=true weaponsforge/livereload-basic:latest
110+
```
111+
112+
- Using Docker compose (2nd option):<br>
113+
- `docker compose -f docker-compose.dev.yml up`
114+
- > **INFO:** Uncomment the following lines in the `docker-compose.dev.yml` file when working in a Windows host.
115+
```
116+
# Enable USE_POLLING if working in Windows WSL2 to enable hot reload
117+
environment:
118+
- IS_DOCKER=true
119+
- USE_POLLING=true
120+
```
121+
3. Refer to the [Usage](#usage) section steps **# 2 - # 4** for local development.
122+
75123
### Local-Built Development Image
76124

77125
1. Build the Docker image for local development.
@@ -91,7 +139,7 @@ Starts a simple ExpressJS web server serving the static website app from its sta
91139

92140
### Development Image
93141

94-
The **development** Docker image contains Node runtime, Gulp, Browser-Sync and yarn dependencies, and the latest repository source codes for local development. Build it with:
142+
The **development** Docker image contains Node runtime, Gulp, Browser-Sync and Yarn dependencies, and the latest repository source codes for local development. Build it with:
95143

96144
`docker compose -f docker-compose.dev.yml build`
97145

@@ -101,6 +149,25 @@ The **production** Docker image contains the static website running in an nginx
101149

102150
`docker compose -f docker-compose.prod.yml build`
103151

152+
## Deployment with GitHub Actions
153+
154+
This repository deploys the **local development** Docker image to Docker Hub on the creation of new Release/Tags.
155+
156+
Add the following GitHub Secrets and Variables to enable deployment to Docker Hub.
157+
158+
#### GitHub Secrets
159+
160+
| GitHub Secret | Description |
161+
| --- | --- |
162+
| DOCKERHUB_USERNAME | (Optional) Docker Hub username. Required to enable pushing the development image to Docker Hub. |
163+
| DOCKERHUB_TOKEN | (Optional) Deploy token for the Docker Hub account. Required to enable pushing the development image to Docker Hub. |
164+
165+
#### GitHub Variables
166+
167+
| GitHub Variable | Description |
168+
| --- | --- |
169+
| DOCKERHUB_USERNAME | (Optional) Docker Hub username. Required to enable pushing the development image to Docker Hub. |
170+
104171
## Debugging Notes
105172

106173
<details>
@@ -112,7 +179,7 @@ The **production** Docker image contains the static website running in an nginx
112179

113180
> Debugging regular (traditional) web apps with VSCode is similar to debugging and adding breakpoints from the Chrome or Edge browser's **Sources** tab.
114181
115-
> [!TIP]
182+
> **TIP**<br>
116183
> Take note of its VSCode launch settings with a `"pathMapping"` key. It is quite similar to the VSCode launch settings of [web apps launched with Webpack](https://github.com/weaponsforge/livereload-webpack#other-notes).
117184
118185
1. Add breakpoints in the JavaScript (`*.js`) files inside the website's directory entry point at the `"public/"` directory.

0 commit comments

Comments
 (0)