Verified Commit 3b456ed9 authored by Sandro Lutz's avatar Sandro Lutz
Browse files

Add devcontainer

parent 41ee28d5
# [Choice] Node.js version: 14, 12, 10
ARG VARIANT=14
FROM mcr.microsoft.com/vscode/devcontainers/javascript-node:${VARIANT}
# [Optional] Uncomment this section to install additional OS packages.
# RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \
# && apt-get -y install --no-install-recommends <your-package-list-here>
# [Optional] Uncomment if you want to install an additional version of node using nvm
# ARG EXTRA_NODE_VERSION=10
# RUN su node -c "source /usr/local/share/nvm/nvm.sh && nvm install ${EXTRA_NODE_VERSION}"
# [Optional] Uncomment if you want to install more global node modules
RUN sudo -u node yarn global add gatsby-cli
EXPOSE 8000
{
"name": "amiv-website",
"build": {
"dockerfile": "Dockerfile",
"args": {
"VARIANT": "14"
}
},
// Container specific settings only.
"settings": {
"terminal.integrated.shell.linux": "/bin/bash"
},
"extensions": [
"dbaeumer.vscode-eslint",
"esbenp.prettier-vscode",
"eamodio.gitlens"
],
"forwardPorts": [8000],
"postCreateCommand": "yarn install",
"containerEnv": {
"GATSBY_TELEMETRY_DISABLED": "1"
},
"remoteUser": "node"
}
FROM node:13.8
WORKDIR /app
# Copy dependency list
ADD ./package.json /app/
ADD ./package-lock.json /app/
# Install dependencies
RUN npm install -g gatsby-cli
RUN npm install
# Clean up app directory
RUN rm /app/package.json /app/package-lock.json
VOLUME [ "/app" ]
EXPOSE 8000
CMD [ "gatsby", "develop", "--host=0.0.0.0" ]
......@@ -18,21 +18,24 @@ This is the home of the amiv website.
You can visit the website now at http://localhost:8000
2. **Development with Docker**
2. **Development with Devcontainer (VSCode)**
You can run the development server completely with docker.
You can run the prepared development environment with docker and VSCode without the need to install anything project-specific on your system.
Build local development image
Requirements:
```shell
docker build -t amiv-website-local-dev -f Dockerfile.development .
```
* *(Windows only)* [Windows Subsystem for Linux (WSL)](https://docs.microsoft.com/en-us/windows/wsl/)
* [Docker Engine](https://docs.docker.com/engine/install/)
* [Visual Studio Code](https://code.visualstudio.com/)(VSCode)
* [Remote Development Extension Pack for VSCode](https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.vscode-remote-extensionpack)
Run development server with
Open the project directory with the prepared devcontainer by clicking the green button in the left button corner of the VSCode window and select `Remote-Containers: Open Folder in Container...`.
```shell
docker run --rm -it -p 8000:8000 -v ${PWD}:/app amiv-website-local-dev
```
On startup, `yarn install` is run automatically. You can start the gatsby development process with `gatsby develop`.
You can visit the website now at http://localhost:8000
**IMPORTANT:** You also have to run the backend project on your machine! It is not possible to use an externally hosted backend.
3. **Linting & Formatting**
......@@ -117,23 +120,23 @@ TODO: Add information about the deployment process of the project.
### Frontend Frameworks & Libraries
* [Gatsby](https://www.gatsbyjs.org)
* [React](https://reactjs.org/)
* [react-intl](https://github.com/formatjs/react-intl)
* [React-Redux](https://react-redux.js.org/)
- [Gatsby](https://www.gatsbyjs.org)
- [React](https://reactjs.org/)
- [react-intl](https://github.com/formatjs/react-intl)
- [React-Redux](https://react-redux.js.org/)
### Backend
* [AMIV API](https://github.com/amiv-eth/amivapi)
- [AMIV API](https://github.com/amiv-eth/amivapi)
### Build Tools
* [NPM](https://www.npmjs.com/)
* [gatsby-cli](https://www.npmjs.com/package/gatsby-cli)
- [NPM](https://www.npmjs.com/)
- [gatsby-cli](https://www.npmjs.com/package/gatsby-cli)
### Development Tools
* [ESlint](https://github.com/eslint/eslint)
* [Prettier](https://github.com/prettier/prettier)
- [ESlint](https://github.com/eslint/eslint)
- [Prettier](https://github.com/prettier/prettier)
Most IDEs have plugins for those tools. VS Code is the recommended IDE.
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment