Cleanup

README.md

@@ -1,6 +1,8 @@
 # cv
 
-Dejvino's Curriculum Vitae
+Dejvino's Curriculum Vitae in a web app.
+
+Uses React, Bootstrap and NextJs. Compiles into a static HTML/CSS/JS web page that can be easily served from any webhosting.
 
 ## Build
 
@@ -10,10 +12,19 @@ npm install
 # Development - served on http://localhost:3000/ with auto-reload
 npm run dev
 
-# Production - output in ./dist/
+# Production - output in ./out/
 npm run build
 ```
 
-## Info
+All that is needed to deploy is to copy the contents of the `./out/` folder onto any web hosting.
 
-Uses React with Bootstrap and NextJs, compiles a static HTML/CSS/JS web page that can be easily served from any webhosting.
+## Configuration
+
+### CV content
+
+- src/PersonalData.ts :: source of all data for the CV, nicely structured in a type-checked TypeScript object literal
+
+### Images
+
+- public/favicon.ico
+- public/photo.png

postcss.config.js

@@ -1,5 +0,0 @@
-module.exports = {
-  plugins: {
-    autoprefixer: {},
-  },
-}

src/app/globals.css

@@ -1,7 +1,4 @@
 
-@import 'bootstrap/dist/css/bootstrap.min.css';
-@import 'bootstrap-icons/font/bootstrap-icons.min.css';
-
 body {
     background-color: lightgrey;
 }

src/app/layout.tsx

@@ -1,7 +1,10 @@
 import React from 'react'
 import { Inter } from 'next/font/google'
 
+import 'bootstrap/dist/css/bootstrap.min.css';
+import 'bootstrap-icons/font/bootstrap-icons.min.css';
 import './globals.css'
+
 import { PersonProvider } from './hooks/PersonContext'
 import { personalData } from '../PersonalData'
 

src/js/main.js

@@ -1,11 +0,0 @@
-// Import our custom CSS
-import '../scss/styles.scss';
-
-// Import only the Bootstrap components we need
-import { Popover } from 'bootstrap';
-
-// Create an example popover
-document.querySelectorAll('[data-bs-toggle="popover"]')
-  .forEach(popover => {
-    new Popover(popover)
-  })

src/scss/_icon-list.scss

@@ -1,22 +0,0 @@
-// Example of a custom component
-
-.icon-list {
-  padding-left: 0;
-  list-style: none;
-
-  li {
-    display: flex;
-    align-items: flex-start;
-    margin-bottom: .25rem;
-
-    &::before {
-      display: block;
-      flex-shrink: 0;
-      width: 1.5em;
-      height: 1.5em;
-      margin-right: .5rem;
-      content: "";
-      background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23212529' viewBox='0 0 16 16'%3E%3Cpath d='M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z'/%3E%3C/svg%3E") no-repeat center center / 100% auto;
-    }
-  }
-}

src/scss/styles.scss

@@ -1,93 +0,0 @@
-// Override Bootstrap's Sass default variables
-//
-// Nearly all variables in Bootstrap are written with the `!default` flag.
-// This allows you to override the default values of those variables before
-// you import Bootstrap's source Sass files.
-//
-// Overriding the default variable values is the best way to customize your
-// CSS without writing _new_ styles. For example, change you can either change
-// `$body-color` or write more CSS that override's Bootstrap's CSS like so:
-// `body { color: red; }`.
-
-
-//
-// Bring in Bootstrap
-//
-
-// Option 1
-//
-// Import all of Bootstrap's CSS
-
-// @import "bootstrap/scss/bootstrap";
-
-// Option 2
-//
-// Place variable overrides first, then import just the styles you need. Note that some stylesheets are required no matter what.
-
-// Toggle global options
-$enable-gradients: true;
-$enable-shadows: true;
-
-$offcanvas-box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175);
-
-// Customize some defaults
-$body-color: #333;
-$body-bg: #fff;
-$border-radius: .4rem;
-$success: #7952b3;
-
-// Required
-@import "bootstrap/scss/functions";
-@import "bootstrap/scss/variables";
-@import "bootstrap/scss/maps";
-@import "bootstrap/scss/mixins";
-@import "bootstrap/scss/utilities";
-@import "bootstrap/scss/root";
-@import "bootstrap/scss/reboot";
-
-@import "bootstrap/scss/type";
-// @import "bootstrap/scss/images";
-@import "bootstrap/scss/containers";
-@import "bootstrap/scss/grid";
-// @import "bootstrap/scss/tables";
-// @import "bootstrap/scss/forms";
-@import "bootstrap/scss/buttons";
-@import "bootstrap/scss/transitions";
-@import "bootstrap/scss/dropdown";
-// @import "bootstrap/scss/button-group";
-// @import "bootstrap/scss/nav";
-// @import "bootstrap/scss/navbar"; // Requires nav
-// @import "bootstrap/scss/card";
-// @import "bootstrap/scss/breadcrumb";
-// @import "bootstrap/scss/accordion";
-// @import "bootstrap/scss/pagination";
-// @import "bootstrap/scss/badge";
-// @import "bootstrap/scss/alert";
-// @import "bootstrap/scss/progress";
-// @import "bootstrap/scss/list-group";
-@import "bootstrap/scss/close";
-// @import "bootstrap/scss/toasts";
-@import "bootstrap/scss/modal"; // Requires transitions
-// @import "bootstrap/scss/tooltip";
-@import "bootstrap/scss/popover";
-// @import "bootstrap/scss/carousel";
-// @import "bootstrap/scss/spinners";
-@import "bootstrap/scss/offcanvas"; // Requires transitions
-// @import "bootstrap/scss/placeholders";
-
-// Helpers
-// @import "bootstrap/scss/helpers";
-
-// Utilities
-@import "bootstrap/scss/utilities/api";
-
-
-//
-// Custom styles
-//
-
-@import "icon-list";
-
-body {
-  padding: 1.5rem;
-}

webpack.config.js

@@ -1,54 +0,0 @@
-'use strict'
-
-const path = require('path')
-const autoprefixer = require('autoprefixer')
-const HtmlWebpackPlugin = require('html-webpack-plugin')
-
-module.exports = {
-  mode: 'development',
-  entry: './src/js/main.js',
-  output: {
-    filename: 'main.js',
-    path: path.resolve(__dirname, 'dist'),
-  },
-  devServer:{
-    static: path.resolve(__dirname, 'dist'),
-    port: 8080,
-    hot: true
-  },
-  plugins: [
-    new HtmlWebpackPlugin({ template: './src/index.html' })
-  ],
-  module: {
-    rules: [
-      {
-        test: /\.(scss)$/,
-        use: [
-          {
-            // Adds CSS to the DOM by injecting a `<style>` tag
-            loader: 'style-loader'
-          },
-          {
-            // Interprets `@import` and `url()` like `import/require()` and will resolve them
-            loader: 'css-loader'
-          },
-          {
-            // Loader for webpack to process CSS with PostCSS
-            loader: 'postcss-loader',
-            options: {
-              postcssOptions: {
-                plugins: () => [
-                  autoprefixer
-                ]
-              }
-            }
-          },
-          {
-            // Loads a SASS/SCSS file and compiles it to CSS
-            loader: 'sass-loader'
-          }
-        ]
-      }
-    ]
-  }
-}