diff --git a/README.md b/README.md
index f401937..4cd4b36 100644
--- a/README.md
+++ b/README.md
@@ -8,6 +8,10 @@ Its development static hosting and file-serving architecture are closer to tradi
> An alternate localhost static development environment using **Webpack**, also with live reload, is available at
> https://github.com/weaponsforge/livereload-webpack
+> [!TIP]
+> Are you using **VSCode** and **want to do live reload** but **do not want to install livereload-basic's Node dependencies** or **run it using Docker**?
+> [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer) might be the tool for you. Check it out from from the Visual Studio Marketplace.
+
### Content
- [Dependencies](#dependencies)
@@ -56,15 +60,18 @@ These steps use **Node** and **Yarn** to run the development app.
1. Run the localhost static website development environment.
`yarn dev`
-2. Edit the existing static files from the **./public** directory and wait for live reload. Your updates will reflect on the web browser.
+2. Launch the local development website at:
+`http://localhost:3000`
+
+3. Edit the existing static files from the **./public** directory and wait for live reload. Your updates will reflect on the web browser.
-3. To include new static website files on live reload:
+4. To include new static website files on live reload:
- Create new static (.html, .js, .css) files inside the **./public** directory.
- Refresh the web browser.
- Restart the web server if updates don't show after a while.
`yarn dev`
-4. Run the production static website (does not use live reload).
+5. Run the production static website (does not use live reload).
`yarn start`
## Available Scripts
@@ -90,9 +97,9 @@ This project deploys the latest **development** Docker image to Docker Hub on th
https://hub.docker.com/r/weaponsforge/livereload-basic
-1. Pull the pre-built development Docker image using any of the two (2) options:
+1. Pull the "latest" pre-built development Docker image using any of the two (2) options:
- Open a terminal and run:
- `docker pull weaponsforge/livereload-basic:latest`
+ `docker pull weaponsforge/livereload-basic`
- Navigate to the livereload-basic root project directory, then run:
`docker compose -f docker-compose.dev.yml pull`
@@ -108,24 +115,35 @@ https://hub.docker.com/r/weaponsforge/livereload-basic
```
Navigate to the root project directory (for example, `"my-website-project"`) using a terminal, then run:
- ```
+ ```bash
# On Linux OS
- docker run -it --rm -p 3000:3000 -v $(pwd)/FILE_DIRECTORY:/opt/app/public weaponsforge/livereload-basic:latest
+ docker run -it --rm -p 3000:3000 -v $(pwd)/FILE_DIRECTORY:/opt/app/public weaponsforge/livereload-basic
- # On Windows OS
- docker run -it --rm -p 3000:3000 -v %cd%\FILE_DIRECTORY:/opt/app/public -e USE_POLLING=true weaponsforge/livereload-basic:latest
+ # On Windows OS (Command Prompt)
+ docker run -it --rm -p 3000:3000 -v %cd%\FILE_DIRECTORY:/opt/app/public -e USE_POLLING=true weaponsforge/livereload-basic
```
- > _**TIP:**
- > Replace `-p 3000:3000` with other port bindings as needed._
+ > 💡**TIP:**
+ > _To use other port bindings aside from the default `3000`:_
+ > 1. Add a `PORT` environment variable eg., `-e PORT=3003`
+ > 2. Replace `-p 3000:3000` with the `PORT` environment variable.
- Using Docker compose (2nd option):
- `docker compose -f docker-compose.dev.yml up`
- - > **INFO:** Uncomment the following lines in the `docker-compose.dev.yml` file when working in a Windows host.
+ - > **INFO:** Uncomment the following lines in the `docker-compose.dev.yml` file when working in a **Windows host**.
+ ```yml
+ environment:
+ # Enable USE_POLLING if working in Windows WSL2 to enable live reload
+ - USE_POLLING=true
```
- # Enable USE_POLLING if working in Windows WSL2 to enable live reload
- environment:
- - USE_POLLING=true
+ - > **INFO:** Enable using **other ports** - uncomment the following lines in the `docker-compose.dev.yml` and expose the new port under the `"ports"` section.
+ ```yml
+ ports:
+ - "3002:3002"
+ environment:
+ # Use other ports aside from the 3000 default
+ # Ensure to map and expose this port under the "ports" section eg., -"3002:3002"
+ - PORT=3002
```
3. Refer to the [Usage](#usage) section steps **# 2 - # 4** for local development.
@@ -154,7 +172,7 @@ The **development** Docker image contains Node runtime, Gulp, Browser-Sync and Y
### Production Image
-The **production** Docker image contains the static website running in an nginx container for minimal production website build. Build it with:
+The **production** Docker image contains the static website running in an Nginx container for minimal production website build. Build it with:
`docker compose -f docker-compose.prod.yml build`
diff --git a/docker-compose.dev.yml b/docker-compose.dev.yml
index fcff323..76e390c 100644
--- a/docker-compose.dev.yml
+++ b/docker-compose.dev.yml
@@ -12,6 +12,10 @@ services:
ports:
- "3000:3000"
- "9229:9229"
- # Enable USE_POLLING if working in Windows WSL2 to enable live reload
# environment:
+ # Enable USE_POLLING if working in Windows WSL2 to enable live reload
# - USE_POLLING=true
+ #
+ # Use other ports aside from the default 3000
+ # Ensure to map and expose this port under the "ports" section eg., -"3002:3002"
+ # - PORT=3002