mirror of
https://github.com/jcreek/jcreek.github.io.git
synced 2026-07-12 18:43:50 +00:00
Merge pull request #17 from jcreek/16-refactor-site-to-use-mkdocs
16 refactor site to use mkdocs
This commit is contained in:
Josh Creek
@@ -0,0 +1,20 @@
|
||||
name: ci
|
||||
on:
|
||||
push:
|
||||
branches:
|
||||
- master
|
||||
- main
|
||||
jobs:
|
||||
deploy:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@v2
|
||||
- uses: actions/setup-python@v2
|
||||
with:
|
||||
python-version: 3.x
|
||||
- uses: actions/cache@v2
|
||||
with:
|
||||
key: ${{ github.ref }}
|
||||
path: .cache
|
||||
- run: pip install mkdocs-material
|
||||
- run: mkdocs gh-deploy --force
|
||||
@@ -1 +1,3 @@
|
||||
node_modules
|
||||
site
|
||||
.cache
|
||||
@@ -1,5 +0,0 @@
|
||||
_site
|
||||
.sass-cache
|
||||
.jekyll-cache
|
||||
.jekyll-metadata
|
||||
vendor
|
||||
@@ -1,25 +0,0 @@
|
||||
---
|
||||
permalink: /404.html
|
||||
layout: default
|
||||
---
|
||||
|
||||
<style type="text/css" media="screen">
|
||||
.container {
|
||||
margin: 10px auto;
|
||||
max-width: 600px;
|
||||
text-align: center;
|
||||
}
|
||||
h1 {
|
||||
margin: 30px 0;
|
||||
font-size: 4em;
|
||||
line-height: 1;
|
||||
letter-spacing: -1px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="container">
|
||||
<h1>404</h1>
|
||||
|
||||
<p><strong>Page not found :(</strong></p>
|
||||
<p>The requested page could not be found.</p>
|
||||
</div>
|
||||
@@ -1,35 +0,0 @@
|
||||
source "https://rubygems.org"
|
||||
# Hello! This is where you manage which Jekyll version is used to run.
|
||||
# When you want to use a different version, change it below, save the
|
||||
# file and run `bundle install`. Run Jekyll with `bundle exec`, like so:
|
||||
#
|
||||
# bundle exec jekyll serve
|
||||
#
|
||||
# This will help ensure the proper Jekyll version is running.
|
||||
# Happy Jekylling!
|
||||
gem "jekyll", "~> 3.9.0"
|
||||
# This is the default theme for new Jekyll sites. You may change this to anything you like.
|
||||
gem "minima", "~> 2.5"
|
||||
# If you want to use GitHub Pages, remove the "gem "jekyll"" above and
|
||||
# uncomment the line below. To upgrade, run `bundle update github-pages`.
|
||||
gem "github-pages", "~> 215", group: :jekyll_plugins
|
||||
# If you have any plugins, put them here!
|
||||
group :jekyll_plugins do
|
||||
gem "jekyll-feed", "~> 0.12"
|
||||
end
|
||||
|
||||
# Windows and JRuby does not include zoneinfo files, so bundle the tzinfo-data gem
|
||||
# and associated library.
|
||||
platforms :mingw, :x64_mingw, :mswin, :jruby do
|
||||
gem "tzinfo", "~> 1.2"
|
||||
gem "tzinfo-data"
|
||||
end
|
||||
|
||||
# Performance-booster for watching directories on Windows
|
||||
gem "wdm", "~> 0.1.1", :platforms => [:mingw, :x64_mingw, :mswin]
|
||||
|
||||
# No longer bundled file, required for serving the blog locally
|
||||
gem "webrick"
|
||||
|
||||
# Add the theme I like
|
||||
gem "just-the-docs"
|
||||
@@ -1,298 +0,0 @@
|
||||
GEM
|
||||
remote: https://rubygems.org/
|
||||
specs:
|
||||
activesupport (6.0.4)
|
||||
concurrent-ruby (~> 1.0, >= 1.0.2)
|
||||
i18n (>= 0.7, < 2)
|
||||
minitest (~> 5.1)
|
||||
tzinfo (~> 1.1)
|
||||
zeitwerk (~> 2.2, >= 2.2.2)
|
||||
addressable (2.8.0)
|
||||
public_suffix (>= 2.0.2, < 5.0)
|
||||
coffee-script (2.4.1)
|
||||
coffee-script-source
|
||||
execjs
|
||||
coffee-script-source (1.11.1)
|
||||
colorator (1.1.0)
|
||||
commonmarker (0.17.13)
|
||||
ruby-enum (~> 0.5)
|
||||
concurrent-ruby (1.1.9)
|
||||
dnsruby (1.61.7)
|
||||
simpleidn (~> 0.1)
|
||||
em-websocket (0.5.2)
|
||||
eventmachine (>= 0.12.9)
|
||||
http_parser.rb (~> 0.6.0)
|
||||
ethon (0.14.0)
|
||||
ffi (>= 1.15.0)
|
||||
eventmachine (1.2.7)
|
||||
eventmachine (1.2.7-x64-mingw32)
|
||||
execjs (2.8.1)
|
||||
faraday (1.5.1)
|
||||
faraday-em_http (~> 1.0)
|
||||
faraday-em_synchrony (~> 1.0)
|
||||
faraday-excon (~> 1.1)
|
||||
faraday-httpclient (~> 1.0.1)
|
||||
faraday-net_http (~> 1.0)
|
||||
faraday-net_http_persistent (~> 1.1)
|
||||
faraday-patron (~> 1.0)
|
||||
multipart-post (>= 1.2, < 3)
|
||||
ruby2_keywords (>= 0.0.4)
|
||||
faraday-em_http (1.0.0)
|
||||
faraday-em_synchrony (1.0.0)
|
||||
faraday-excon (1.1.0)
|
||||
faraday-httpclient (1.0.1)
|
||||
faraday-net_http (1.0.1)
|
||||
faraday-net_http_persistent (1.1.0)
|
||||
faraday-patron (1.0.0)
|
||||
ffi (1.15.3)
|
||||
ffi (1.15.3-x64-mingw32)
|
||||
forwardable-extended (2.6.0)
|
||||
gemoji (3.0.1)
|
||||
github-pages (215)
|
||||
github-pages-health-check (= 1.17.2)
|
||||
jekyll (= 3.9.0)
|
||||
jekyll-avatar (= 0.7.0)
|
||||
jekyll-coffeescript (= 1.1.1)
|
||||
jekyll-commonmark-ghpages (= 0.1.6)
|
||||
jekyll-default-layout (= 0.1.4)
|
||||
jekyll-feed (= 0.15.1)
|
||||
jekyll-gist (= 1.5.0)
|
||||
jekyll-github-metadata (= 2.13.0)
|
||||
jekyll-mentions (= 1.6.0)
|
||||
jekyll-optional-front-matter (= 0.3.2)
|
||||
jekyll-paginate (= 1.1.0)
|
||||
jekyll-readme-index (= 0.3.0)
|
||||
jekyll-redirect-from (= 0.16.0)
|
||||
jekyll-relative-links (= 0.6.1)
|
||||
jekyll-remote-theme (= 0.4.3)
|
||||
jekyll-sass-converter (= 1.5.2)
|
||||
jekyll-seo-tag (= 2.7.1)
|
||||
jekyll-sitemap (= 1.4.0)
|
||||
jekyll-swiss (= 1.0.0)
|
||||
jekyll-theme-architect (= 0.1.1)
|
||||
jekyll-theme-cayman (= 0.1.1)
|
||||
jekyll-theme-dinky (= 0.1.1)
|
||||
jekyll-theme-hacker (= 0.1.2)
|
||||
jekyll-theme-leap-day (= 0.1.1)
|
||||
jekyll-theme-merlot (= 0.1.1)
|
||||
jekyll-theme-midnight (= 0.1.1)
|
||||
jekyll-theme-minimal (= 0.1.1)
|
||||
jekyll-theme-modernist (= 0.1.1)
|
||||
jekyll-theme-primer (= 0.5.4)
|
||||
jekyll-theme-slate (= 0.1.1)
|
||||
jekyll-theme-tactile (= 0.1.1)
|
||||
jekyll-theme-time-machine (= 0.1.1)
|
||||
jekyll-titles-from-headings (= 0.5.3)
|
||||
jemoji (= 0.12.0)
|
||||
kramdown (= 2.3.1)
|
||||
kramdown-parser-gfm (= 1.1.0)
|
||||
liquid (= 4.0.3)
|
||||
mercenary (~> 0.3)
|
||||
minima (= 2.5.1)
|
||||
nokogiri (>= 1.10.4, < 2.0)
|
||||
rouge (= 3.26.0)
|
||||
terminal-table (~> 1.4)
|
||||
github-pages-health-check (1.17.2)
|
||||
addressable (~> 2.3)
|
||||
dnsruby (~> 1.60)
|
||||
octokit (~> 4.0)
|
||||
public_suffix (>= 2.0.2, < 5.0)
|
||||
typhoeus (~> 1.3)
|
||||
html-pipeline (2.14.0)
|
||||
activesupport (>= 2)
|
||||
nokogiri (>= 1.4)
|
||||
http_parser.rb (0.6.0)
|
||||
i18n (0.9.5)
|
||||
concurrent-ruby (~> 1.0)
|
||||
jekyll (3.9.0)
|
||||
addressable (~> 2.4)
|
||||
colorator (~> 1.0)
|
||||
em-websocket (~> 0.5)
|
||||
i18n (~> 0.7)
|
||||
jekyll-sass-converter (~> 1.0)
|
||||
jekyll-watch (~> 2.0)
|
||||
kramdown (>= 1.17, < 3)
|
||||
liquid (~> 4.0)
|
||||
mercenary (~> 0.3.3)
|
||||
pathutil (~> 0.9)
|
||||
rouge (>= 1.7, < 4)
|
||||
safe_yaml (~> 1.0)
|
||||
jekyll-avatar (0.7.0)
|
||||
jekyll (>= 3.0, < 5.0)
|
||||
jekyll-coffeescript (1.1.1)
|
||||
coffee-script (~> 2.2)
|
||||
coffee-script-source (~> 1.11.1)
|
||||
jekyll-commonmark (1.3.1)
|
||||
commonmarker (~> 0.14)
|
||||
jekyll (>= 3.7, < 5.0)
|
||||
jekyll-commonmark-ghpages (0.1.6)
|
||||
commonmarker (~> 0.17.6)
|
||||
jekyll-commonmark (~> 1.2)
|
||||
rouge (>= 2.0, < 4.0)
|
||||
jekyll-default-layout (0.1.4)
|
||||
jekyll (~> 3.0)
|
||||
jekyll-feed (0.15.1)
|
||||
jekyll (>= 3.7, < 5.0)
|
||||
jekyll-gist (1.5.0)
|
||||
octokit (~> 4.2)
|
||||
jekyll-github-metadata (2.13.0)
|
||||
jekyll (>= 3.4, < 5.0)
|
||||
octokit (~> 4.0, != 4.4.0)
|
||||
jekyll-mentions (1.6.0)
|
||||
html-pipeline (~> 2.3)
|
||||
jekyll (>= 3.7, < 5.0)
|
||||
jekyll-optional-front-matter (0.3.2)
|
||||
jekyll (>= 3.0, < 5.0)
|
||||
jekyll-paginate (1.1.0)
|
||||
jekyll-readme-index (0.3.0)
|
||||
jekyll (>= 3.0, < 5.0)
|
||||
jekyll-redirect-from (0.16.0)
|
||||
jekyll (>= 3.3, < 5.0)
|
||||
jekyll-relative-links (0.6.1)
|
||||
jekyll (>= 3.3, < 5.0)
|
||||
jekyll-remote-theme (0.4.3)
|
||||
addressable (~> 2.0)
|
||||
jekyll (>= 3.5, < 5.0)
|
||||
jekyll-sass-converter (>= 1.0, <= 3.0.0, != 2.0.0)
|
||||
rubyzip (>= 1.3.0, < 3.0)
|
||||
jekyll-sass-converter (1.5.2)
|
||||
sass (~> 3.4)
|
||||
jekyll-seo-tag (2.7.1)
|
||||
jekyll (>= 3.8, < 5.0)
|
||||
jekyll-sitemap (1.4.0)
|
||||
jekyll (>= 3.7, < 5.0)
|
||||
jekyll-swiss (1.0.0)
|
||||
jekyll-theme-architect (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-cayman (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-dinky (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-hacker (0.1.2)
|
||||
jekyll (> 3.5, < 5.0)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-leap-day (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-merlot (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-midnight (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-minimal (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-modernist (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-primer (0.5.4)
|
||||
jekyll (> 3.5, < 5.0)
|
||||
jekyll-github-metadata (~> 2.9)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-slate (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-tactile (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-time-machine (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-titles-from-headings (0.5.3)
|
||||
jekyll (>= 3.3, < 5.0)
|
||||
jekyll-watch (2.2.1)
|
||||
listen (~> 3.0)
|
||||
jemoji (0.12.0)
|
||||
gemoji (~> 3.0)
|
||||
html-pipeline (~> 2.2)
|
||||
jekyll (>= 3.0, < 5.0)
|
||||
just-the-docs (0.3.3)
|
||||
jekyll (>= 3.8.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
rake (>= 12.3.1, < 13.1.0)
|
||||
kramdown (2.3.1)
|
||||
rexml
|
||||
kramdown-parser-gfm (1.1.0)
|
||||
kramdown (~> 2.0)
|
||||
liquid (4.0.3)
|
||||
listen (3.5.1)
|
||||
rb-fsevent (~> 0.10, >= 0.10.3)
|
||||
rb-inotify (~> 0.9, >= 0.9.10)
|
||||
mercenary (0.3.6)
|
||||
minima (2.5.1)
|
||||
jekyll (>= 3.5, < 5.0)
|
||||
jekyll-feed (~> 0.9)
|
||||
jekyll-seo-tag (~> 2.1)
|
||||
minitest (5.14.4)
|
||||
multipart-post (2.1.1)
|
||||
nokogiri (1.13.6-x64-mingw32)
|
||||
racc (~> 1.4)
|
||||
nokogiri (1.13.6-x86_64-linux)
|
||||
racc (~> 1.4)
|
||||
octokit (4.21.0)
|
||||
faraday (>= 0.9)
|
||||
sawyer (~> 0.8.0, >= 0.5.3)
|
||||
pathutil (0.16.2)
|
||||
forwardable-extended (~> 2.6)
|
||||
public_suffix (4.0.6)
|
||||
racc (1.6.0)
|
||||
rake (13.0.6)
|
||||
rb-fsevent (0.11.0)
|
||||
rb-inotify (0.10.1)
|
||||
ffi (~> 1.0)
|
||||
rexml (3.2.5)
|
||||
rouge (3.26.0)
|
||||
ruby-enum (0.9.0)
|
||||
i18n
|
||||
ruby2_keywords (0.0.4)
|
||||
rubyzip (2.3.2)
|
||||
safe_yaml (1.0.5)
|
||||
sass (3.7.4)
|
||||
sass-listen (~> 4.0.0)
|
||||
sass-listen (4.0.0)
|
||||
rb-fsevent (~> 0.9, >= 0.9.4)
|
||||
rb-inotify (~> 0.9, >= 0.9.7)
|
||||
sawyer (0.8.2)
|
||||
addressable (>= 2.3.5)
|
||||
faraday (> 0.8, < 2.0)
|
||||
simpleidn (0.2.1)
|
||||
unf (~> 0.1.4)
|
||||
terminal-table (1.8.0)
|
||||
unicode-display_width (~> 1.1, >= 1.1.1)
|
||||
thread_safe (0.3.6)
|
||||
typhoeus (1.4.0)
|
||||
ethon (>= 0.9.0)
|
||||
tzinfo (1.2.10)
|
||||
thread_safe (~> 0.1)
|
||||
tzinfo-data (1.2021.1)
|
||||
tzinfo (>= 1.0.0)
|
||||
unf (0.1.4)
|
||||
unf_ext
|
||||
unf_ext (0.0.7.7)
|
||||
unf_ext (0.0.7.7-x64-mingw32)
|
||||
unicode-display_width (1.7.0)
|
||||
wdm (0.1.1)
|
||||
webrick (1.7.0)
|
||||
zeitwerk (2.4.2)
|
||||
|
||||
PLATFORMS
|
||||
x64-mingw32
|
||||
x86_64-linux
|
||||
|
||||
DEPENDENCIES
|
||||
github-pages (~> 215)
|
||||
jekyll (~> 3.9.0)
|
||||
jekyll-feed (~> 0.12)
|
||||
just-the-docs
|
||||
minima (~> 2.5)
|
||||
tzinfo (~> 1.2)
|
||||
tzinfo-data
|
||||
wdm (~> 0.1.1)
|
||||
webrick
|
||||
|
||||
BUNDLED WITH
|
||||
2.2.23
|
||||
@@ -1,120 +0,0 @@
|
||||
# Welcome to Jekyll!
|
||||
#
|
||||
# This config file is meant for settings that affect your whole blog, values
|
||||
# which you are expected to set up once and rarely edit after that. If you find
|
||||
# yourself editing this file very often, consider using Jekyll's data files
|
||||
# feature for the data you need to update frequently.
|
||||
#
|
||||
# For technical reasons, this file is *NOT* reloaded automatically when you use
|
||||
# 'bundle exec jekyll serve'. If you change this file, please restart the server process.
|
||||
#
|
||||
# If you need help with YAML syntax, here are some quick references for you:
|
||||
# https://learn-the-web.algonquindesign.ca/topics/markdown-yaml-cheat-sheet/#yaml
|
||||
# https://learnxinyminutes.com/docs/yaml/
|
||||
#
|
||||
# Site settings
|
||||
# These are used to personalize your new site. If you look in the HTML files,
|
||||
# you will see them accessed via {{ site.title }}, {{ site.email }}, and so on.
|
||||
# You can create any custom variable you would like, and they will be accessible
|
||||
# in the templates via {{ site.myvariable }}.
|
||||
|
||||
title: Josh Creek's Blog
|
||||
email: your-email@example.com
|
||||
description: >- # this means to ignore newlines until "baseurl:"
|
||||
A blog covering anything I found interesting or useful in the worlds of technology and code.
|
||||
baseurl: "" # the subpath of your site, e.g. /blog
|
||||
url: "https://www.jcreek.co.uk" # the base hostname & protocol for your site, e.g. http://example.com
|
||||
twitter_username: jcreek23
|
||||
github_username: jcreek
|
||||
|
||||
# Build settings
|
||||
#theme: just-the-docs
|
||||
remote_theme: pmarsceill/just-the-docs
|
||||
plugins:
|
||||
- jekyll-feed
|
||||
|
||||
# Exclude from processing.
|
||||
# The following items will not be processed, by default.
|
||||
# Any item listed under the `exclude:` key here will be automatically added to
|
||||
# the internal "default list".
|
||||
#
|
||||
# Excluded items can be processed by explicitly listing the directories or
|
||||
# their entries' file path in the `include:` list.
|
||||
#
|
||||
# exclude:
|
||||
# - .sass-cache/
|
||||
# - .jekyll-cache/
|
||||
# - gemfiles/
|
||||
# - Gemfile
|
||||
# - Gemfile.lock
|
||||
# - node_modules/
|
||||
# - vendor/bundle/
|
||||
# - vendor/cache/
|
||||
# - vendor/gems/
|
||||
# - vendor/ruby/
|
||||
|
||||
# Set a path/url to a logo that will be displayed instead of the title
|
||||
# logo: "profile.png"
|
||||
|
||||
# Aux links for the upper right navigation
|
||||
aux_links:
|
||||
"GitHub":
|
||||
- "//github.com/jcreek"
|
||||
"Twitter":
|
||||
- "//twitter.com/jcreek23"
|
||||
|
||||
# Makes Aux links open in a new tab. Default is false
|
||||
aux_links_new_tab: true
|
||||
|
||||
# Enable or disable the site search
|
||||
# Supports true (default) or false
|
||||
search_enabled: true
|
||||
|
||||
search:
|
||||
# Split pages into sections that can be searched individually
|
||||
# Supports 1 - 6, default: 2
|
||||
heading_level: 2
|
||||
# Maximum amount of previews per search result
|
||||
# Default: 3
|
||||
previews: 3
|
||||
# Maximum amount of words to display before a matched word in the preview
|
||||
# Default: 5
|
||||
preview_words_before: 5
|
||||
# Maximum amount of words to display after a matched word in the preview
|
||||
# Default: 10
|
||||
preview_words_after: 10
|
||||
# Set the search token separator
|
||||
# Default: /[\s\-/]+/
|
||||
# Example: enable support for hyphenated search words
|
||||
tokenizer_separator: /[\s/]+/
|
||||
# Display the relative url in search results
|
||||
# Supports true (default) or false
|
||||
rel_url: true
|
||||
# Enable or disable the search button that appears in the bottom right corner of every page
|
||||
# Supports true or false (default)
|
||||
button: false
|
||||
|
||||
# Footer content
|
||||
# appears at the bottom of every page's main content
|
||||
# Note: The footer_content option is deprecated and will be removed in a future major release. Please use `_includes/footer_custom.html` for more robust markup / liquid-based content.
|
||||
footer_content: "Copyright © 2017-2020 Josh Creek. No reproduction allowed without permission."
|
||||
|
||||
# Footer last edited timestamp
|
||||
last_edit_timestamp: true # show or hide edit time - page must have `last_modified_date` defined in the frontmatter
|
||||
last_edit_time_format: "%b %e %Y at %I:%M %p" # uses ruby's time format: https://ruby-doc.org/stdlib-2.7.0/libdoc/time/rdoc/Time.html
|
||||
|
||||
# Footer "Edit this page on GitHub" link text
|
||||
gh_edit_link: false # show or hide edit this page link
|
||||
gh_edit_link_text: "Edit this page on GitHub."
|
||||
gh_edit_repository: "https://github.com/pmarsceill/just-the-docs" # the github URL for your repo
|
||||
gh_edit_branch: "master" # the branch that your docs is served from
|
||||
# gh_edit_source: docs # the source that your files originate from
|
||||
gh_edit_view_mode: "tree" # "tree" or "edit" if you want the user to jump into the editor immediately
|
||||
|
||||
# Color scheme supports "light" (default) and "dark"
|
||||
color_scheme: light
|
||||
|
||||
# Google Analytics Tracking (optional)
|
||||
# e.g, UA-1234567-89
|
||||
ga_tracking: UA-201885349-1
|
||||
ga_tracking_anonymize_ip: true # Use GDPR compliant Google Analytics settings (true by default)
|
||||
@@ -1,6 +0,0 @@
|
||||
---
|
||||
layout: default
|
||||
title: Containers & Deploying
|
||||
nav_order: 2
|
||||
has_children: true
|
||||
---
|
||||
@@ -1,6 +0,0 @@
|
||||
---
|
||||
layout: default
|
||||
title: Development Teams
|
||||
nav_order: 5
|
||||
has_children: true
|
||||
---
|
||||
@@ -1,6 +0,0 @@
|
||||
---
|
||||
layout: default
|
||||
title: Home Server
|
||||
nav_order: 4
|
||||
has_children: true
|
||||
---
|
||||
@@ -0,0 +1,21 @@
|
||||
# See here for image contents: https://github.com/microsoft/vscode-dev-containers/tree/v0.245.2/containers/python-3/.devcontainer/base.Dockerfile
|
||||
|
||||
# [Choice] Python version (use -bullseye variants on local arm64/Apple Silicon): 3, 3.10, 3.9, 3.8, 3.7, 3.6, 3-bullseye, 3.10-bullseye, 3.9-bullseye, 3.8-bullseye, 3.7-bullseye, 3.6-bullseye, 3-buster, 3.10-buster, 3.9-buster, 3.8-buster, 3.7-buster, 3.6-buster
|
||||
ARG VARIANT="3.10-bullseye"
|
||||
FROM mcr.microsoft.com/vscode/devcontainers/python:0-${VARIANT}
|
||||
|
||||
# [Choice] Node.js version: none, lts/*, 16, 14, 12, 10
|
||||
ARG NODE_VERSION="none"
|
||||
RUN if [ "${NODE_VERSION}" != "none" ]; then su vscode -c "umask 0002 && . /usr/local/share/nvm/nvm.sh && nvm install ${NODE_VERSION} 2>&1"; fi
|
||||
|
||||
# [Optional] If your pip requirements rarely change, uncomment this section to add them to the image.
|
||||
# COPY requirements.txt /tmp/pip-tmp/
|
||||
# RUN pip3 --disable-pip-version-check --no-cache-dir install -r /tmp/pip-tmp/requirements.txt \
|
||||
# && rm -rf /tmp/pip-tmp
|
||||
|
||||
# [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 this line to install global node packages.
|
||||
# RUN su vscode -c "source /usr/local/share/nvm/nvm.sh && npm install -g <your-package-here>" 2>&1
|
||||
@@ -0,0 +1,55 @@
|
||||
// For format details, see https://aka.ms/devcontainer.json. For config options, see the README at:
|
||||
// https://github.com/microsoft/vscode-dev-containers/tree/v0.245.2/containers/python-3
|
||||
{
|
||||
"name": "Python 3",
|
||||
"build": {
|
||||
"dockerfile": "Dockerfile",
|
||||
"context": "..",
|
||||
"args": {
|
||||
// Update 'VARIANT' to pick a Python version: 3, 3.10, 3.9, 3.8, 3.7, 3.6
|
||||
// Append -bullseye or -buster to pin to an OS version.
|
||||
// Use -bullseye variants on local on arm64/Apple Silicon.
|
||||
"VARIANT": "3.10-bullseye",
|
||||
// Options
|
||||
"NODE_VERSION": "lts/*"
|
||||
}
|
||||
},
|
||||
|
||||
// Configure tool-specific properties.
|
||||
"customizations": {
|
||||
// Configure properties specific to VS Code.
|
||||
"vscode": {
|
||||
// Set *default* container specific settings.json values on container create.
|
||||
"settings": {
|
||||
"python.defaultInterpreterPath": "/usr/local/bin/python",
|
||||
"python.linting.enabled": true,
|
||||
"python.linting.pylintEnabled": true,
|
||||
"python.formatting.autopep8Path": "/usr/local/py-utils/bin/autopep8",
|
||||
"python.formatting.blackPath": "/usr/local/py-utils/bin/black",
|
||||
"python.formatting.yapfPath": "/usr/local/py-utils/bin/yapf",
|
||||
"python.linting.banditPath": "/usr/local/py-utils/bin/bandit",
|
||||
"python.linting.flake8Path": "/usr/local/py-utils/bin/flake8",
|
||||
"python.linting.mypyPath": "/usr/local/py-utils/bin/mypy",
|
||||
"python.linting.pycodestylePath": "/usr/local/py-utils/bin/pycodestyle",
|
||||
"python.linting.pydocstylePath": "/usr/local/py-utils/bin/pydocstyle",
|
||||
"python.linting.pylintPath": "/usr/local/py-utils/bin/pylint"
|
||||
},
|
||||
|
||||
// Add the IDs of extensions you want installed when the container is created.
|
||||
"extensions": [
|
||||
"ms-python.python",
|
||||
"ms-python.vscode-pylance",
|
||||
"redhat.vscode-yaml"
|
||||
]
|
||||
}
|
||||
},
|
||||
|
||||
// Use 'forwardPorts' to make a list of ports inside the container available locally.
|
||||
// "forwardPorts": [],
|
||||
|
||||
// Use 'postCreateCommand' to run commands after the container is created.
|
||||
"postCreateCommand": "pip3 install --user -r requirements.txt",
|
||||
|
||||
// Comment out to connect as root instead. More info: https://aka.ms/vscode-remote/containers/non-root.
|
||||
"remoteUser": "vscode"
|
||||
}
|
||||
Vendored
+15
@@ -0,0 +1,15 @@
|
||||
{
|
||||
"version": "0.2.0",
|
||||
"configurations": [
|
||||
{
|
||||
"name": "Launch MkDocs",
|
||||
"request": "launch",
|
||||
"runtimeArgs": [
|
||||
"serve"
|
||||
],
|
||||
"runtimeExecutable": "mkdocs",
|
||||
"type": "node",
|
||||
"stopOnEntry": true,
|
||||
}
|
||||
]
|
||||
}
|
||||
Vendored
+5
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"yaml.schemas": {
|
||||
"https://squidfunk.github.io/mkdocs-material/schema.json": "mkdocs.yml"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
# jcreek.co.uk
|
||||
|
||||
When you're finished editing, you can build a static site from your Markdown files with:
|
||||
|
||||
`mkdocs build`
|
||||
|
||||
To customise code blocks, see the documentation at https://squidfunk.github.io/mkdocs-material/reference/code-blocks/
|
||||
+5
-8
@@ -1,15 +1,12 @@
|
||||
---
|
||||
layout: post
|
||||
parent: Containers & Deploying
|
||||
nav_order: 1
|
||||
title: "Docker Compose for ASP.Net Core with Postgres + S3 backups"
|
||||
date: 2021-07-12 21:01:45 +0100
|
||||
categories: deploying docker
|
||||
tags:
|
||||
- deploying
|
||||
- docker
|
||||
---
|
||||
|
||||
# {{page.title}}
|
||||
# Docker Compose for ASP.Net Core with Postgres + S3 backups
|
||||
|
||||
_{{page.date}}_
|
||||
_2021-07-12_
|
||||
|
||||
In this post, I will cover how I set up the following application structure, run from a single `docker-compose` file:
|
||||
|
||||
+5
-8
@@ -1,15 +1,12 @@
|
||||
---
|
||||
layout: post
|
||||
parent: Containers & Deploying
|
||||
nav_order: 2
|
||||
title: "Docker Compose for S3 Backup and Restore of PostgreSQL"
|
||||
date: 2021-07-12 21:27:19 +0100
|
||||
categories: deploying docker
|
||||
tags:
|
||||
- deploying
|
||||
- docker
|
||||
---
|
||||
|
||||
# {{page.title}}
|
||||
# Docker Compose for S3 Backup and Restore of PostgreSQL
|
||||
|
||||
_{{page.date}}_
|
||||
_2021-07-12_
|
||||
|
||||
In this post, I will cover how you can set up two Docker containers for backing up and restoring Postgres databases using S3 in AWS.
|
||||
|
||||
+5
-8
@@ -1,15 +1,12 @@
|
||||
---
|
||||
layout: post
|
||||
parent: Containers & Deploying
|
||||
nav_order: 3
|
||||
title: "Docker Compose for Elasticsearch and Kibana 7.9"
|
||||
date: 2021-07-13 21:38:05 +0100
|
||||
categories: deploying docker
|
||||
tags:
|
||||
- deploying
|
||||
- docker
|
||||
---
|
||||
|
||||
# {{page.title}}
|
||||
# Docker Compose for Elasticsearch and Kibana 7.9
|
||||
|
||||
_{{page.date}}_
|
||||
_2021-07-13_
|
||||
|
||||
In this post, I will cover how you can set up Elasticsearch and Kibana with a single `docker-compose.yml` file.
|
||||
|
||||
@@ -1,15 +1,12 @@
|
||||
---
|
||||
layout: post
|
||||
parent: Development Teams
|
||||
nav_order: 1
|
||||
title: "The way I recommend using git in a dev team"
|
||||
date: 2022-03-11 22:46:33 +0000
|
||||
categories: git
|
||||
tags:
|
||||
- dev teams
|
||||
- git
|
||||
---
|
||||
|
||||
# {{page.title}}
|
||||
# The way I recommend using git in a dev team
|
||||
|
||||
_{{page.date}}_
|
||||
_2022-03-11_
|
||||
|
||||
Looking back at my old git commits reveals an entertaining, if slightly embarassing mess.
|
||||
|
||||
@@ -52,7 +49,7 @@ I never used to care about my commit messages because it was only me reading the
|
||||
|
||||
There is a single git commit that I think should be required reading for all developers. It is from a developer by the name of [Dan Carley](https://twitter.com/dancarley) working on GOV.UK, and it has the rather unassuming name of ["Convert template to US-ASCII to fix error"](https://github.com/alphagov/govuk-puppet/commit/63b36f93bf75a848e2125008aa1e880c5861cf46).
|
||||
|
||||
|
||||
|
||||
|
||||
I found it through [this blog](https://dhwthompson.com/2019/my-favourite-git-commit) and I'd highly recommend reading through it, but essentially the thing I like most about this commit is it explains why the change was made, not just what the change was.
|
||||
|
||||
@@ -1,15 +1,13 @@
|
||||
---
|
||||
layout: post
|
||||
parent: Development Teams
|
||||
nav_order: 2
|
||||
title: "How to write an excellent readme file"
|
||||
date: 2022-03-16 19:01:03 +0000
|
||||
categories: git readme
|
||||
tags:
|
||||
- dev teams
|
||||
- git
|
||||
- readme
|
||||
---
|
||||
|
||||
# {{page.title}}
|
||||
# How to write an excellent readme file
|
||||
|
||||
_{{page.date}}_
|
||||
_2022-03-16_
|
||||
|
||||
All git projects need a readme file, to explain what it is, why it exists, how it works and how to use it. A good starting point with guidance can be found below.
|
||||
|
||||
+6
-8
@@ -1,15 +1,13 @@
|
||||
---
|
||||
layout: post
|
||||
parent: Home Server
|
||||
nav_order: 1
|
||||
title: "Installing Home Assistant OS on Truenas Scale"
|
||||
date: 2022-03-08 18:33:12 +0000
|
||||
categories: home assistant, truenas scale, home server
|
||||
tags:
|
||||
- home server
|
||||
- truenas scale
|
||||
- home assistant
|
||||
---
|
||||
|
||||
# {{page.title}}
|
||||
# Installing Home Assistant OS on Truenas Scale
|
||||
|
||||
_{{page.date}}_
|
||||
_2022-03-08_
|
||||
|
||||
Mostly taken from https://www.truenas.com/community/threads/home-assistant-vm-on-scale.91058/post-666766 and cleaned up.
|
||||
|
||||
|
Before Width: | Height: | Size: 1.5 MiB After Width: | Height: | Size: 1.5 MiB |
|
Before Width: | Height: | Size: 91 KiB After Width: | Height: | Size: 91 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 154 KiB |
|
Before Width: | Height: | Size: 111 KiB After Width: | Height: | Size: 111 KiB |
|
Before Width: | Height: | Size: 433 KiB After Width: | Height: | Size: 433 KiB |
|
Before Width: | Height: | Size: 611 KiB After Width: | Height: | Size: 611 KiB |
@@ -1,21 +1,13 @@
|
||||
---
|
||||
layout: default
|
||||
title: Home
|
||||
nav_order: 1
|
||||
description: "The website for Josh Creek."
|
||||
permalink: /
|
||||
---
|
||||
<!-- ---
|
||||
hide:
|
||||
- navigation
|
||||
- toc
|
||||
- tags
|
||||
--- -->
|
||||
|
||||
# Welcome to the site
|
||||
{: .fs-9 }
|
||||
|
||||
This is the place where I ramble about technology and coding. Sometimes Computer Science education too.
|
||||
{: .fs-6 .fw-300 }
|
||||
|
||||
[Learn who I am](#about-me){: .btn .btn-primary .fs-5 .mb-4 .mb-md-0 .mr-2 }
|
||||
[View my GitHub](https://github.com/jcreek){: .btn .fs-5 .mb-4 .mb-md-0 }
|
||||
|
||||
---
|
||||
|
||||
## About Me
|
||||
|
||||
@@ -53,8 +45,8 @@ I code in a variety of languages, and use a number of different tools. Here they
|
||||
- MongoDB (if I really have to)
|
||||
- Python (a bit rusty these days but fine for making simple scripts)
|
||||
- Docker & Docker Compose
|
||||
- AWS
|
||||
- Proxmox (for baremetal virtualisation)
|
||||
- AWS & Azure
|
||||
- Proxmox & TrueNAS Scale
|
||||
- Windows/MacOS/Linux
|
||||
- Photoshop/Lightroom
|
||||
- Davinci Resolve/Premiere Pro
|
||||
@@ -63,14 +55,10 @@ I code in a variety of languages, and use a number of different tools. Here they
|
||||
|
||||
#### UCL Institute of Education
|
||||
|
||||
##### July 2015 - July 2016
|
||||
|
||||
Postgraduate Certificate in Education
|
||||
|
||||
#### University of Exeter
|
||||
|
||||
##### September 2012 - July 2015
|
||||
|
||||
English with Proficiency in French
|
||||
|
||||
### Awards
|
||||
+17
-11
@@ -1,17 +1,23 @@
|
||||
---
|
||||
layout: post
|
||||
parent: Web Development
|
||||
nav_order: 3
|
||||
title: "Setting up remote containers for IAC dev environments in dotnet 6 with postgres and SMTP"
|
||||
date: 2022-04-20 15:51:03 +0000
|
||||
categories: dotnet core asp vscode remote-container remote container iac postgress smtp dev environment
|
||||
tags:
|
||||
- web development
|
||||
- dotnet
|
||||
- asp
|
||||
- c#
|
||||
- vscode
|
||||
- devcontainer
|
||||
- remote-container
|
||||
- iac
|
||||
- postgres
|
||||
- smtp
|
||||
- dev environment
|
||||
---
|
||||
|
||||
# {{page.title}}
|
||||
# Setting up remote containers for IAC dev environments in dotnet 6 with postgres and SMTP
|
||||
|
||||
_{{page.date}}_
|
||||
_2022-04-20_
|
||||
|
||||
|
||||
|
||||
|
||||
In this post I will go through how to set up remote containers for a dotnet 6 API project using PostgreSQL and an SMTP server, so that any new devs picking up the project only have to clone down the git repo and open it in Visual Studio code to get started debugging it.
|
||||
|
||||
@@ -38,7 +44,7 @@ This is customised from the default Microsoft file. You can change the name, the
|
||||
|
||||
There is an issue where Omnisharp, the underlying technology in the C# vscode plugin doesn't work properly unless `dotnet restore` is run at the point of setting up the dev container, so do not remove that command.
|
||||
|
||||
```json
|
||||
```json linenums="1"
|
||||
// For format details, see https://aka.ms/devcontainer.json. For config options, see the README at:
|
||||
// https://github.com/microsoft/vscode-dev-containers/tree/v0.231.6/containers/dotnet-postgres
|
||||
{
|
||||
@@ -182,7 +188,7 @@ RUN if [ "${NODE_VERSION}" != "none" ]; then su vscode -c "umask 0002 && . /usr/
|
||||
|
||||
To get the SMTP working, use these keys. If you're doing anything more fancy with `bytemark/smtp` than just the default functionality you may need to change the SMTP port.
|
||||
|
||||
```json
|
||||
```json linenums="1"
|
||||
"SmtpHost": "mail",
|
||||
"SmtpPort": 25,
|
||||
```
|
||||
+16
-17
@@ -1,15 +1,14 @@
|
||||
---
|
||||
layout: post
|
||||
parent: Web Development
|
||||
nav_order: 3
|
||||
title: "C# 8 Pattern Matching"
|
||||
date: 2022-02-15 19:07:21 +0000
|
||||
categories: dotnet csharp
|
||||
tags:
|
||||
- web development
|
||||
- dotnet
|
||||
- c#
|
||||
- pattern matching
|
||||
---
|
||||
|
||||
# {{page.title}}
|
||||
# C# 8 Pattern Matching
|
||||
|
||||
_{{page.date}}_
|
||||
_2022-02-15_
|
||||
|
||||
This serves as introductory documentation to the pattern matching features introduced in C# 8, which I think are particularly useful.
|
||||
|
||||
@@ -17,7 +16,7 @@ This serves as introductory documentation to the pattern matching features intro
|
||||
|
||||
Adding a deconstructor to your class can be done as below. It must be named `Deconstruct` and be a `public void`. Any values we want deconstructed can be set as `out` parameters, then populated. Here all properties are being deconstructed, but a subset could be deconstructed if desired.
|
||||
|
||||
```csharp
|
||||
```csharp linenums="1"
|
||||
class Student
|
||||
{
|
||||
public string Name { get; set; }
|
||||
@@ -35,7 +34,7 @@ class Student
|
||||
|
||||
To use positional parameters, I'll also set up a second model.
|
||||
|
||||
```csharp
|
||||
```csharp linenums="1"
|
||||
class Teacher
|
||||
{
|
||||
public string Name { get; set; }
|
||||
@@ -51,7 +50,7 @@ class Teacher
|
||||
|
||||
Here is an example positional pattern. The discards (`_`) are used to 'match all'.
|
||||
|
||||
```csharp
|
||||
```csharp linenums="1"
|
||||
public static class YourClassHere
|
||||
{
|
||||
public static bool IsInYear9English(Student student)
|
||||
@@ -71,7 +70,7 @@ While an if statement would probably be easier to read and maintain in this exam
|
||||
|
||||
I've updated the Student model to add a School property.
|
||||
|
||||
```csharp
|
||||
```csharp linenums="1"
|
||||
class Student
|
||||
{
|
||||
public string Name { get; set; }
|
||||
@@ -83,7 +82,7 @@ class Student
|
||||
|
||||
I prefer using property patterns to positional patterns as they are much more readable. Here's an example method to check whether a student attends a particular school and has a form tutor who teaches Maths.
|
||||
|
||||
```csharp
|
||||
```csharp linenums="1"
|
||||
public static class YourClassHere
|
||||
{
|
||||
public static bool IsStudentInGreenAcademyWithMathsFormTutor(Student student)
|
||||
@@ -100,7 +99,7 @@ public static class YourClassHere
|
||||
|
||||
This can be made more generic to accept an `object` rather than a `Student`, and check that object is a Student.
|
||||
|
||||
```csharp
|
||||
```csharp linenums="1"
|
||||
public static class YourClassHere
|
||||
{
|
||||
public static bool IsStudentInGreenAcademyWithMathsFormTutor(object obj)
|
||||
@@ -120,7 +119,7 @@ public static class YourClassHere
|
||||
|
||||
These can be used in place of standard switch cases. I'm using a discard (`_`) for catching the default case for unmatched patterns.
|
||||
|
||||
```csharp
|
||||
```csharp linenums="1"
|
||||
public static class YourClassHere
|
||||
{
|
||||
public static string DisplayPersonInfo (object person)
|
||||
@@ -139,7 +138,7 @@ public static class YourClassHere
|
||||
|
||||
The syntax can make it easier to read, and it can be a lot more powerful. You can also define recursive switch patterns.
|
||||
|
||||
```csharp
|
||||
```csharp linenums="1"
|
||||
public static class YourClassHere
|
||||
{
|
||||
public static string DisplayPersonInfo (object person)
|
||||
@@ -165,7 +164,7 @@ public static class YourClassHere
|
||||
|
||||
You can also use Switch Expressions with Tuples to write even more useful code. For example, you could be creating a game with crafting, combining two items to make another.
|
||||
|
||||
```csharp
|
||||
```csharp linenums="1"
|
||||
public static class YourClassHere
|
||||
{
|
||||
public static CraftingMaterial GetCraftingMaterial (CraftingMaterial item1, CraftingMaterial item2)
|
||||
@@ -1,15 +1,16 @@
|
||||
---
|
||||
layout: post
|
||||
parent: Web Development
|
||||
nav_order: 2
|
||||
title: "Adding JSNLog to ASP .Net 6 with Serilog"
|
||||
date: 2022-01-18 21:43:32 +0000
|
||||
categories: dotnet core asp serilog jsnlog
|
||||
tags:
|
||||
- web development
|
||||
- dotnet
|
||||
- asp
|
||||
- c#
|
||||
- serilog
|
||||
- jsnlog
|
||||
---
|
||||
|
||||
# {{page.title}}
|
||||
# Adding JSNLog to ASP .Net 6 with Serilog
|
||||
|
||||
_{{page.date}}_
|
||||
_2022-01-18_
|
||||
|
||||
In this post I will go through the steps required to get an optimal install of JSNLog in ASP dotnet 6 projects using Serilog. JSNLog is a fantastic tool for logging uncaught javascript exceptions to the backend's logging system, and can be used for a variety of other things. This config includes batching of messages to reduce calls made to the server, as well as buffering, where helpful debugging logs are only sent if there's a fatal log that's also being sent, to make it easier to diagnose bugs without unnecessary diagnostic logs appearing at all times.
|
||||
|
||||
@@ -21,7 +22,7 @@ Add `@addTagHelper "*, jsnlog"` to enable the tag helper.
|
||||
|
||||
## Startup.cs
|
||||
|
||||
```csharp
|
||||
```csharp linenums="1"
|
||||
using Destructurama;
|
||||
using JSNLog;
|
||||
|
||||
@@ -84,7 +85,7 @@ Thirdly, it sets up logging any uncaught JS exceptions, and any exceptions insid
|
||||
|
||||
Fourthly, using stacktrace.js it handles getting the relevant stacktrace using sourcemaps.
|
||||
|
||||
```html
|
||||
```html linenums="1"
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jsnlog/2.30.0/jsnlog.min.js"
|
||||
asp-fallback-src="~/jsnlog.min.js"
|
||||
asp-fallback-test="window.JL"
|
||||
@@ -170,7 +171,7 @@ Fourthly, using stacktrace.js it handles getting the relevant stacktrace using s
|
||||
|
||||
## CustomLoggingAdapter.cs
|
||||
|
||||
```csharp
|
||||
```csharp linenums="1"
|
||||
using JSNLog;
|
||||
using Newtonsoft.Json;
|
||||
using System.Text;
|
||||
@@ -1,15 +1,21 @@
|
||||
---
|
||||
layout: post
|
||||
parent: Web Development
|
||||
nav_order: 4
|
||||
title: "How to set up a Node.js Typescript project well"
|
||||
date: 2022-06-15 19:26:00 +0000
|
||||
categories: nodejs typescript eslint webpack babel sourcemaps scss vscode devcontainer docker
|
||||
tags:
|
||||
- web development
|
||||
- nodejs
|
||||
- typescript
|
||||
- eslint
|
||||
- webpack
|
||||
- babel
|
||||
- sourcemaps
|
||||
- scss
|
||||
- vscode
|
||||
- devcontainer
|
||||
- docker
|
||||
---
|
||||
|
||||
# {{page.title}}
|
||||
# How to set up a Node.js Typescript project well
|
||||
|
||||
_{{page.date}}_
|
||||
_2022-06-15_
|
||||
|
||||
This post covers how to set up a project with Node.js and Typescript using eslint, webpack, babel, source maps, SCSS and vscode devcontainers using Docker.
|
||||
|
||||
@@ -58,7 +64,7 @@ RUN su node -c "umask 0002 && npm install -g ${NODE_MODULES}" \
|
||||
|
||||
### `devcontainer.json`
|
||||
|
||||
```json
|
||||
```json linenums="1"
|
||||
// For format details, see https://aka.ms/devcontainer.json. For config options, see the README at:
|
||||
// https://github.com/microsoft/vscode-dev-containers/tree/v0.238.0/containers/typescript-node
|
||||
{
|
||||
@@ -122,7 +128,7 @@ RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \
|
||||
|
||||
Within the `.vscode` folder you'll need to create this `launch.json` file:
|
||||
|
||||
```json
|
||||
```json linenums="1"
|
||||
{
|
||||
"version": "0.2.0",
|
||||
"configurations": [
|
||||
@@ -159,7 +165,7 @@ node_modules
|
||||
|
||||
### `.eslintrc.json`
|
||||
|
||||
```json
|
||||
```json linenums="1"
|
||||
{
|
||||
"env": {
|
||||
"browser": true,
|
||||
@@ -203,7 +209,7 @@ Create the following files:
|
||||
|
||||
### `custom.d.ts`
|
||||
|
||||
```ts
|
||||
```ts linenums="1"
|
||||
declare module '*.svg' {
|
||||
const content: any;
|
||||
export default content;
|
||||
@@ -212,7 +218,7 @@ declare module '*.svg' {
|
||||
|
||||
### `tsconfig.json`
|
||||
|
||||
```json
|
||||
```json linenums="1"
|
||||
{
|
||||
"compilerOptions": {
|
||||
"preserveConstEnums": true
|
||||
@@ -224,7 +230,7 @@ declare module '*.svg' {
|
||||
|
||||
### `webpack.config.js`
|
||||
|
||||
```js
|
||||
```js linenums="1"
|
||||
const path = require('path');
|
||||
|
||||
module.exports = {
|
||||
@@ -288,7 +294,7 @@ module.exports = {
|
||||
|
||||
### `package.json`
|
||||
|
||||
```json
|
||||
```json linenums="1"
|
||||
{
|
||||
"name": "your app name",
|
||||
"version": "1.0.0",
|
||||
+12
-12
@@ -1,17 +1,17 @@
|
||||
---
|
||||
layout: post
|
||||
parent: Web Development
|
||||
nav_order: 1
|
||||
title: "Creating a reactive SPA simply within an ASP.Net Core web app with Vue.js"
|
||||
date: 2021-07-12 21:42:57 +0100
|
||||
categories: vue dotnet core asp
|
||||
tags:
|
||||
- web development
|
||||
- dotnet
|
||||
- c#
|
||||
- vue
|
||||
- asp
|
||||
---
|
||||
|
||||
# {{page.title}}
|
||||
# Creating a reactive SPA simply within an ASP.Net Core web app with Vue.js
|
||||
|
||||
_{{page.date}}_
|
||||
_2021-07-12_
|
||||
|
||||
|
||||
|
||||
|
||||
In this post, I will cover how you can quickly and easily use Vue.js to make a reactive 'SPA' within ASP.Net Core. This is a slightly dirty way to do things, but for rapid prototyping or a simple project it does the job just fine without any unnecessary complications. By 'SPA' I mean a Single Page Application, except without any navigation as that's handled by the underlying ASP.Net Core application, as is the API called by Vue.js methods.
|
||||
|
||||
@@ -28,7 +28,7 @@ At the bottom of your Razor page/view, you'll need to include a `<script>` tag t
|
||||
|
||||
In this example, it's a Vue instance for creating invoices and updating stock levels. The above gif shows some of the functionality achieved with this, including dynamically adding classes, and looping through elements in an array with markup for each.
|
||||
|
||||
```html
|
||||
```html linenums="1"
|
||||
<script>
|
||||
const createInvoice = new Vue({
|
||||
el: '#create-invoice',
|
||||
@@ -149,7 +149,7 @@ To hook this into the DOM, just add the element identifier to an element, for ex
|
||||
|
||||
Within that, you are free to use a variety of tools, like `v-if`, interpolation and `v-on` event handlers. In this example, if there's any text in the `successMessage` property of the Vue data object, this alert div will be displayed, interpolating the message, and clearing it (thus hiding the alert) when the close button is clicked.
|
||||
|
||||
```html
|
||||
```html linenums="1"
|
||||
<div v-if="successMessage" class="alert alert-success alert-dismissible fade show" role="alert">
|
||||
<i class="bi bi-check-circle-fill"></i>
|
||||
<strong>Success:</strong> {{ successMessage }}
|
||||
@@ -165,7 +165,7 @@ The `barcode` field is mapped to a `v-model`, which means as it changes it direc
|
||||
|
||||
The `quantity` field also uses a `v-model`, but specifically forces it to be a number (no need for Typescript here) runs a method on keypress (the `@@` syntax is purely due to Razor escaping, normally you'd only need one) and on change.
|
||||
|
||||
```html
|
||||
```html linenums="1"
|
||||
<tr v-for="product in products" v-bind:class="getProductRowClass(product)">
|
||||
<td>
|
||||
<div class="tooltip" v-if="product.barcode.length > 0 && product.stockLevel - product.quantity < 0">
|
||||
@@ -0,0 +1,99 @@
|
||||
site_name: Josh Creek's Blog
|
||||
site_url: https://www.jcreek.co.uk/
|
||||
repo_url: https://github.com/jcreek/jcreek.github.io
|
||||
repo_name: Spotted an issue?
|
||||
edit_uri: edit/master/mkdocs/
|
||||
|
||||
theme:
|
||||
name: material
|
||||
icon:
|
||||
repo: fontawesome/brands/github
|
||||
favicon: img/favicon.ico
|
||||
logo: img/noogler-hat-edited-round.png
|
||||
palette:
|
||||
# Palette toggle for light mode
|
||||
- media: "(prefers-color-scheme: light)"
|
||||
scheme: default
|
||||
toggle:
|
||||
icon: material/brightness-7
|
||||
name: Switch to dark mode
|
||||
primary: amber
|
||||
accent: amber
|
||||
|
||||
# Palette toggle for dark mode
|
||||
- media: "(prefers-color-scheme: dark)"
|
||||
scheme: slate
|
||||
toggle:
|
||||
icon: material/brightness-4
|
||||
name: Switch to light mode
|
||||
primary: amber
|
||||
accent: amber
|
||||
features:
|
||||
- navigation.instant
|
||||
- navigation.tracking
|
||||
- navigation.tabs
|
||||
- navigation.tabs.sticky
|
||||
- navigation.sections
|
||||
- toc.follow
|
||||
- toc.integrate
|
||||
- navigation.top
|
||||
- search.suggest
|
||||
- search.highlight
|
||||
- search.share
|
||||
|
||||
copyright: Copyright © 2011 - 2022 Josh Creek
|
||||
|
||||
extra:
|
||||
consent:
|
||||
title: Cookie consent
|
||||
description: >-
|
||||
I use cookies to recognize your repeated visits and preferences, as well
|
||||
as to measure the effectiveness of my documentation and whether users
|
||||
find what they're searching for. With your consent, you're helping me to
|
||||
make my documentation better.
|
||||
actions:
|
||||
- accept
|
||||
analytics:
|
||||
provider: google
|
||||
property: G-MYNBTM1YQW
|
||||
social:
|
||||
- icon: fontawesome/brands/github
|
||||
link: https://github.com/jcreek
|
||||
- icon: fontawesome/brands/twitter
|
||||
link: https://twitter.com/jcreek23
|
||||
- icon: fontawesome/brands/linkedin
|
||||
link: https://www.linkedin.com/in/jrcreek
|
||||
- icon: fontawesome/brands/instagram
|
||||
link: https://www.instagram.com/scruffy238/
|
||||
|
||||
plugins:
|
||||
- search
|
||||
- tags
|
||||
|
||||
markdown_extensions:
|
||||
- pymdownx.highlight:
|
||||
anchor_linenums: true
|
||||
- pymdownx.inlinehilite
|
||||
- pymdownx.snippets
|
||||
- pymdownx.superfences
|
||||
|
||||
nav:
|
||||
- Home: index.md
|
||||
- Containers & Deploying:
|
||||
# - deploying/index.md
|
||||
- Docker Compose for ASP.Net Core with Postgres + S3 backups: deploying/docker-compose-for-asp-net-core-with-postgres-and-s3-backups.md
|
||||
- Docker Compose for S3 Backup and Restore of PostgreSQL: deploying/docker-compose-s3-postgres-backup-and-restore.md
|
||||
- Docker Compose for Elasticsearch and Kibana 7.9: deploying/elasticsearch-and-kibana.md
|
||||
- Development Teams:
|
||||
- The way I recommend using git in a dev team: dev-team/git.md
|
||||
- How to write an excellent readme file: dev-team/readme-files.md
|
||||
- Home Server:
|
||||
- TrueNAS Scale:
|
||||
- Installing Home Assistant OS on Truenas Scale: home-server/truenas-scale/installing-homeassistant-on-truenas-scale.md
|
||||
- Web Development:
|
||||
- Setting up remote containers for IAC dev environments in dotnet 6 with postgres and SMTP: web-dev/dev-environment-container-vscode.md
|
||||
- Adding JSNLog to ASP .Net 6 with Serilog: web-dev/jsnlog-asp-net-6.md
|
||||
- How to set up a Node.js Typescript project well: web-dev/node-js-typescript.md
|
||||
- Creating a reactive SPA simply within an ASP.Net Core web app with Vue.js: web-dev/simple-vue-spa-in-asp-dotnet-core.md
|
||||
- Dotnet & C#:
|
||||
- C# 8 Pattern Matching: web-dev/dotnet-csharp/pattern-matching.md
|
||||
@@ -0,0 +1,2 @@
|
||||
mkdocs==1.4.1
|
||||
mkdocs-material==8.5.6
|
||||
Reference in New Issue
Block a user