feat/new site (#41)

* feat: working on new version of the site in Astro

* feat: refactored code structure

* feat: updated home page

* feat: polish layout and design across homepage sections

  Add tablet padding (md:px-10), refine title-bar accent, add stat
  counter borders, improve nerd corner contrast, increase pill spacing,
  restyle readers/sponsors as two-column grid, reorder footer layout,
  remove OPML button rounding, and link readers section to founders anchor.

* refactor: move images/ to public/archive-images/ and remove copy prebuild
  step

* chore: minor improvements and added more creators

* fix: pnpm locking

Author: lmammino

.claude/settings.local.json

@@ -2,7 +2,39 @@
   "permissions": {
     "allow": [
       "Bash(pnpm dev)",
-      "Bash(ls:*)"
+      "Bash(ls:*)",
+      "WebFetch(domain:docs.astro.build)",
+      "Bash(for f in raw_archives/*/metadata.json)",
+      "Bash(do jq -r '[.issueNumber, .date] | @tsv' \"$f\")",
+      "Bash(done)",
+      "Bash(node:*)",
+      "Bash(mkdir:*)",
+      "Bash(pnpm:*)",
+      "Bash(npx playwright:*)",
+      "Bash(lsof:*)",
+      "Bash(do jq:*)",
+      "Bash(python3:*)",
+      "Bash(find:*)",
+      "Bash(grep:*)",
+      "Read(//tmp/**)",
+      "Bash(__NEW_LINE_f8eea16f2bad7195__ echo:*)",
+      "Read(//private/tmp/**)",
+      "Bash(for dir:*)",
+      "Bash(do echo:*)",
+      "Read(//Users/luciano/repos/fullstackbulletin.com/raw_archives/*-$dir-*/**)",
+      "Bash(cat:*)",
+      "WebFetch(domain:fullstackbulletin.github.io)",
+      "Bash(curl:*)",
+      "WebSearch",
+      "WebFetch(domain:pagefind.app)",
+      "Bash(wc -l /Users/luciano/repos/fullstackbulletin.com/views/components/_*.pug)",
+      "Bash(wc -l /Users/luciano/repos/fullstackbulletin.com/raw_archives/*/metadata.json)",
+      "Bash(shasum -a 256 2017-03-13-001-introducing-lottie-airbnb-engineering-data-science/54ba1d29-fdc4-4e32-9470-dd844c9be037.png 2020-01-06-144-why-i-moved-from-react-to-svelte-and-others-will-follow/54ba1d29-fdc4-4e32-9470-dd844c9be037.png 2026-03-09-438-an-interactive-intro-to-crdts/54ba1d29-fdc4-4e32-9470-dd844c9be037.png)",
+      "Bash(xargs shasum:*)",
+      "WebFetch(domain:loige.co)",
+      "Bash(duckdb --version)",
+      "WebFetch(domain:sidebar.io)",
+      "Bash(git:*)"
     ]
   }
 }

.github/workflows/build.yml

@@ -13,19 +13,14 @@ jobs:
     steps:
       - uses: actions/checkout@v4
       - uses: pnpm/action-setup@v2
-        with:
-          version: 8.15
       - uses: actions/setup-node@v4
         with:
-          node-version: 20
+          node-version: 24
           cache: 'pnpm'
+          cache-dependency-path: pnpm-lock.yaml
       - run: pnpm install --frozen-lockfile
-      - name: Test
-        run: pnpm test
-        env:
-          CI: true
       - name: Build
-        run: pnpm prod:build
+        run: pnpm build
         env:
           CI: true
       - name: Release to GH pages if on main
@@ -35,4 +30,4 @@ jobs:
           target_branch: gh-pages
           build_dir: dist
         env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.gitignore

@@ -1,46 +1,11 @@
-# Logs
-logs
+node_modules/
+dist/
+.astro/
 *.log
 npm-debug.log*
-
-# Runtime data
-pids
-*.pid
-*.seed
-
-# Directory for instrumented libs generated by jscoverage/JSCover
-lib-cov
-
-# Coverage directory used by tools like istanbul
-coverage
-
-# nyc test coverage
-.nyc_output
-
-# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
-.grunt
-
-# node-waf configuration
-.lock-wscript
-
-# Compiled binary addons (http://nodejs.org/api/addons.html)
-build/Release
-
-# Dependency directories
-node_modules
-jspm_packages
-
-# Optional npm cache directory
-.npm
-
-# Optional REPL history
-.node_repl_history
-
-.idea
-build-utilities/compiled
-dist/
-dev/
-lib/
-dist-doc/
+pnpm-debug.log*
+.env
+.env.production
 .DS_Store
-
+.idea/
+test-results/

.vscode/extensions.json

@@ -0,0 +1,4 @@
+{
+  "recommendations": ["astro-build.astro-vscode"],
+  "unwantedRecommendations": []
+}

.vscode/launch.json

@@ -0,0 +1,11 @@
+{
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "command": "./node_modules/.bin/astro dev",
+      "name": "Development server",
+      "request": "launch",
+      "type": "node-terminal"
+    }
+  ]
+}

CLAUDE.md

@@ -4,7 +4,7 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co
 
 ## Project Overview
 
-This is the source code for [fullstackbulletin.com](https://fullstackbulletin.com), a static website for the FullStack Bulletin weekly newsletter. The site is built with Pug templates, SCSS, and Webpack, then deployed to GitHub Pages.
+This is the source code for [fullstackbulletin.com](https://fullstackbulletin.com), a static website for the FullStack Bulletin weekly newsletter. Built with Astro and Tailwind CSS, deployed to GitHub Pages.
 
 ## Common Commands
 
@@ -16,29 +16,34 @@ pnpm install
 pnpm dev
 
 # Production build (outputs to dist/)
-pnpm prod:build
+pnpm build
 
-# Run tests
+# Preview production build
+pnpm preview
+
+# Run Playwright tests
 pnpm test
 ```
 
 ## Architecture
 
 ### Build System
+- **Framework**: Astro (static site generation)
+- **Styling**: Tailwind CSS v4
 - **Package Manager**: pnpm
-- **Templates**: Pug (`.pug` files in `views/`)
-- **Styles**: SCSS compiled with node-sass (ITCSS architecture in `assets/scss/`)
-- **JavaScript**: ES2015+ transpiled with Babel, bundled with Webpack
-- **Environment**: Uses `NODE_ENV` and `PACKAGE_OUTPUT` env vars to switch between dev/production
+- **Prebuild**: `generate-data-exports.mjs` and `generate-opml.mjs` generate data files
 
 ### Key Directories
-- `views/` - Pug templates; `index.pug` extends `_layout.pug`, components in `views/components/`
-- `assets/scss/` - ITCSS-organized styles (1-settings through 8-trumps)
-- `assets/scripts/` - JavaScript entry point at `main.js`
-- `settings/data.yml` - Site content data (newsletter config, sponsors, FAQ, founders)
-- `build-utilities/` - Build helper scripts (Babel src in `src/`, compiled to `lib/`)
-- `dist/` - Production output
-- `dev/` - Development output
+- `src/` — Astro source: pages, components, layouts, lib, data, styles
+- `src/content.config.ts` — Content collection config, loads `archive/*/metadata.json`
+- `public/` — Static assets (logos, icons, archive images)
+- `public/archive-images/` — Deduplicated images by SHA-256 hash (committed). Referenced from `metadata.json` as `./hash.ext`
+- `archive/` — Scraped newsletter data (committed). Each issue: `metadata.json` + `index.html`
+- `scripts/` — Utility scripts for scraping, metadata extraction, renaming, deduplication
+- `tests/` — Playwright accessibility tests
 
 ### Deployment
 GitHub Actions workflow (`.github/workflows/build.yml`) builds and deploys to `gh-pages` branch on push to `main`.
+
+### Important Notes
+- `archive/` and `public/archive-images/` are committed to the repo (not gitignored)

README.md

@@ -1,5 +1,43 @@
 # fullstackbulletin.com
 
-[![Build](https://github.com/FullStackBulletin/fullstackbulletin.com/actions/workflows/build.yml/badge.svg)](https://github.com/FullStackBulletin/fullstackbulletin.com/actions/workflows/build.yml)
+Static website for [FullStack Bulletin](https://fullstackbulletin.com), a weekly newsletter for full-stack developers. Built with [Astro](https://astro.build/) and [Tailwind CSS](https://tailwindcss.com/).
 
-The source code for [fullstackbulletin.com](https://fullstackbulletin.com) website.
+## Quick start
+
+```bash
+pnpm install
+pnpm dev       # Start dev server
+pnpm build     # Production build (outputs to dist/)
+pnpm preview   # Preview production build
+pnpm test      # Run Playwright tests
+```
+
+## Project structure
+
+```
+├── archive/                  # Scraped newsletter data (committed)
+├── public/archive-images/    # Deduplicated images by SHA-256 hash (committed)
+├── scripts/                  # Utility scripts (scrape, extract, rename, deduplicate)
+├── src/                      # Astro source (pages, components, layouts, lib)
+├── public/                   # Static assets (logos, icons, archive images)
+├── tests/                    # Playwright accessibility tests
+```
+
+## Scripts
+
+| Script | Description |
+|--------|-------------|
+| `scripts/scrape-archives.mjs` | Scrape newsletter archives from Buttondown |
+| `scripts/extract-metadata.mjs` | Extract structured metadata from scraped HTML |
+| `scripts/rename-archives.mjs` | Normalize archive folder names |
+| `scripts/deduplicate-images.mjs` | Deduplicate images by SHA-256 hash |
+| `scripts/fix-book-covers.mjs` | Fix missing book cover images |
+| `scripts/renumber-issues.mjs` | Renumber issue metadata |
+
+## Deployment
+
+GitHub Actions (`.github/workflows/build.yml`) builds and deploys to the `gh-pages` branch on push to `main`.
+
+## License
+
+[MIT](LICENSE)