feat: restore clean Next.js state + Vercel deploy workflow#3
Merged
HarunRRayhan merged 86 commits intomainfrom Apr 14, 2026
Merged
feat: restore clean Next.js state + Vercel deploy workflow#3HarunRRayhan merged 86 commits intomainfrom
HarunRRayhan merged 86 commits intomainfrom
Conversation
Absorbed all planning and market research from the tinytools repo (which was the pre-code research phase for this project). Includes competitor analysis, market sizing, domain research, build plan, and extended tool opportunity lists. tinytools repo is now archived. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…tion to all 10 tools Each tool now includes: - FAQPage JSON-LD schema (6 questions per tool) - how-to-use section (4-5 steps) - Expanded description (2-3 paragraphs) - Visible expandable FAQ section - 3 related tool links Tools updated: base64, case-converter, character-counter, image-cropper, json-formatter, markdown-to-html, remove-duplicate-lines, url-encode, uuid-generator, word-counter (how-to-use added)
Switches markdown-to-html tool from dynamic ESM import to classic script tag CDN load (marked.min.js), matching the spec and ensuring compatibility with Astro's static build output.
- src/lib/usage.ts: cookie-based usage tracker (GUEST_DAILY_LIMIT=10,
FREE_DAILY_LIMIT=50) with readUsage/incrementUsage/isAtLimit exports
- src/lib/useToolUsage.ts: useToolUsage(slug, limit) hook
- src/components/UsageLimitPopup.astro: inline banner shown at limit,
with sign-up CTA and session-storage dismissal
- src/pages/tools/{developer,text,image}.astro: category hub pages
- src/pages/404.astro: 404 page with popular tool suggestions
…house ads (M1.A4-A7)
- Updated meta descriptions on all pages and tool pages to be more descriptive and keyword-rich - Added skip-to-content link, aria-label on nav elements, and id="main-content" on BaseLayout - Added breadcrumb nav, aria-current="page", and section landmark in ToolLayout - Added labels, aria-label, aria-live, role="alert", role="progressbar", role="tab/tablist", aria-pressed, and keyboard support across all tool pages
…n-to-html, base64
… directory, and MCP servers - TOOL_ROADMAP.md: Added three-pillar overview at top (first-party tools, third-party directory, MCP servers). Added full Directory Strategy section with data model, categories, revenue model, and URL structure. Added MCP Server Strategy with 4 servers (tools, reference, directory, webhooks), their interfaces, implementation notes, and a phased roadmap. - INFORMATION_ARCHITECTURE.md: Updated site map to include /directory/ and /mcp/ paths. Added Directory Architecture section (Section 7) covering data storage, page structure, entry pages, SEO, and integration with tool pages. Added MCP Server Architecture section (Section 8) covering repo structure, npm packaging, docs pages on toolblip.com, and the security model. - LAUNCH_PLAN.md: Added Directory Launch section (Section 8, Days 61-120) covering directory infrastructure, MCP server scaffold and npm publish, expansion to 3 MCP servers, and monetization. Added What Not to Build Yet section (Section 9). Updated TL;DR with two new recommendations on directory timing and MCP server build strategy.
Update all MCP server package references to use the @toolblip scope: - @toolblip/tools (was @toolblip/mcp-server-tools) - @toolblip/reference (was @toolblip/mcp-server-reference) - @toolblip/directory (was @toolblip/mcp-server-directory) - @toolblip/webhooks (was implied mcp-server-webhooks) Closes roadmap updates: server descriptions, Claude Desktop config example, and roadmap table all now reflect the scoped npm package names.
- Merged @toolblip/tools, @toolblip/reference, @toolblip/directory into one unified @toolblip/mcp package - Updated MCP Server Strategy section to reflect single-package approach - Updated roadmap table from 4 separate servers to one consolidated package - Updated Claude Desktop config example to use single package - Removed Server 4 (webhooks) deferred section — will be noted separately - Updated est. build time from ~3 weeks to 2-3 weeks for the unified package
- Set up Next.js 16 with App Router, React 19, TypeScript - Create src/app/ structure with layout, homepage, /tools, /directory - Add Tailwind CSS v4 via @tailwindcss/postcss - Add API client helper (src/lib/api.ts) - Exclude Astro/Cloudflare Pages files from Next.js build - Build succeeds: /, /tools, /directory routes generated
- Add /tools/[slug] dynamic route with generateStaticParams for all 10 tools - Create WordCounterClient component (example tool client component) - Add vercel.json (Next.js framework preset) and .vercelignore - Build produces 15 static pages: /, /tools, /directory, and 10 tool pages
- Add 6 working tool client components: WordCounter, CharacterCounter, UuidGenerator, CaseConverter, Base64, RemoveDuplicateLines - Update [slug] page to dynamically render tool components - Remaining 4 tools (JSON Formatter, URL Encode, Image Cropper, Markdown to HTML) show migration placeholder - All 15 pages still build successfully
- Add remaining 4 components: JsonFormatter, UrlEncode, ImageCropper, MarkdownToHtml - All 10 tools now have full interactive client-side implementations - Fix TypeScript target to ES2020 for regex 's' flag support - Build: 15 static pages (homepage, /tools, /directory, 10 tool pages)
Comprehensive SEO + marketing plan covering keyword research (20 keywords), on-page SEO checklists, 12 blog post topics, technical SEO targets, 6 backlink sources, GSC monitoring, distribution channels, launch strategy (weeks 1-4), MCP community building, npm package marketing, and a 30-day sprint plan. Factored in DNS not yet live.
Interactive client-side tool with real-time conversion, syntax-highlighted JSON output, pretty/compact mode, configurable indent size, copy and clear buttons, and YAML parse error display.
Five-mode interactive calculator: basic percentage (X% of Y), percentage change, increase/decrease by %, tip splitter, and discount calculator. Exports toolMeta for discovery. Registers the tool in the All Tools listing and homepage grid.
- Hero + sections: mobile py-10, tablet+ py-12-16, proper px breakpoints - API docs: code blocks use whitespace-pre-wrap so long lines don't overflow - API docs tables: min-w-0 to prevent overflow on small screens - Directory: server cards use sm:grid-cols-2 (showed 2 cols on mobile) - All content pages (about/privacy/terms/donate/advertise): mobile py-10, tablet+ py-16 - Blog post: mobile py-10, tablet+ py-16
A11y scores now 100 on all tested pages:
- Login: 100 | Directory: 100 | Homepage: 100 | /tools: 100
Fixes:
- Cookie banner buttons: aria-label ('Accept/Decline analytics cookies')
- Nav logo link: aria-label='Toolblip home'
- Login/signup 'or' divider: text-gray-400 (was 500, contrast fail)
- Login/signup account text: text-gray-400
- CTA links: added underline for non-color distinction (color-blind safe)
- Directory submit button: aria-label + underline
- Category filter buttons (directory): aria-label
- Search input: aria-label on tools search
- Search clear button: aria-label='Clear search'
- Submit buttons: aria-label on login/signup forms
- Homepage MCP CTA link: aria-label='Browse MCP Directory'
- Blog post back link: aria-label='Back to Blog'
- All SVGs (Google icons, donate icons): aria-hidden='true' (decorative)
- 2026-04-17-json-vs-xml-guide.md — 7 min read, covers when to use JSON vs XML - 2026-04-17-regex-cheatsheet.md — 6 min read, practical regex patterns with examples 15 blog posts total
- CookieBanner extracted to client component with proper event-based consent - Analytics component fires GA only after user clicks 'Accept' - GA only loaded when NEXT_PUBLIC_GA_MEASUREMENT_ID is set AND user consents - Privacy page already explains GA behavior (cookieless Cloudflare always on, GA opt-in only) - Cookie consent persisted in localStorage, banner only shows on first visit without consent - GA Script + gtag loaded via custom event system from CookieBanner
…eEffect requires client)
Login/signup are now server pages with metadata + client form components. LoginForm.tsx and SignupForm.tsx handle all interactive logic. Added role=alert on error messages for accessibility. New blog post: random string generation in JavaScript (19 posts total)
- Tool page template: add How to Use steps + FAQ sections for flagship tools - JSON Formatter and Base64 now have how-to steps and FAQs - FAQ schema JSON-LD added to each tool page - New blog posts: Regex Tester Guide, JWT Decoder Guide, Unix Timestamp Guide - 3 new cornerstone SEO posts targeting high-volume developer keywords
Exclude SOUL.md, AGENTS.md, MEMORY.md, TOOLS.md, HEARTBEAT.md, IDENTITY.md, BOOTSTRAP.md, DREAMS.md, memory/, and .openclaw/ from version control — these are agent workspace files, not project files
- All 19 tools now have FAQ sections with 2 questions each - Added cornerstone blog post: 'JSON Formatter: Debug Your API Responses Like a Pro'
…edImage component - Redesigned blog listing as 2-col card grid with gradient headers - Added FeaturedImage client component with onError fallback to gradient - Added featuredImage field to all 25 blog posts via script - Fixed blog post page to handle both date + publishDate frontmatter - OG image now uses featuredImage when available - CATEGORY_GRADIENTS map for consistent per-category colors
…aticParams - Added Article JSON-LD structured data for SEO - Added author bio card at bottom of posts - Added related posts section (same category, up to 3) - Added Twitter/LinkedIn share links in post header - Added generateStaticParams for full SSG (64 total pages) - Refactored to use shared getAllPosts() for related posts - Blog posts now pre-rendered at build time
- Created CopyButton client component (clipboard with fallback) - Created CodeBlock client component (wraps pre with copy button) - Updated API docs with CodeBlock for auth header + error format examples - Copy button appears on hover with 2s '✓ Copied' feedback
- Added server-side blog post fetching to homepage - Shows 3 most recent posts as cards with category, title, reading time - 'View all →' link to /blog - Works as static page (reads at build time)
- word-counter: added howToUse + faqs (3 Q&A) - character-counter: added howToUse + faqs (3 Q&A) - yaml-to-json: added howToUse + faqs (3 Q&A) - 8 tools that had howToUse but no faqs: added faqs - FAQPage JSON-LD schema already rendered in template - All 19 tools now have FAQ sections
Free tools used: AnswerThePublic, AlsoAsked, Keyword Tool IO, Ubersuggest, Google Keyword Planner, Answer Socrates, Keywords Everywhere, ChatGPT Covers: all 19 tool categories with keyword tables, intent classification, long-tail how-to keywords, commercial investigation keywords, pSEO page targets, priority matrix
…tory - Add error.tsx and global-error.tsx with useful error messages + Try Again - Add PasswordStrength component (weak/fair/good/strong indicator) - Update SignupForm with live password strength feedback - Expand directory seed data: 12 realistic MCP servers with stars, descriptions, real GitHub URLs - All pages still build clean (66 static)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Restores the Next.js implementation and adds GitHub Actions for auto-deploy to Vercel on push to main.