Compare commits
8 Commits
18987052ec
...
7d402d4c10
Author | SHA1 | Date | |
---|---|---|---|
|
7d402d4c10 | ||
|
c9bf98cb2c | ||
|
865d1668cd | ||
|
79da22ba37 | ||
|
8b107d63db | ||
|
21138c416c | ||
|
0430cd237b | ||
|
2982078069 |
@ -1,6 +1,5 @@
|
|||||||
---
|
---
|
||||||
title: "{{ replace .Name "-" " " | title }}"
|
title: "{{ replace .Name "-" " " | title }}"
|
||||||
date: {{ .Date }}
|
date: {{ .Date }}
|
||||||
draft: true
|
|
||||||
---
|
---
|
||||||
|
|
||||||
|
5
xavishobbies/content/web_development/_index.md
Normal file
5
xavishobbies/content/web_development/_index.md
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
---
|
||||||
|
title: "Web_development"
|
||||||
|
date: 2023-02-18T12:01:59-08:00
|
||||||
|
---
|
||||||
|
|
75
xavishobbies/content/web_development/bottom_of_the_stack.md
Normal file
75
xavishobbies/content/web_development/bottom_of_the_stack.md
Normal file
@ -0,0 +1,75 @@
|
|||||||
|
---
|
||||||
|
title: "Bottom_of_the_Stack"
|
||||||
|
date: 2023-02-18T11:39:24-08:00
|
||||||
|
description: Web Development - html/css
|
||||||
|
categories: ["Top_of_the_Stack"]
|
||||||
|
tags: ["Web Development","HTML/CSS"]
|
||||||
|
---
|
||||||
|
|
||||||
|
I\'ll start things off with the *design goals* of this very website and
|
||||||
|
what *I have done so far* to get things going.
|
||||||
|
|
||||||
|
Unless things have changed drastically by the time you read this
|
||||||
|
**\[which I doubt it has\]**, it should be a fairly vanilla 1995 World
|
||||||
|
Wide Web experience. There are a couple reasons I chose to go this
|
||||||
|
route.
|
||||||
|
|
||||||
|
Aside from the glaring hurdle that is my complete lack of any formal or
|
||||||
|
informal web development experience, I like keeping the [UNIX
|
||||||
|
philosophy](https://homepage.cs.uri.edu/~thenry/resources/unix_art/ch01s06.html)
|
||||||
|
in mind when working on my projects
|
||||||
|
**\[although manipulated to mean exactly what I want it to mean at any
|
||||||
|
given time\]**. For those unfamiliar, the basic principle is to design
|
||||||
|
programs to *do one thing and one thing well*. I want this website to be
|
||||||
|
a place where I throw my ideas into the void and can reference them
|
||||||
|
later **\[and maybe share some of that knowledge to the few that find
|
||||||
|
themselves here\]**. Although fun, interactive, dynamic features would
|
||||||
|
be cool to look at, I think it, ultimately, restricts my ability to
|
||||||
|
complete this goal effectively.
|
||||||
|
|
||||||
|
That isn\'t to say that I am completely against adding any scripting for
|
||||||
|
the sake of learning or experimenting **\[this IS a hobby website after
|
||||||
|
all\]**, but I do want to be able to quickly document my progress
|
||||||
|
without too much thought on aesthetic **\[aside from some font
|
||||||
|
colors\]**.
|
||||||
|
|
||||||
|
But let me get down to brass tacks, what have I done so far.
|
||||||
|
|
||||||
|
Well if I am being completely honest, we aren\'t even online yet. I
|
||||||
|
bought a domain name from
|
||||||
|
[dynadot](https://www.dynadot.com/)
|
||||||
|
and have a
|
||||||
|
[Vultr](https://www.vultr.com/)
|
||||||
|
VPS **\[hosting some other things at the
|
||||||
|
moment\]**, but haven\'t set anything else up. I\'ll look up some guides
|
||||||
|
tomorrow **\[famous last words\]** to see how to get us up and running.
|
||||||
|
|
||||||
|
So that\'s what I haven\'t done. *What I have done* is started getting
|
||||||
|
comfortable with *HTML/CSS*. I have written in other markup languages
|
||||||
|
like Markdown and LaTeX so it wasn\'t too painful to pick up but getting
|
||||||
|
used to syntax is something you can\'t really rush **\[maybe you can but
|
||||||
|
I can\'t\]**.
|
||||||
|
|
||||||
|
So, a few of the things I\'ve learned so far:
|
||||||
|
|
||||||
|
1. Basic HTML structure ie. Defining a page with *\"\<!DOCTYPE
|
||||||
|
html\>\"* as well as *\<head\>*, *\<body\>*, and *\<html\>* tags.
|
||||||
|
2. Other Basic HTML tags ie. *\<p\>*, *\<strong\>*, *\<em\>*, etc.
|
||||||
|
3. How to link to a style sheet **\[a cascading one to be exact\]**
|
||||||
|
with\
|
||||||
|
*\<link rel=\"stylesheet\" type=\"text/css\" href=\"\$(LOCATION OF
|
||||||
|
THE STYLE SHEET)\" /\>*
|
||||||
|
4. Defining specific tags with *id*, ie. *id=\"name_of_tag\"*
|
||||||
|
5. Basic CSS syntax
|
||||||
|
6. Referencing specific tags by id with *#\$(ID_NAME)*
|
||||||
|
|
||||||
|
Next *TODOS! **\[Can be updated throughout the week\]***
|
||||||
|
|
||||||
|
- Link Domain Name to VPS
|
||||||
|
- nGinx, WHAT IS THAT?
|
||||||
|
- Look into hosting git server
|
||||||
|
- Set up gitolite for git permissions
|
||||||
|
- Set up stagit for git visualization
|
||||||
|
- Possibly Peertube for embedded videos
|
||||||
|
|
||||||
|
|
90
xavishobbies/content/web_development/online.md
Normal file
90
xavishobbies/content/web_development/online.md
Normal file
@ -0,0 +1,90 @@
|
|||||||
|
---
|
||||||
|
title: "Online!"
|
||||||
|
date: 2023-02-18T12:58:09-08:00
|
||||||
|
description: Web Development - Administration
|
||||||
|
categories: ["Top_of_the_Stack"]
|
||||||
|
tags: ["Web Development","Administration"]
|
||||||
|
---
|
||||||
|
|
||||||
|
Hopefully you can see this because that means that I didn\'t mess
|
||||||
|
anything up when updating the site! I\'ll quickly recap what I did over
|
||||||
|
the last week and clarify what\'s in the pipeline for this upcoming
|
||||||
|
week.
|
||||||
|
|
||||||
|
So I ended up destroying and remaking the
|
||||||
|
[Vultr](https://www.vultr.com/)
|
||||||
|
VPS **\[Virtual Private Server if I didn\'t
|
||||||
|
clarify that previously\]** so that I could have a fresh, clean
|
||||||
|
environment to start messing around in. I decided to go with their
|
||||||
|
smallest, and cheapest plan to start things off **\[I think it can
|
||||||
|
handle the traffic that I expect to start \"pouring\" in\]**.
|
||||||
|
|
||||||
|
|
||||||
|
{{< image_sc "/vultr_1.png" "Vultr Pricing" "Vultr Cloud Pricing" >}}
|
||||||
|
|
||||||
|
|
||||||
|
I found this
|
||||||
|
[video](https://www.youtube.com/watch?v=-B-4RG8Q0aw)
|
||||||
|
that explained how to calculate how much
|
||||||
|
needed bandwidth I needed to budget for. Again I don\'t think I need
|
||||||
|
much **\[something tells me I\'m the only one checking in on this
|
||||||
|
website 100 times a day\]**. I stuck with a
|
||||||
|
[Debian](https://www.debian.org/)
|
||||||
|
distribution for no reason in particular
|
||||||
|
other than it\'s what I used previously on other VPSs **\[if your
|
||||||
|
unfamiliar with Linux and Linux distributions I\'ll make some intro to
|
||||||
|
Linux guides in the future that\'ll explain all the common nerd
|
||||||
|
jargon\]**.
|
||||||
|
|
||||||
|
I grabbed the domain name from
|
||||||
|
[dynadot](https://www.dynadot.com/)
|
||||||
|
and changed the DNS records to have it point
|
||||||
|
to the IP of the VPS. I\'ll write up a full guide for this in a bit
|
||||||
|
**\[honestly it\'s pretty easy\]**. I then installed nGinx, changed the
|
||||||
|
config files to point to the html/css files, and started the service
|
||||||
|
**\[kinda skipped the nitty gritty but again, guide incoming\]**.
|
||||||
|
|
||||||
|
I was able to visit the site at this point from a client device but
|
||||||
|
still had to set up
|
||||||
|
[SSL](https://www.ssl.com/faqs/what-is-https/)
|
||||||
|
**\[Secure Sockets Layer\]** so that the
|
||||||
|
connection was encrypted. Apparently it was pretty uncommon in the past
|
||||||
|
to have encrypted connections on personal websites but that was changed
|
||||||
|
with the help of the [EFF](https://www.eff.org/)
|
||||||
|
with [let\'s
|
||||||
|
encrypt](https://letsencrypt.org/)
|
||||||
|
which offers free, open certificates
|
||||||
|
**\[pretty cool of them honestly\]**. To make things even easier they
|
||||||
|
also provide a python script(?) called
|
||||||
|
[certbot](https://certbot.eff.org/)
|
||||||
|
which automates the process of obtaining one
|
||||||
|
of these ssl certificates. After I ran it I got the cool green lock icon
|
||||||
|
in the address bar and was feeling pretty cool myself! **:)**
|
||||||
|
|
||||||
|
Those were the major updates for this week. Next week I\'ll be looking
|
||||||
|
into hosting a git server to upload my code **\[including anything that
|
||||||
|
I create for this website ie. html/css/scripting stuff\]** and a git
|
||||||
|
visualiser. Hosting a git server seems easy enough but finding the right
|
||||||
|
visualiser might need a bit more research. Right now the most promising
|
||||||
|
candidate is
|
||||||
|
[stagit](https://codemadness.org/stagit.html)
|
||||||
|
which is a static git page generator. Hope
|
||||||
|
that works out.
|
||||||
|
|
||||||
|
The stretch goal for this week is the possibility to host videos with
|
||||||
|
**\[maybe?\]** a [peertube](https://joinpeertube.org/)
|
||||||
|
instance. Not sure how much of a pain and/or
|
||||||
|
the bandwidth limitations will throttle the experience too much but it
|
||||||
|
sounds useful to post, even short, videos demonstrating processes
|
||||||
|
explicitly **\[if a picture is 1000 words than what does that make a
|
||||||
|
video\]**.
|
||||||
|
|
||||||
|
That\'s the update for the week.
|
||||||
|
|
||||||
|
Next *TODOS! **\[Can be updated throughout the week\]***
|
||||||
|
|
||||||
|
- Look into hosting git server
|
||||||
|
- Set up gitolite for git permissions
|
||||||
|
- Set up stagit for git visualization
|
||||||
|
- Possibly Peertube for embedded videos
|
||||||
|
|
@ -30,9 +30,9 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="text_block">
|
<div class="text_block">
|
||||||
<h3 class="entry_heading"> <a href=./tots.html>Top of the Stack</a></h3>
|
<h3 class="entry_heading"> <a href="/categories/top_of_the_stack/">Top of the Stack</a></h3>
|
||||||
|
|
||||||
<p> <a href=./tots.html> Top of the Stack </a> <strong>[aka tots]</strong> is my rantings of the most recent things that I have been working on.
|
<p> <a href="/categories/top_of_the_stack/"> Top of the Stack </a> <strong>[aka tots]</strong> is my rantings of the most recent things that I have been working on.
|
||||||
You'll see pretty quickly how many projects get buried under my inability to stay focused and my lack of follow-through.
|
You'll see pretty quickly how many projects get buried under my inability to stay focused and my lack of follow-through.
|
||||||
To make sure that this website is not one of those things, Top of the Stack will be updated at least bi-weekly <strong>[twice a week not every two weeks]</strong> on <em>Mondays</em> and <em>Thursdays</em>, even if it is to just say that I have spent all my free time getting jealous of people on youtube doing/creating cool things instead of actually just doing the things.
|
To make sure that this website is not one of those things, Top of the Stack will be updated at least bi-weekly <strong>[twice a week not every two weeks]</strong> on <em>Mondays</em> and <em>Thursdays</em>, even if it is to just say that I have spent all my free time getting jealous of people on youtube doing/creating cool things instead of actually just doing the things.
|
||||||
</div>
|
</div>
|
||||||
@ -40,7 +40,7 @@
|
|||||||
<div class="text_block">
|
<div class="text_block">
|
||||||
<h3 id="hobbies_heading" class="entry_heading"> <a href=#hobbies_heading>Hobbies</a></h3>
|
<h3 id="hobbies_heading" class="entry_heading"> <a href=#hobbies_heading>Hobbies</a></h3>
|
||||||
|
|
||||||
<h4 class="hobby_heading"><a href="web_development.html">Web Development</a></h4>
|
<h4 class="hobby_heading"><a href="/web_development">Web Development</a></h4>
|
||||||
<p class="description"> Guides and tots posts on developing and expanding this very website.</p>
|
<p class="description"> Guides and tots posts on developing and expanding this very website.</p>
|
||||||
|
|
||||||
<h4 class="hobby_heading"><a href="circuit_design.html">Circuit Design and Fabrication</a></h4>
|
<h4 class="hobby_heading"><a href="circuit_design.html">Circuit Design and Fabrication</a></h4>
|
||||||
|
2
xavishobbies/layouts/shortcodes/image_sc.html
Normal file
2
xavishobbies/layouts/shortcodes/image_sc.html
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
<img class="resize" src="{{ .Get 0 }}" alt="{{ .Get 1 }}" />
|
||||||
|
<figcaption>{{ .Get 2 }}</figcaption>
|
BIN
xavishobbies/static/vultr_1.png
Normal file
BIN
xavishobbies/static/vultr_1.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 15 KiB |
@ -0,0 +1,6 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
|
||||||
|
<h2 class="tots_heading"> 404 </h2>
|
||||||
|
<p> Sorry :( </p>
|
||||||
|
|
||||||
|
{{ end }}
|
@ -0,0 +1 @@
|
|||||||
|
<a href="{{ .Destination | safeURL }}"{{ with .Title}} title="{{ . }}"{{ end }}{{ if strings.HasPrefix .Destination "http" }} target="_blank" rel="noopener noreferrer"{{ end }}>{{ .Text | safeHTML }}</a>
|
@ -2,16 +2,23 @@
|
|||||||
<h2 class="tots_heading"> {{ .Title }}</h2>
|
<h2 class="tots_heading"> {{ .Title }}</h2>
|
||||||
|
|
||||||
{{ .Content }}
|
{{ .Content }}
|
||||||
|
|
||||||
{{ range.Pages }}
|
{{ range where .Site.Pages "Params.categories" "intersect" (slice "Guides") }}
|
||||||
|
|
||||||
|
{{ .Content }}
|
||||||
|
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
|
||||||
|
<h3 style="margin-bottom: 0px"> Tots Posts </h3>
|
||||||
|
{{ range where .Site.Pages "Params.categories" "intersect" (slice "Top_of_the_Stack") }}
|
||||||
|
|
||||||
<div class="tots_post">
|
<div class="tots_post">
|
||||||
<h3 class="entry_heading">{{ .Title }}</h3>
|
<h3 class="entry_heading">{{ .Title }}</h3>
|
||||||
<h5 class="tots_date_category"> {{ .Lastmod }}</h5>
|
<h5 class="tots_date_category"> {{ .Lastmod.Format "2006-01-02" }} - {{ .Description }}</h5>
|
||||||
|
|
||||||
{{ .Content }}
|
{{ .Content }}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
|
||||||
|
@ -2,10 +2,10 @@
|
|||||||
|
|
||||||
<div class="tots_post">
|
<div class="tots_post">
|
||||||
<h3 class="entry_heading">{{ .Title }}</h3>
|
<h3 class="entry_heading">{{ .Title }}</h3>
|
||||||
<h5 class="tots_date_category"> {{ .Lastmod }}</h5>
|
<h5 class="tots_date_category"> {{ .Lastmod.Format "2006-01-02" }} - {{ .Description }}</h5>
|
||||||
|
|
||||||
|
|
||||||
<p>{{ .Content }}</p>
|
<p>{{ .Content }}</p>
|
||||||
|
|
||||||
<p> hi </p>
|
|
||||||
</div>
|
</div>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
@ -136,6 +136,7 @@ img.resize{
|
|||||||
/* tots.html */
|
/* tots.html */
|
||||||
.tots_heading {
|
.tots_heading {
|
||||||
margin-bottom: 30px;
|
margin-bottom: 30px;
|
||||||
|
padding-left: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.entry_heading{
|
.entry_heading{
|
||||||
|
Loading…
Reference in New Issue
Block a user