<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0"
     xmlns:atom="http://www.w3.org/2005/Atom"
     xmlns:content="http://purl.org/rss/1.0/modules/content/"
     xmlns:media="http://search.yahoo.com/mrss/">
  <channel>
    <title>Blogtini</title>
    <link>https://blogtini.com/</link>
    <description>Recent content in Blogtini</description>
    <lastBuildDate>Fri, 14 Feb 2025 00:00:00 GMT</lastBuildDate>
    <atom:link href="https://blogtini.com/index.xml" rel="self" type="application/rss+xml"/>
    <generator>blogtini.com</generator>
    <item>
      <title>Blogtini Turns One!</title>
      <link>https://blogtini.com/2025-02-blogtini-turns-one/</link>
      <guid>https://blogtini.com/2025-02-blogtini-turns-one/</guid>
      <pubDate>Fri, 14 Feb 2025 00:00:00 GMT</pubDate>
      <category domain="category">website</category>
      <category domain="category">features</category>
      <category domain="tag">blogtini</category>
      <category domain="tag">markdown</category>
      <category domain="tag">javascript</category>
      <category domain="tag">comments</category>
      <category domain="tag">email</category>
      <category domain="tag">versions</category>
      <description>Blogtini is now feature complete with everything working! See below for the major features finally finished.</description>
      <media:content url="https://blogtini.com/img/comments.jpg" medium="image"/>
      <content:encoded><![CDATA[Blogtini is now feature complete with everything working!  See below for the major features finally finished.


# Comments

We use [Staticman](https://github.com/eduardoboucas/staticman) for comments.

We've created a free lightweight setup for comments using https://netlify.com "serverless edge" functions.  More information can be seen here: https://github.com/traceypooh/staticmin


# Contact (email) blog maintainer

The contact form is setup -- https://formspree.io is a good option to use and this blog uses it as an example.


# Versioning

Releases now get tagged (eg: `1.0.8`).

Blog sites can opt to use a **specific version** of blogtini, in their site's top-level `theme.js` like this:
```js
import 'https://esm.ext.archive.org/gh/traceypooh/blogtini@1.0.8/index.js?bundle=false'
```
(The default theme then comes from that same version, too.)

Optionally, sites can pick a non-default theme by name in their `config.yml` -- it comes from that same version, too, eg:
```yml
theme: grid
```


# Light/dark mode

Light/dark mode is improved with multiple cosmetic bugs fixed.

There is a new [💡] icon in the top nav bar to toggle between light & dark modes if desired.
(Otherwise, local time & system preferences are used).


# Styling & CSS

This is an internal detail -- but now all markup is created via Web Components, and all the CSS is "inline" inside the web components JS files.  This allows for clean versioning of all CSS, since all the JS files are versioned.


**❤️ Happy Saint Valentine's Day! ❤️**]]></content:encoded>
    </item>
    <item>
      <title>Blogtini SEO</title>
      <link>https://blogtini.com/2024-07-blogtini-seo/</link>
      <guid>https://blogtini.com/2024-07-blogtini-seo/</guid>
      <pubDate>Sat, 06 Jul 2024 00:00:00 GMT</pubDate>
      <category domain="category">website</category>
      <category domain="tag">metadata</category>
      <category domain="tag">search engines</category>
      <category domain="tag">blogtini</category>
      <description>We're now working on improved Search Engine Optimization by adding [head] element tags and JSON-LD</description>
      <media:content url="https://blogtini.com/img/seo.jpg" medium="image"/>
      <content:encoded><![CDATA[We're now working on improved Search Engine Optimization by adding [head] element tags and
[JSON-LD](https://schema.org/BlogPosting)

Looking into a GitHub Actions step to create/update the `sitemap.xml` file as well as dynamically prepend a head with metadata and JSON-LD to the start of blog markdown `.html` files.

Also of interest is sharing markdown blog posts to social networks and pasting links into text messages.  We want the card-like preview with title and image relevant to the blog post to work.]]></content:encoded>
    </item>
    <item>
      <title>Blogtini @ DWebCamp</title>
      <link>https://blogtini.com/2023-06-blogtini-dwebcamp/</link>
      <guid>https://blogtini.com/2023-06-blogtini-dwebcamp/</guid>
      <pubDate>Fri, 23 Jun 2023 00:00:00 GMT</pubDate>
      <category domain="category">website</category>
      <category domain="category">talks</category>
      <category domain="tag">slides</category>
      <category domain="tag">talk</category>
      <category domain="tag">markdown</category>
      <category domain="tag">javascript</category>
      <category domain="tag">blog</category>
      <category domain="tag">website</category>
      <category domain="tag">blogtini</category>
      <description>Here's the slides from my talk at DWebCamp 2023 https://dwebcamp.org/ --&gt; https://tracey.archive.org/dweb-2023</description>
      <media:content url="https://blogtini.com/img/light-and-van-and-trees-vertical_0FLra81.jpg#bottom" medium="image"/>
      <content:encoded><![CDATA[Here's the slides from my talk at DWebCamp 2023 https://dwebcamp.org/ --> https://tracey.archive.org/dweb-2023]]></content:encoded>
    </item>
    <item>
      <title>Blogtini Themes and Web Components - Update</title>
      <link>https://blogtini.com/2023-06-blogtini-themes-and-web-components-updates/</link>
      <guid>https://blogtini.com/2023-06-blogtini-themes-and-web-components-updates/</guid>
      <pubDate>Thu, 15 Jun 2023 00:00:00 GMT</pubDate>
      <category domain="category">website</category>
      <category domain="tag">markdown</category>
      <category domain="tag">javascript</category>
      <category domain="tag">blog</category>
      <category domain="tag">website</category>
      <category domain="tag">blogtini</category>
      <description>Working with the amazing Renior, another volunteer … We've been splitting up the main (javascript) post &quot;crawling&quot; and processing, from the formatting.</description>
      <media:content url="https://blogtini.com/img/theme-picker.png#top" medium="image"/>
      <content:encoded><![CDATA[Working with the amazing
[Renior, another volunteer](https://twitter.com/renoirb) ... We've been splitting up the main (javascript) post "crawling" and processing, from the formatting.

## Themes
That gives us very easy to create themes!  A theme can reuse formating or "business logic" from other themes -- or come up with any number of new ways to display pages and/or the entire site.

The above image shows the theme picker from the top nav menu.

## Web Components
We settled on
[Web Components](https://developer.mozilla.org/en-US/docs/Web/API/Web_components)
which are browser native (as opposed to `react`).

Tracey likes [lit](https://lit.dev/) since it is a lightweight/minimal setup atop
native web components.  But a theme can use any style of web components they like.

## Example
Once the posts are all parsed from your site, they are stored in a browser cache (`localStorage` or `indexedDB`).

When you arrive at a blog post, a page, or a list of posts for a given tag, etc.
the main javascript can simply rewrite the page `<body>` tag to:

```html
<bt-body>
  <bt-posts>
    <bt-post url="first-post-with-tag/"></bt-post>
    <bt-post url="second-post-with-tag/"></bt-post>
    ...
  </bt-posts>
</bt-body>
```

Each web component is its own javacript file that knows how to render the given section.

For example, this is the default theme's
[bt-post](https://blogtini.com/theme/future-imperfect/bt-post.js)
file/component.

Here is a [second theme](https://blogtini.com/theme/grid/index.js) and how it sets itself up --
as overrides to the main theme.]]></content:encoded>
    </item>
    <item>
      <title>Blogtini @ DWebCamp</title>
      <link>https://blogtini.com/2022-08-blogtini-dwebcamp/</link>
      <guid>https://blogtini.com/2022-08-blogtini-dwebcamp/</guid>
      <pubDate>Fri, 26 Aug 2022 00:00:00 GMT</pubDate>
      <category domain="category">website</category>
      <category domain="category">talks</category>
      <category domain="tag">slides</category>
      <category domain="tag">talk</category>
      <category domain="tag">markdown</category>
      <category domain="tag">javascript</category>
      <category domain="tag">blog</category>
      <category domain="tag">website</category>
      <category domain="tag">blogtini</category>
      <description>Here's the slides from my talk at DWebCamp 2022 https://2022.dwebcamp.org/</description>
      <media:content url="https://blogtini.com/img/cn-nighttime-campfire-hero.jpg" medium="image"/>
      <content:encoded><![CDATA[Here's the slides from my talk at DWebCamp 2022 https://2022.dwebcamp.org/

https://tracey.archive.org/dweb-2022]]></content:encoded>
    </item>
    <item>
      <title>blogtini update</title>
      <link>https://blogtini.com/2022-07-blogtini-update/</link>
      <guid>https://blogtini.com/2022-07-blogtini-update/</guid>
      <pubDate>Mon, 25 Jul 2022 00:00:00 GMT</pubDate>
      <category domain="category">website</category>
      <category domain="tag">geek</category>
      <category domain="tag">coding</category>
      <category domain="tag">javascript</category>
      <category domain="tag">markdown</category>
      <category domain="tag">blogtini</category>
      <description>I'm now moving towards a setup that is entirely markdown and js.</description>
      <media:content url="https://tracey.archive.org/dweb-2022/i/view-source.jpg" medium="image"/>
      <content:encoded><![CDATA[I'm now moving towards a setup that is entirely `markdown` and `js`.

I've got client-side searching woriking dynamically with `lunr`.

I'm setting up two `.git` hooks to run a small script before a `git commit` and after a `git merge`.

Then we should be pretty close to a fully automatically updated `sitemap.xml` and `staticman` setup for comments.]]></content:encoded>
    </item>
    <item>
      <title>About the Pooh</title>
      <link>https://blogtini.com/about/</link>
      <guid>https://blogtini.com/about/</guid>
      <pubDate>Mon, 16 Mar 2009 00:00:00 GMT</pubDate>
      <category domain="category">website</category>
      <category domain="tag">tracey</category>
      <category domain="tag">geek</category>
      <category domain="tag">markdown</category>
      <category domain="tag">javascript</category>
      <category domain="tag">devops</category>
      <category domain="tag">video</category>
      <category domain="tag">design</category>
      <category domain="type">page</category>
      <description>I'm into software, UI/UX, video, devops, biking, time-lapse photography, sewing, design, lighting, and interior decorating.</description>
      <media:content url="https://blogtini.com/img/traceymonet.jpg" medium="image"/>
      <content:encoded><![CDATA[## A little (more about me)

I'm into software, UI/UX, video, devops, biking, time-lapse photography, sewing, design, lighting, and
interior decorating.

I have a twin!
![tracey with twin](https://www.hunterleebrown.com/photos/tracey/TraceyGrabs009.jpg)
It's true!


## My Work
I'm presently working at
[Internet Archive](https://archive.org).


# About this site
I modeled this after my personal website https://traceypooh.com that uses
[Hugo](http://gohugo.io/) -- a static site engine written in Go.
(I migrated from wordpress).

- I now write in _Markdown_ - very natural and simple.
- I copied most of the them features from: [Hugo Future Imperfect Slim](https://github.com/pacollins/hugo-future-imperfect-slim), porting from `Go` templates to pure `javascript`
- We can use GitHub or GitLab to host the entire website in a single code repository.
  - It _very_ nicely auto builds/deploy upon each `git push`.
  - It's totally free except for any optional domain name (for modest annual fee, typically ~$20 USD/yr)]]></content:encoded>
    </item>
  </channel>
</rss>
