created empty nuxt project and moved assets there

Author: bram2w

.editorconfig

@@ -11,7 +11,7 @@ insert_final_newline = true
 [Makefile]
 indent_style = tab
 
-[*.{js,yml,scss,json,eslintrc,stylelintrc}]
+[*.{js,yml,scss,json,eslintrc,stylelintrc,vue}]
 indent_size = 2
 
 [*.md]

.gitignore

@@ -1,8 +1,84 @@
 .DS_Store
-.tmp
-.sass-cache
 .idea
-npm-debug.log
-yarn-error.log
-node_modules
-web-frontend/_build
+
+# Created by .ignore support plugin (hsz.mobi)
+### Node template
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# TypeScript v1 declaration files
+typings/
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
+
+# parcel-bundler cache (https://parceljs.org/)
+.cache
+
+# next.js build output
+.next
+
+# nuxt.js build output
+.nuxt
+
+# Nuxt generate
+dist
+
+# vuepress build output
+.vuepress/dist
+
+# Serverless directories
+.serverless
+
+# Service worker
+sw.*

.gitlab-ci.yml

@@ -4,17 +4,23 @@ before_script:
   - apt-get update && apt-get -y install make curl gnupg2
 
 stages:
-  - lint
-  - build
+  - web-frontend-lint
+  - web-frontend-test
 
-eslint:
-  stage: lint
+web-frontend-eslint:
+  stage: web-frontend-lint
   script:
     - make install-web-frontend-dependencies
-    - (cd web-frontend && yarn eslint)
+    - (cd web-frontend && yarn run eslint)
 
-stylelint:
-  stage: lint
+web-frontend-stylelint:
+  stage: web-frontend-lint
   script:
     - make install-web-frontend-dependencies
-    - (cd web-frontend && yarn stylelint)
+    - (cd web-frontend && yarn run stylelint)
+
+web-frontend-test:
+  stage: web-frontend-test
+  script:
+    - make install-web-frontend-dependencies
+    - (cd web-frontend && yarn run test)

README.md

@@ -3,14 +3,32 @@
 To first start Baserow make sure you have installed docker and docker-compose. After that execute the following commands.
 
 ```
-docker network create baserow_default
-docker-compose up -d
+$ docker network create baserow_default
+$ docker-compose up -d
 ```
 
-For now it's only possible to work on the frontend SCSS components. In order to do so you can execute the commands below and then visit http://localhost:8080 in your browser.
+In order to start developing for the web frontend you need to execute the following commands.
 
 ```
-docker exec -it baserow bash
-cd /baserow/web-frontend
-yarn dev
+# install web frontend dependencies
+$ docker exec -it baserow bash
+$ cd /baserow/web-frontend
+$ yarn install
+$ yarn run dev
+
+# build for production and launch server
+$ yarn run build
+$ yarn start
+
+# generate static project
+$ yarn run generate
+
+# lint
+$ yarn run eslint
+$ yarn run stylelint
+
+# test
+$ yarn run test
 ```
+
+When the development server starts you can visit http://localhost:3000.

docker-compose.yml

@@ -7,9 +7,10 @@ services:
     volumes:
       - .:/baserow
     ports:
+      - 3000:3000
       - 8080:8080
 
 networks:
   default:
     external:
-      name: baserow_default
+      name: baserow_default

old-web-frontend/package.json

@@ -0,0 +1,59 @@
+{
+  "name": "baserow-web-frontend",
+  "title": "Baserow web frontend",
+  "description": "",
+  "url": "URL",
+  "author": "Bram Wiepjes (Cloud 3)",
+  "copyright": "2019",
+  "version": "1.0.0",
+  "main": "",
+  "repository": {
+    "type": "git",
+    "url": "https://gitlab.com/bramw/baserow"
+  },
+  "scripts": {
+    "build": "webpack -p --progress --config webpack/webpack.prod.js",
+    "dev": "webpack-dev-server -d --progress --color --open --config webpack/webpack.dev.js"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.2.2",
+    "@babel/preset-env": "^7.2.2",
+    "autoprefixer": "^8.6.2",
+    "babel-eslint": "^8.2.3",
+    "babel-loader": "^8.0.5",
+    "clean-webpack-plugin": "^0.1.19",
+    "copy-webpack-plugin": "^4.5.1",
+    "css-loader": "^0.28.11",
+    "eslint": "^4.19.1",
+    "eslint-config-airbnb-base": "^12.1.0",
+    "eslint-loader": "^2.0.0",
+    "eslint-plugin-import": "^2.12.0",
+    "extract-text-webpack-plugin": "^4.0.0-beta.0",
+    "file-loader": "^1.1.11",
+    "html-webpack-plugin": "^3.2.0",
+    "node-sass": "^4.9.0",
+    "postcss-loader": "^2.1.5",
+    "prettier-eslint": "^8.8.1",
+    "raw-loader": "^0.5.1",
+    "sass-loader": "^7.0.3",
+    "style-loader": "^0.21.0",
+    "stylelint": "^9.2.1",
+    "stylelint-config-standard": "^18.2.0",
+    "uglifyjs-webpack-plugin": "^1.2.5",
+    "url-loader": "^1.0.1",
+    "webpack": "^4.12.0",
+    "webpack-cli": "^3.0.3",
+    "webpack-dev-server": "^3.1.4",
+    "webpack-merge": "^4.1.2"
+  },
+  "keywords": [
+    "webpack",
+    "babel",
+    "es6",
+    "eslint"
+  ],
+  "dependencies": {
+    "@fortawesome/fontawesome-free": "^5.7.2",
+    "normalize.css": "^8.0.1"
+  }
+}

web-frontend/public/grid.html old-web-frontend/public/grid.html

@@ -2,10 +2,10 @@
 <html>
     <head>
         <meta charset="utf-8" />
-        <link rel="icon" type="image/png" href="assets/img/favicon_16.png" sizes="16x16" />
-        <link rel="icon" type="image/png" href="assets/img/favicon_32.png" sizes="32x32" />
-        <link rel="icon" type="image/png" href="assets/img/favicon_48.png" sizes="48x48" />
-        <link rel="icon" type="image/png" href="assets/img/favicon_48.png" sizes="192x192" />
+        <link rel="icon" type="image/png" href="../../web-frontend/static/img/favicon_16.png" sizes="16x16" />
+        <link rel="icon" type="image/png" href="../../web-frontend/static/img/favicon_32.png" sizes="32x32" />
+        <link rel="icon" type="image/png" href="../../web-frontend/static/img/favicon_48.png" sizes="48x48" />
+        <link rel="icon" type="image/png" href="../../web-frontend/static/img/favicon_48.png" sizes="192x192" />
         <title>Baserow</title>
     </head>
     <body>
@@ -98,7 +98,7 @@
                 <div class="sidebar-content-wrapper">
                     <nav class="sidebar-content">
                         <div class="sidebar-title">
-                            <img src="assets/img/logo.svg" alt="" />
+                            <img src="../../web-frontend/static/img/logo.svg" alt="" />
                         </div>
                         <div class="sidebar-group-title">Group name 1</div>
                         <ul class="tree">

web-frontend/public/index.html old-web-frontend/public/index.html

@@ -2,10 +2,10 @@
 <html>
     <head>
         <meta charset="utf-8" />
-        <link rel="icon" type="image/png" href="assets/img/favicon_16.png" sizes="16x16" />
-        <link rel="icon" type="image/png" href="assets/img/favicon_32.png" sizes="32x32" />
-        <link rel="icon" type="image/png" href="assets/img/favicon_48.png" sizes="48x48" />
-        <link rel="icon" type="image/png" href="assets/img/favicon_48.png" sizes="192x192" />
+        <link rel="icon" type="image/png" href="../../web-frontend/static/img/favicon_16.png" sizes="16x16" />
+        <link rel="icon" type="image/png" href="../../web-frontend/static/img/favicon_32.png" sizes="32x32" />
+        <link rel="icon" type="image/png" href="../../web-frontend/static/img/favicon_48.png" sizes="48x48" />
+        <link rel="icon" type="image/png" href="../../web-frontend/static/img/favicon_48.png" sizes="192x192" />
         <title>Baserow</title>
     </head>
     <body>

web-frontend/public/login.html old-web-frontend/public/login.html

@@ -2,10 +2,10 @@
 <html>
     <head>
         <meta charset="utf-8" />
-        <link rel="icon" type="image/png" href="assets/img/favicon_16.png" sizes="16x16" />
-        <link rel="icon" type="image/png" href="assets/img/favicon_32.png" sizes="32x32" />
-        <link rel="icon" type="image/png" href="assets/img/favicon_48.png" sizes="48x48" />
-        <link rel="icon" type="image/png" href="assets/img/favicon_48.png" sizes="192x192" />
+        <link rel="icon" type="image/png" href="../../web-frontend/static/img/favicon_16.png" sizes="16x16" />
+        <link rel="icon" type="image/png" href="../../web-frontend/static/img/favicon_32.png" sizes="32x32" />
+        <link rel="icon" type="image/png" href="../../web-frontend/static/img/favicon_48.png" sizes="48x48" />
+        <link rel="icon" type="image/png" href="../../web-frontend/static/img/favicon_48.png" sizes="192x192" />
         <title>Login</title>
     </head>
     <body class="page-login">
@@ -15,7 +15,7 @@
             <!-- login page -->
             <div class="box login-page login-page-login">
                 <h1 class="box-title">
-                    <img src="assets/img/logo.svg" alt="" />
+                    <img src="../../web-frontend/static/img/logo.svg" alt="" />
                 </h1>
                 <div class="alert alert-error alert-has-icon">
                     <div class="alert-icon">

old-web-frontend/src/index.js

@@ -0,0 +1 @@
+import '../../web-frontend/assets/scss/default.scss';

web-frontend/webpack/config.js old-web-frontend/webpack/config.js

@@ -28,10 +28,7 @@ const modules = {
           options: {
             presets: ['@babel/preset-env'],
           },
-        },
-        {
-          loader: 'eslint-loader',
-        },
+        }
       ],
     },
     {