Add ARM64 Docker Image Support (#56)

* Add Docker build commands for manually building amd64 and / or arm64 * Update GitHub actions to build docker images automatically for amd64 and arm64 * Update default configuration with new features * Update README.md
excalith · Jan 2, 2024 · 3c2d7e5 · 3c2d7e5 · vercel · Jan 2, 2024
1 parent 44416e1
commit 3c2d7e5
Show file tree

Hide file tree

Showing 6 changed files with 76 additions and 88 deletions.
diff --git a/.github/workflows/publish-development.yml b/.github/workflows/publish-development.yml
@@ -18,13 +18,19 @@ jobs:
       - name: Check out the repo
         uses: actions/checkout@v3
 
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v3
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v3
+
       - name: Log in to Docker Hub
         uses: docker/login-action@v2
         with:
           username: ${{ secrets.DOCKER_USERNAME }}
           password: ${{ secrets.DOCKER_PASSWORD }}
 
-      - name: Log in to the Container registry
+      - name: Log in to the GHCR
         uses: docker/login-action@v2
         with:
           registry: ghcr.io
@@ -33,7 +39,7 @@ jobs:
 
       - name: Extract MetaData (tags, labels) for Docker
         id: meta
-        uses: docker/build-push-action@v4
+        uses: docker/metadata-action@v4
         with:
           images: |
             excalith/start-page
@@ -47,3 +53,4 @@ jobs:
           tags: |
             excalith/start-page:${{ inputs.name }}
             ghcr.io/excalith/excalith-start-page:${{ inputs.name }}
+          platforms: linux/amd64,linux/arm64
diff --git a/.github/workflows/publish-release.yml b/.github/workflows/publish-release.yml
@@ -15,6 +15,12 @@ jobs:
       - name: Check out the repo
         uses: actions/checkout@v3
 
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v3
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v3
+
       - name: Log in to Docker Hub
         uses: docker/login-action@v2
         with:
@@ -43,3 +49,4 @@ jobs:
           push: true
           tags: ${{ steps.meta.outputs.tags }}
           labels: ${{ steps.meta.outputs.labels }}
+          platforms: linux/amd64,linux/arm64
diff --git a/Dockerfile b/Dockerfile
@@ -25,20 +25,18 @@ COPY . .
 # Next.js collects completely anonymous telemetry data about general usage.
 # Learn more here: https://nextjs.org/telemetry
 # Uncomment the following line in case you want to disable telemetry during the build.
-# ENV NEXT_TELEMETRY_DISABLED 1
+ENV NEXT_TELEMETRY_DISABLED 1
 
+# Build the node project
 RUN yarn build
 
-# If using npm comment out above and use below instead
-# RUN npm run build
-
 # Production image, copy all the files and run next
 FROM base AS runner
 WORKDIR /app
 
 ENV NODE_ENV production
 # Uncomment the following line in case you want to disable telemetry during runtime.
-# ENV NEXT_TELEMETRY_DISABLED 1
+ENV NEXT_TELEMETRY_DISABLED 1
 
 RUN addgroup --system --gid 1001 nodejs
 RUN adduser --system --uid 1001 nextjs

diff --git a/README.md b/README.md
@@ -59,64 +59,37 @@ Please refer to [configuration](https://github.com/excalith/excalith-start-page/
 
 ## Using
 
-There are multiple ways of using this app. Here is a quick preview of them. For more information please refer to [getting started](https://github.com/excalith/excalith-start-page/wiki/Getting-Started) page
+There are multiple ways of using this app explained in details on [getting started](https://github.com/excalith/excalith-start-page/wiki/Getting-Started) wiki page. Here is a TLDR:
 
 ### Fork
 
-You can fork this repository and have direct control over the source code. This is the best way to customize the start page to your liking.
+You can fork this repository and have direct control over the source code. This is the best way to customize the start page to your liking. Then you can create *Docker images*, *deploy on your server* or *serve it locally*. Check out the [Fork Wiki Page](https://github.com/excalith/excalith-start-page/wiki/Fork) for more information.
 
-1. Fork this repository
-2. Modify the `startpage.config.js` for the default configuration
-3. If you want, you can change the source code to your like as well (optional)
-4. Run `yarn dev` command to test it
-5. Host locally, create docker image, or deploy to a server
+### Docker Image
 
-### Docker
+Using a Docker image is another convenient way to use the start page. You can either use the image from Docker Hub or Github Registry. Currently supports both **amd64** and **arm64** images. Check out the [Docker Wiki Page](https://github.com/excalith/excalith-start-page/wiki/Docker) for more information.
 
-Docker is another convenient way to host the start page. You can either use the image from Docker Hub or Github Registry.
+### Online Version
+You can use the Online Version (aka. preview version) as well. However, since this is the preview of the project with constant updates, it might break your configurations. I would recommend building your own fork instead. Check out the [Online Version Wiki Page](https://github.com/excalith/excalith-start-page/wiki/Online) for more information.
 
-<details>
-<summary>Using Docker Registry</summary>
-<br>
 
-Pull the latest image
-```bash
-docker pull excalith/start-page:latest
-```
-
-Run the image (change the port mapping of 8080 into something you want)
-```bash
-docker run --name start-page --restart=always -p 8080:3000 -d excalith/start-page
-```
-</details>
-
-<details>
-<summary>Using Github Registry</summary>
-<br>
-
-Pull the latest image
-```bash
-docker pull ghcr.io/excalith/excalith-start-page:latest
-```
-
-Run the image (change the port mapping of 8080 into something you want)
-```bash
-docker run --name start-page --restart=always -p 8080:3000 -d ghcr.io/excalith/excalith-start-page
-```
-</details>
-
-### Remote Config Import
+## Customization
 
-If you still prefer to use the online version, I would recommend you to use the remote configuration import feature. This feature allows you to import your configuration from a URL. This way, you will always have a backup file of your configuration. Please refer to [getting started](https://github.com/excalith/excalith-start-page/wiki/Getting-Started) page for more information.
+This project, at its heart, supports customization to better suit your desktop environment. There are three methods to personalize the project according to your preferences:
 
-## Customization
+You can either
+- **Method 1:** Configure your **fork** by editing [startpage.config.js](https://github.com/excalith/excalith-start-page/blob/multiplatform/startpage.config.js) file
+- **Method 2:** Use `config edit` command to edit on the fly, by built-in json editor
+- **Method 3:** Use `config import <url>` command to import your remote config file from your dotfiles repository
+
+Check out the [Configuration](https://github.com/excalith/excalith-start-page/wiki/Configuration) and [Themes](https://github.com/excalith/excalith-start-page/wiki/Themes) wiki pages for more information regarding themes and configuration options.
 
-You can pretty much customize everything! Please refer to [configuration](https://github.com/excalith/excalith-start-page/wiki/Configuration) and [themes](https://github.com/excalith/excalith-start-page/wiki/Themes) pages for more information regarding themes and configuration options.
 
 ## How To Contribute
 
 Please feel free to contribute any way you can. Just keep in mind that you should pay attention to [contributing guideline](.github/CONTRIBUTING.md) before contributing.
 
+
 ## License
 
 The code is available under the [MIT license](LICENSE). Feel free to copy, modify, and distribute the code as you wish, but please keep the original license in the files. Attribution is appreciated and will definetely help improving this project.
diff --git a/package.json b/package.json
@@ -1,36 +1,39 @@
 {
-	"name": "start-page",
-	"version": "2.3.4",
-	"private": true,
-	"scripts": {
-		"dev": "next dev",
-		"start": "next start",
-		"build": "next build",
-		"export": "next export",
-		"lint": "next lint",
-		"format": "prettier . --write"
-	},
-	"devDependencies": {
-		"autoprefixer": "^10.4.16",
-		"eslint": "8.56.0",
-		"eslint-config-next": "14.0.4",
-		"eslint-config-prettier": "^9.1.0",
-		"eslint-plugin-prettier": "^5.1.2",
-		"postcss": "^8.4.32",
-		"prettier": "^3.1.1",
-		"tailwindcss": "^3.4.0"
-	},
-	"dependencies": {
-		"@fontsource/fira-code": "^5.0.16",
-		"@iconify/react": "^4.1.1",
-		"ace-builds": "^1.32.3",
-		"moment": "^2.30.1",
-		"next": "14.0.4",
-		"one-theme-ace": "^0.5.0",
-		"react": "18.2.0",
-		"react-ace": "^10.1.0",
-		"react-device-detect": "^2.2.3",
-		"react-dom": "18.2.0",
-		"react-error-boundary": "^4.0.12"
-	}
-}
+    "name": "start-page",
+    "version": "3.0.0",
+    "private": true,
+    "scripts": {
+        "dev": "next dev",
+        "start": "next start",
+        "lint": "next lint",
+        "format": "prettier . --write",
+        "export": "next export",
+        "build": "next build",
+		"docker:build:amd64": "docker buildx build --load --platform linux/amd64 -t excalith/start-page:latest .",
+		"docker:build:arm64": "docker buildx build --load --platform linux/arm64 -t excalith/start-page:latest .",
+		"docker:run": "docker run --name start-page --restart=always -p 8080:3000 -d excalith/start-page"
+    },
+    "devDependencies": {
+        "autoprefixer": "^10.4.16",
+        "eslint": "8.56.0",
+        "eslint-config-next": "14.0.4",
+        "eslint-config-prettier": "^9.1.0",
+        "eslint-plugin-prettier": "^5.1.2",
+        "postcss": "^8.4.32",
+        "prettier": "^3.1.1",
+        "tailwindcss": "^3.4.0"
+    },
+    "dependencies": {
+        "@fontsource/fira-code": "^5.0.16",
+        "@iconify/react": "^4.1.1",
+        "ace-builds": "^1.32.3",
+        "moment": "^2.30.1",
+        "next": "14.0.4",
+        "one-theme-ace": "^0.5.0",
+        "react": "18.2.0",
+        "react-ace": "^10.1.0",
+        "react-device-detect": "^2.2.3",
+        "react-dom": "18.2.0",
+        "react-error-boundary": "^4.0.12"
+    }
+}
diff --git a/startpage.config.js b/startpage.config.js
@@ -3,7 +3,7 @@ const defaultConfig = {
 	theme: {
 		backgroundColor: "#121317",
 		windowColor: "#1e212b",
-		glowColor: "#6b5cb157",
+		glowColor: "#291f3325",
 		white: "#e2e2e2",
 		gray: "#97989d",
 		black: "#16161e",
@@ -17,17 +17,17 @@ const defaultConfig = {
 		orange: "#ff8800"
 	},
 	wallpaper: {
-		url: "",
+		url: "https://raw.githubusercontent.com/excalith/.dotfiles/72154278fed732e84dd8f2dfe3f5c797bb8d91a2/assets/wallpaper/gnome-blobs.svg",
 		easing: "ease-in-out",
 		fadeIn: true,
-		blur: true
+		blur: false
 	},
 	terminal: {
 		fixedHeight: true,
 		windowGlow: true,
 		textGlow: false,
 		opacity: 1,
-		blur: 0
+		blur: 16
 	},
 	prompt: {
 		ctrlC: true,