https://github.com/physer/nuxt-dockerize-example
A minimal NuxtJS docker image example application
https://github.com/physer/nuxt-dockerize-example
docker docker-compose nodejs nuxt nuxt-bridge nuxt2 nuxt3 nuxtjs
Last synced: about 1 year ago
JSON representation
A minimal NuxtJS docker image example application
- Host: GitHub
- URL: https://github.com/physer/nuxt-dockerize-example
- Owner: Physer
- License: apache-2.0
- Created: 2022-11-08T07:56:00.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2022-12-16T08:09:46.000Z (over 3 years ago)
- Last Synced: 2023-06-17T08:40:15.417Z (almost 3 years ago)
- Topics: docker, docker-compose, nodejs, nuxt, nuxt-bridge, nuxt2, nuxt3, nuxtjs
- Language: JavaScript
- Homepage:
- Size: 2.48 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# nuxt-dockerize-example
A minimal NuxtJS docker image example application
## Nuxt versions
The `main` branch is currently using NuxtJS version 2.
If you would like to view this application in version 3 of NuxtJS, please switch to the `nuxt-v3` branch.
## Nuxt Bridge
Nuxt Bridge is a forward-compatability layer for using NuxtJS v3 features such as Nitro on NuxtJS v2.
For more information see: https://v3.nuxtjs.org/bridge/overview/
There are two other branches available in this repository.
* The branch: `nuxt-bridge` contains a working version of Nuxt Bridge. This includes a Docker container.
* The branch: `nuxt-bridge-broken` contains a showcase of what happens when you mix Nuxt Bridge with the regular NuxtJS v2 build system. This will result in a working development environment but a broken production environment.
## Internal libraries
This applications also contains a locally built NPM module. The library is written in Typescript and transpiled to Javascript.
This module is installed as a symlink and is bundled as a `.js` file using `tsup`.
Libraries are included in the `libs` folder.
## Custom modules and server middleware
This application sports four different modules.
1. The `customModule`. This module adds a badge to the Nuxt start-up process saying the module is initialized. This is a `buildModule`.
2. The `middlewareModule`. This module logs every URL request it intercepts. This is a `module` and pushes `serverMiddleware`.
2. The `loremModule`. This module generates random lorem ipsum upon start-up using an external package: [lorem-ipsum](https://www.npmjs.com/package/lorem-ipsum). This is a `buildModule`.
2. The `uuidModule`. This module logs generates a random UUID on start-up using an external package: [uuid](https://www.npmjs.com/package/uuid). This is a `module`.
## Available pages
Currently there are 4 pages available:
1. `/` - The home page, a page with static data
2. `/ssr` - A page that dynamically renders data from an external API
3. `/env` - A page that retrieves both a public and a private environment variable and prints them on-screen
4. `/guid` - A page that prints a GUID generated by an external library
5. `/lipsum` - A page that prints some generated Lorem Ipsum from an internal library
## How to run
Copy the `.env.example` file and rename it to `.env`.
Run the following commands:
1. `npm i`
2. `npm run build`
3. `npm run start`
## Docker
### Docker Compose
The easiest way to get the application up and running is by using Docker Compose.
Simply run the command `docker-compose up -d` in the root of this repository. If you want to rebuild the image you can run the following Docker Compose command: `docker-compose up -d --build`.
This will result in two applications running:
1. The application now runs on http://localhost:3000/
### Manually building the image
1. Build the docker image by running `docker build -f .\Dockerfile . -t nuxt-dockerize-example`
2. Run the docker image by running `docker run -d -p 3000:3000 nuxt-dockerize-example`