index.html

---
layout: default
description: "Backend development blog by DoYoon Kim — Spring, JVM, Kotlin, System Design notes and deep-dives."
---

<!-- Author Hero Section -->
<div class="container">
    <div class="row">
        <div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
            <div class="author-hero">
                <div class="hero-intro">
                    <h1 class="hero-name">DoYoon Kim</h1>
                    <p class="hero-role">Backend Developer</p>
                </div>
                <div class="author-hero-inner">
                    {% if site.sidebar-avatar %}
                    {%- comment -%} animated WebP (57KB) for body img; config keeps .gif for JSON-LD/crawlers {%- endcomment -%}
                    <img class="author-hero-avatar" src="{{ site.sidebar-avatar | replace: '.gif', '.webp' }}" alt="{{ site.title }} avatar" width="64" height="64" loading="eager" fetchpriority="high" />
                    {% endif %}
                    <div class="author-hero-code">
                        <pre class="hero-code-block"><code><span class="code-keyword">const</span> <span class="code-var">doodoo</span> = {
  <span class="code-key">role</span>: <span class="code-string">"Backend Developer"</span>,
  <span class="code-key">focus</span>: [<span class="code-string">"Spring"</span>, <span class="code-string">"JVM"</span>, <span class="code-string">"System Design"</span>],
  <span class="code-key">posts</span>: <span class="code-number">{{ site.posts.size }}</span>,
  <span class="code-key">github</span>: <span class="code-string">"<a href="https://github.com/{{ site.github_username }}" target="_blank" rel="noopener noreferrer">{{ site.github_username }}</a>"</span>
};</code></pre>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


<!-- Blog Stats -->
<div class="container">
    <div class="row">
        <div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
            <div class="blog-stats">
                <span>{{ site.posts.size }} posts</span>
                <span class="stats-sep">&middot;</span>
                <span>{{ site.categories.size }} categories</span>
                <span class="stats-sep">&middot;</span>
                <span>since {{ site.posts.last.date | date: "%Y" }}</span>
            </div>
        </div>
    </div>
</div>

<!-- Pinned Posts -->
{% if site.pinned_posts %}
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
<div class="pinned-posts">
  <h3 class="pinned-label">// pinned</h3>
  {% for pinned_url in site.pinned_posts %}
    {% assign pinned = site.posts | where: "url", pinned_url | first %}
    {% if pinned %}
    <a href="{{ pinned.url | prepend: site.baseurl }}" class="pinned-item" data-category="{{ pinned.categories | first | downcase }}"><span class="cat-dot" style="background: var(--cat-{{ pinned.categories | first | downcase }})"></span>{{ pinned.title }}</a>
    {% endif %}
  {% endfor %}
</div>
</div>
</div>
</div>
{% endif %}

<!-- Category Filter Bar -->
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
<div class="category-filter">
    <button class="category-btn active" data-filter="all" aria-pressed="true">*</button>
    {% assign all_tags = "" | split: "" %}
    {% for post in site.posts %}
        {% for tag in post.tags %}
            {% assign tag_lower = tag | downcase %}
            {% unless all_tags contains tag_lower %}
                {% assign all_tags = all_tags | push: tag_lower %}
            {% endunless %}
        {% endfor %}
    {% endfor %}
    {% for tag in all_tags %}
    <button class="category-btn" data-filter="{{ tag }}" aria-pressed="false">#{{ tag | downcase }}</button>
    {% endfor %}
</div>

<div class="post-list">
{% assign post_list = paginator.posts | default: site.posts %}
{% for post in post_list %}
  {% assign is_pinned = false %}
  {% for pin_url in site.pinned_posts %}
    {% if post.url == pin_url %}{% assign is_pinned = true %}{% break %}{% endif %}
  {% endfor %}
  {% if is_pinned %}{% continue %}{% endif %}
<article class="post-item" data-tags="{{ post.tags | join: ',' | downcase }}" data-category="{{ post.categories | first | downcase }}">
    <a href="{{ post.url | prepend: site.baseurl }}">
        <h2 class="post-item-title"><span class="cat-dot" style="background: var(--cat-{{ post.categories | first | downcase }})"></span>{{ post.title }}</h2>
        {% if post.subtitle %}
        <p class="post-item-excerpt">{{ post.subtitle }}</p>
        {% else %}
        <p class="post-item-excerpt">{{ post.content | strip_html | truncatewords: 25 }}</p>
        {% endif %}
        <div class="post-item-meta">
            <time class="post-date" data-date="{{ post.date | date_to_xmlschema }}" title="{{ post.date | date: '%Y-%m-%d' }}">{{ post.date | date: "%Y-%m-%d" }}</time>
            <span class="read-time">{% include read-time.html content=post.content %}</span>
            {% for tag in post.tags limit:2 %}
            <span class="post-item-tag">#{{ tag | downcase }}</span>
            {% endfor %}
        </div>
    </a>
</article>
{% endfor %}
</div>

<!-- No Results Message -->
<div class="filter-no-results" style="display:none;">
    <div class="filter-no-results-card">
        <svg class="icon" aria-hidden="true"><use href="#icon-pen-to-square"/></svg>
        <h4>No posts in this category yet</h4>
        <p class="filter-no-results-hint">There are no posts matching this filter.</p>
        <button class="filter-no-results-reset" id="filter-reset-btn">Browse all posts &rarr;</button>
    </div>
</div>

<!-- Pagination -->
{% if paginator.total_pages > 1 %}
<nav class="pagination" aria-label="Page navigation">
    <ul class="pagination-list">
        {% if paginator.previous_page %}
        <li class="pagination-item pagination-prev">
            <a href="{{ paginator.previous_page_path | prepend: site.baseurl | replace: '//', '/' }}" aria-label="Previous page">&laquo; Prev</a>
        </li>
        {% else %}
        <li class="pagination-item pagination-prev pagination-disabled" aria-hidden="true">
            <span>&laquo; Prev</span>
        </li>
        {% endif %}

        {% for page in (1..paginator.total_pages) %}
        {% if page == paginator.page %}
        <li class="pagination-item pagination-active" aria-current="page">
            <span>{{ page }}</span>
        </li>
        {% elsif page == 1 %}
        <li class="pagination-item">
            <a href="{{ site.baseurl }}/">{{ page }}</a>
        </li>
        {% else %}
        <li class="pagination-item">
            <a href="{{ site.paginate_path | prepend: site.baseurl | replace: '//', '/' | replace: ':num', page }}">{{ page }}</a>
        </li>
        {% endif %}
        {% endfor %}

        {% if paginator.next_page %}
        <li class="pagination-item pagination-next">
            <a href="{{ paginator.next_page_path | prepend: site.baseurl | replace: '//', '/' }}" aria-label="Next page">Next &raquo;</a>
        </li>
        {% else %}
        <li class="pagination-item pagination-next pagination-disabled" aria-hidden="true">
            <span>Next &raquo;</span>
        </li>
        {% endif %}
    </ul>
</nav>
{% endif %}


</div>
</div>
</div>

<!-- Category Filter + Relative Dates -->
<script src="{{ "/js/index.js" | prepend: site.baseurl }}" defer></script>