Python、Web開発、クラウド技術
==========================

.. raw:: html

   <div class="main-sections">
       <!-- Profile Section -->
       <section class="premium-card profile-section">
           <div class="card-content">
               <div class="profile-header">
                   <i class="fas fa-user-circle"></i>
                   <h3>About Me</h3>
               </div>
               <p>Webやインフラ領域を中心とするソフトウェアエンジニアです。<br>個人でWebサービスの企画・開発・運営を行っています。</p>
               <a href="https://portfolio.sion908.tech/" class="btn btn-outline">
                   <i class="fas fa-external-link-alt"></i>
                   実績・経歴（ポートフォリオ）を見る
               </a>
           </div>
       </section>

       <!-- Services Section -->
       <section class="premium-card services-section">
           <div class="card-content">
               <h3>Supported Services</h3>
               <div class="services-grid">
                   <div class="service-item">
                       <i class="fas fa-book"></i>
                       <h4>まめここ</h4>
                       <p>GTFSデータの可視化・管理プラットフォーム</p>
                       <a href="https://www.mamekoko.sion908.tech/">Go to Site</a>
                   </div>
                   <div class="service-item">
                       <i class="fas fa-presentation"></i>
                       <h4>スライド</h4>
                       <p>登壇資料や技術解説スライドのアーカイブ</p>
                       <a href="https://slide.sion908.tech/">Browse Slides</a>
                   </div>
               </div>
           </div>
       </section>
   </div>

   <section class="premium-card latest-posts">
       <div class="card-content">
           <h3>最新記事</h3>
           <p>技術トレンドから実践的なノウハウまで</p>

.. postlist:: 5
   :date: %Y-%m-%d
   :format: {title} - {date}
   :list-style: disc
   :tags:

.. raw:: html

       </div>
   </section>

   <div class="cta-section">
       <a href="blog/archive.html" class="btn btn-primary">
           <i class="fas fa-arrow-right"></i>
           すべての記事を見る
       </a>
   </div>

   <!-- Recent Activity Section -->
   <section class="premium-card activity-section">
       <div class="card-content uni">
           <h3>Recent Activity</h3>
           <ul class="activity-list">
               <li><strong>2026-03</strong> - Flask + SQLSpec 記事公開</li>
               <li><strong>2025-12</strong> - AIペアプログラミング体験記事</li>
               <li><strong>2025-11</strong> - SQLSpec詳細解説記事</li>
               <li><strong>2025-07</strong> - XServer SSL設定記事</li>
           </ul>
       </div>
   </section>