bnkops.changemaker/mkdocs/docs/archive/repo.archive/Website Manuals 🤓/How to Replicate this Repo.md

title, publish

title	publish
How to Replicate this Repo	true

How do I replicate this Repo?

This is going to be a quick and dirty explanation on how to host a public website on your own domain that functions exactly like this one. The process of hosting this site is new to our organization, so by publishing this 'work-in-progress' manual, we hope that solutions to bugs are learned in real time and fixed accordingly.

Reasons why you should consider hosting your own website like this one:

• It is the cheapest method we have found to host a website (under $10 a year),
• The site is built on text files, which are small, lightweight, and easy to update,
• All of the files of this site are hosted locally however are editable remotely & collaboratively, including from mobile devices; and
• The simplicity of this site generator allows for fast iteration and updates.

Pre-Requisites

This site is being served on a Ubuntu machine with mid-range consumer hardware. You could host this site on almost any hardware, however, this guide walks through a install on a Ubuntu system. If you need to, you can install Ubuntu OS as your operating system however this process should be replaceable on other operating systems.

TLDR

Don't wanna read this whole repo? Here are your steps to do this quickly:

• Create Cloudflare account and purchase a domain (some domains available for under $5).
• Download Obsidian.
• Install Publisher for MkDocs in a virtual environment and a directory of your choice.
• Create Obsidian Vault inside directory and add knowledge.
• Serve Website on localhost.
• Create CloudFlared Tunnel & DNS Settings.
• Set Access Settings.
• Enjoy!

Quick Setup

Assuming you already have set up a cloudflare account and purchased a domain

Build Project Folder

Open terminal (ctrl.alt.t) Tweak the following command with your own user name and directory

cd /home/{your_username}/{your_website_directory}
python3 -m venv venv
source venv/bin/activate
pip install mkdocs-publisher

Create Site Config File & Build Site

Create a mkdocs.yml in the directory with the following command:

nano mkdocs.yml

Paste (ctrl.shift.v) the following into the file

site_name: my_website
theme:
  name: material

Save the file (ctrl.x - y - enter)

This is the most basic mkdocs site that you could serve. There are extensive configurations that you could add.

Create a docs folder

mkdir -p docs

Build the site

mkdocs build

If successful, your directory will have new folders (site, docs) populated in your project directory

Create a Obsidian Vault

Create a vault in Obsidian using the docs folder in your directory. Instructions on how to choose a folder for a vault here.

• Create a few test notes inside Obsidian

Serve the Site

Edit the following command to serve your site

cd /home/path/to/your/website/project
source venv/bin/activate
mkdocs build
mkdocs serve

Visit http://127.0.0.1:8000/ to confirm site build

Note: If the default port (8000) is already in use, update command -

mkdocs serve --dev-addr localhost:{insert a port number}

Create cloudflared tunnel

Follow instructions to install cloudflared

Create a Cloudflared Tunnel

cloudflared tunnel create <insert-website-name>

Note the Tunnel ID from the output.

Create a config file for your tunnel

nano ~/.cloudflared/config-<wesbite-name>.yml

Paste (ctrl.shift.v) the following content to the config file. Make sure to update the tunnel id, your username, the tunnel id again, your hostname, and the port number.

   tunnel: <tunnel-id>
   credentials-file: /home/<your-username>/.cloudflared/<tunnel-id>.json
   ingress:
     - hostname: <app-subdomain>.<your-domain>.com
       service: http://localhost:<port>
     - service: http_status:404

Save and exit the editor (Ctrl+X, then Y, then Enter in nano).

Configure Cloudflare DNS

Configure DNS settings in Cloudflare.

Protip - the search bar is excellent way to get straight to the dns records of your domain.

1. Log in to your Cloudflare dashboard.
2. Go to the DNS settings for your domain.
3. Add a CNAME record:
   • Type: CNAME
   • Name: <app-subdomain> (e.g., plex, nextcloud)
   • Target: <tunnel-id>.cfargotunnel.com
   • Proxy status: Proxied (orange cloud icon)

Access Settings

Inside of Cloudflare you can set access protocols through Zero Trust. This allows you to build a walled garden of information. If you do decided to create a walled garden of info, be aware that we cannot vouch for the security of these systems.

Remote Editing

Combining Syncthing and a remote device allows you edit your site live from anywhere, including your phone. First install Obsidian an Syncthing on your remote device. Share your vault folder across the devices. You can now edit your site live from anywhere! 🤠🤔

More Info - Obsidian, Markdown, Cloudflare, mkdocs, etc.

Obsidian

Obsidian is a markdown text editor that is free for personal use and limited commercial use. It is not a open-source software however the code base is inspect-able and the files it creates are open-source and can be ported to any other markdown editor. We recommend it because of its speed, community, and effectiveness.

Note: Consider using Obsidian Sync; a $6 a month hosting service that is effortless and supports this incredible tool.

Markdown

Markdown is a simple and easy-to-use markup language you can use to format virtually any document. It is the backbone of almost all text-editing software that you use today.

We recommend that you learn the basics of markdown syntax (although with obsidian you are not forced to) because it is a great introduction to generating text that is free from license.

Cloudflare

Cloudflare is a web services provider that has a generous free tier and affordable domain registration. We used them for this project because they provide authentication systems for your website, if you so choose to enable them. If your site scales, it can scale almost infinitely on this service. That said, we hold no corporate loyalties, and are curious what suggestions readers may have for stronger dns services.

mkdocs

Software engineers have been using this system to publish documentation for their projects for some time. As such, the system is robust, and allows for a incredible amount of customization. It is also simple and easy to get started with.

Budibase - Form & Webapp Builder

We are just now exploring buidbase and so far the system is impressive and required minimal set-up to a working live state. Highly recommend for building user forms in a no-code enviroment.

Want Help?

Bnkops is happy to help. Email admin@thebunkerops.ca and we would be thrilled to chat.

Don't want to talk to a human? Chat with Daisy through email - daisy.does.email@gmail.com