Skip to content

Conversation

@ihabadham
Copy link
Contributor

@ihabadham ihabadham commented Oct 9, 2025

What Changed

Phase 3 of the IA redesign: consolidated multiple conflicting entry points, improved the tutorial, and cleaned up outdated documentation.

1. Entry Point Consolidation

Created unified homepage:

  • docs/introduction.md - New comprehensive homepage with clear learning paths

Removed/simplified conflicting entry points:

  • ✅ Deleted docs/home.md - old website homepage (replaced by introduction.md)
  • ✅ Simplified docs/README.md (173→65 lines) - now serves GitHub users only
  • ✅ Deleted docs/core-concepts/react-on-rails-overview.md - content consolidated into introduction.md

Transformed getting-started guide:

  • docs/getting-started.mddocs/getting-started/using-react-on-rails.md
  • Changed from mixed installation/concepts to focused conceptual guide
  • Explains HOW React on Rails works (not step-by-step installation)

Cleanup:

  • ✅ Deleted orphaned docs/guides/advanced/README.md

2. Tutorial Improvements

Enhanced docs/getting-started/tutorial.md:

  • Extracted Heroku deployment (139 lines) to dedicated guide
  • Fixed outdated versions: Ruby 3.0+, Rails 7+, React on Rails v16 (was 2.7, Rails 7, v13)
  • Clarified Redux vs Hooks usage in installer
  • Merged duplicate HMR sections - combined "HMR vs React Hot Reloading" and "Using HMR with shakapacker"
  • Reorganized structure - renamed "Other features" → "Going Further" with clear subsections

Enhanced docs/deployment/heroku-deployment.md:

  • ✅ Merged tutorial's comprehensive Heroku instructions (was minimal guide)
  • ✅ Added note about version currency and link to Heroku's Rails 7 guide

3. Documentation Cleanup

Deleted outdated manual installation guide:

  • ✅ Removed docs/advanced-topics/manual-installation-overview.md
  • Had "TODO: Review this file" since 2018
  • Confused purpose: title said "Manual Installation" but subtitle said "summarizes what generator does"
  • Confirmed with team (Judah) that it was meant to document manual steps, but:
    • Generator IS the manual installation (not external CLI)
    • Referenced outdated patterns (/client, webpacker, missing auto-bundling)
    • No clear use case for truly manual installation without generator

4. Planning Documentation Updates

Updated tracker docs:

  • 04-ia-redesign-plan.md - marked Phase 3 complete, noted actual vs planned changes
  • ia-redesign-live.md - comprehensive Phase 3 completion documentation

Files Changed (10 commits)

Created:

  • docs/introduction.md (new unified homepage)
  • docs/getting-started/using-react-on-rails.md (transformed from getting-started.md)

Modified:

  • docs/README.md (simplified for GitHub users)
  • docs/getting-started/tutorial.md (extracted deployment, fixed versions, reorganized)
  • docs/deployment/heroku-deployment.md (merged tutorial content)
  • docs/planning/docs-improvement/04-ia-redesign-plan.md (updated status)
  • docs/planning/docs-improvement/ia-redesign-live.md (documented Phase 3)

Deleted:

  • docs/home.md
  • docs/core-concepts/react-on-rails-overview.md
  • docs/guides/advanced/README.md
  • docs/advanced-topics/manual-installation-overview.md

Why

Problem 1.2: Multiple Conflicting Entry Points

Users faced 4+ different starting points with conflicting information:

  • README.md (GitHub)
  • home.md (website homepage)
  • getting-started.md (mixed purposes)
  • react-on-rails-overview.md (outdated prereqs)

Each had different content, creating confusion about where to start.

Tutorial overwhelm:

  • Long Heroku deployment section disrupted learning flow
  • Outdated version references (Ruby 2.7, RoR v13)
  • Duplicate HMR explanations
  • Unclear Redux vs Hooks usage

Outdated documentation:

  • Manual installation guide referenced 2018 patterns
  • Confused generator documentation with manual installation alternative

What's Next

Website Configuration (sc-website repo)

  • Update gatsby-node.js to use introduction.md as homepage
  • Filter out /docs/planning/ from website build
  • Update category order to match new structure

Future phases:

  • Content structure improvements
  • File naming conventions
  • Outdated content removal

(Future phases are repo cleanup tasks - website filtering will hide them from users)

Review Focus

  • Does the new introduction.md provide a clear, unified starting point?
  • Is using-react-on-rails.md more focused as a conceptual guide?
  • Are the tutorial improvements helpful (deployment extraction, version fixes)?
  • Was deleting manual-installation-overview.md the right call?

Note: Planning docs in /docs/planning/docs-improvement/ are for development only and will be filtered from the website in Phase 1.


This change is Reviewable

Summary by CodeRabbit

  • Documentation
    • Major reorganization: new Introduction, simplified README and condensed Documentation Categories; learning paths reworked, navigation tips added, Pro link emphasized, many legacy/outdated pages removed or folded into top-level categories; prerequisites and tutorials refreshed.
  • Examples
    • Demo and tests updated to React Router v6 with matching routing and SSR adjustments.
  • Chores
    • Expanded deployment (Heroku) and process-manager guidance; small user-facing help text and documentation housekeeping updates.

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Oct 9, 2025

Note

Other AI code review bot(s) detected

CodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review.

Walkthrough

Large documentation information‑architecture overhaul: many docs deleted or reorganized, new docs/introduction.md and docs/getting-started/using-react-on-rails.md added, Heroku/deployment guides expanded, dummy spec app migrated to react-router-dom v6, and a process-manager help URL/text updated. No public API changes.

Changes

Cohort / File(s) Summary
Documentation root & entry
docs/README.md, docs/introduction.md, docs/home.md
README simplified; new introduction.md added as unified entry; home.md removed.
Getting started / Tutorials
docs/getting-started/*, docs/getting-started/using-react-on-rails.md, docs/getting-started/tutorial.md, docs/getting-started/quick-start.md, docs/getting-started/installation-into-an-existing-rails-app.md, docs/getting-started/project-structure.md
Monolithic getting-started removed; new focused using-react-on-rails page added; tutorial prerequisites updated; quick-start/install wording and project-structure revamped (Modern auto-bundling vs Traditional).
API reference
docs/api-reference/*, docs/api-reference/README.md, docs/api-reference/configuration.md, docs/api-reference/generator-details.md, docs/api-reference/redux-store-api.md, docs/api-reference/view-helpers-api.md
API README content pared; configuration heading added; generator-details expanded with Default vs Redux scaffolds; small heading/link and Pro cross-reference updates.
Building features & patterns
docs/building-features/*, docs/building-features/react-router.md, docs/building-features/images.md, docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md, docs/building-features/process-managers.md
React Router doc rewritten for v6 (SSR examples); process-managers.md added; images/assets heading changed; multiple heading/format edits across feature docs.
Core concepts & advanced topics
docs/core-concepts/*, docs/advanced-topics/*, docs/advanced-topics/rails-engine-integration.md
Webpack references updated to Shakapacker; several overview/manual-installation files removed; engine integration header and issue links adjusted.
Deployment & troubleshooting
docs/deployment/*, docs/deployment/heroku-deployment.md, docs/deployment/troubleshooting-when-using-shakapacker.md, docs/deployment/troubleshooting-when-using-webpacker.md, docs/deployment/troubleshooting-build-errors.md
Heroku guide substantially expanded (app creation, multi-buildpack, Postgres migration, Puma config, Node/Yarn engines, deploy steps); troubleshooting pages restructured and clarified.
Misc / Pro / credits
docs/misc/*, docs/pro/react-on-rails-pro.md
Cross-links updated to introduction.md; credits and dependency-update titles adjusted; Pro doc heading promoted to H1.
Planning & IA records
docs/planning/docs-improvement/*, docs/guides/advanced/README.md
IA planning updated to record Phase 3 consolidations; advanced guide README content removed.
Outdated docs removed
docs/outdated/* (many)
Numerous outdated docs deleted (webpack tips, deferred-rendering, rails-assets*, upgrade guides, rails3 notes, etc.).
Spec / Dummy app — React Router v6 migration
spec/dummy/client/app/components/RouterLayout.jsx, spec/dummy/client/app/routes/routes.jsx, spec/dummy/client/app/startup/RouterApp.server.jsx, spec/dummy/client/app/startup/RouterApp.client.jsx, spec/dummy/package.json
Dummy app updated to react-router-dom v6: SwitchRoutes, Route component={}Route element={...}, relative/wildcard routes, server import from react-router-dom/server, BrowserRouter future props added, dependency bumped to ^6.0.0.
Process manager message & spec
lib/react_on_rails/dev/process_manager.rb, spec/react_on_rails/dev/process_manager_spec.rb
Process manager help/install message URL and test assertion updated to reference ddollar/foreman "Don't‑Bundle‑Foreman".

Sequence Diagram(s)

sequenceDiagram
  participant Browser as Client Browser
  participant Rails as Rails App
  participant ServerEntry as Server Entry (SSR)
  participant ReactApp as React Router v6 App

  rect rgba(248,249,250,0.9)
  Note left of Rails: Server-side render flow (StaticRouter + v6 Routes)
  Browser->>Rails: GET /some/path
  Rails->>ServerEntry: renderToString(StaticRouter location=/some/path)
  ServerEntry->>ReactApp: Render with StaticRouter + Routes/Route
  ReactApp-->>ServerEntry: HTML string
  ServerEntry-->>Rails: return server HTML
  Rails-->>Browser: HTML response
  end

  rect rgba(248,249,250,0.9)
  Note right of Browser: Client hydration and routing (BrowserRouter + future props)
  Browser->>ReactApp: hydrate with BrowserRouter (Routes/Route)
  ReactApp-->>Browser: interactive client app (v6 element-based routes)
  end
Loading

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~45 minutes

Potential focus areas during review:

  • React Router v6 migration in spec/dummy (route shapes, wildcard paths, server import, BrowserRouter future props).
  • Cross-link integrity after large-scale docs deletions/renames and website homepage mapping.
  • Heroku deployment additions (commands, multi-buildpack steps, Postgres migration, Puma config snippets).
  • generator-details expansion (Default vs Redux scaffold/layout differences).

Possibly related issues

  • Update the tutorial #1707 — Tutorial version and prerequisite updates in this PR align with the issue's tutorial/version concerns.

Possibly related PRs

Suggested reviewers

  • justin808
  • alexeyr-ci2

Poem

🐰 I hopped through files with nimble feet,

Trimmed old paths and made the intro neat,
Routes now dance in v6's element art,
Docs rearranged — a tidier start,
Crunching carrots, one small commit at a time.

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title Check ✅ Passed The pull request title "docs: Entry Point Consolidation and Tutorial Improvements" is directly and fully related to the main changes in this changeset. The PR implements Phase 3 of a documentation redesign that consolidates multiple entry points (removing docs/home.md and docs/core-concepts/react-on-rails-overview.md, adding docs/introduction.md as a unified entry point, and simplifying docs/README.md) and improves the tutorial with version corrections, reorganization, and extraction of deployment content. The title is concise, uses clear language without vague terms or noise, and is specific enough that a teammate scanning commit history would immediately understand the primary changes involve structural documentation reorganization and tutorial enhancements.
Docstring Coverage ✅ Passed Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%.
✨ Finishing touches
  • 📝 Generate docstrings
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch feature/docs-ia-redesign-1845-continue

Comment @coderabbitai help to get the list of available commands and usage tips.

@ihabadham ihabadham changed the title docs: Phase 3 - Entry Point Consolidation and Tutorial Improvements docs: Entry Point Consolidation and Tutorial Improvements Oct 9, 2025
@claude
Copy link

claude bot commented Oct 9, 2025

PR Review: Phase 3 - Entry Point Consolidation and Tutorial Improvements

Overall Assessment

Strong approval - This is excellent documentation work that significantly improves the user experience. The consolidation of entry points and modernization of the tutorial are well-executed.


Strengths

1. Clear Entry Point Strategy

  • The new introduction.md provides a clean, unified homepage with clear learning paths
  • Removing conflicting entry points (home.md, react-on-rails-overview.md) eliminates confusion
  • The simplified README.md (173→65 lines) appropriately serves GitHub users only

2. Improved Tutorial Structure

  • Version updates are critical: Ruby 3.0+, Rails 7+, React on Rails v16 (was 2.7, Rails 7, v13)
  • Heroku extraction (139 lines) to dedicated guide improves flow and focus
  • Redux vs Hooks clarification helps users make informed choices
  • Merged duplicate HMR sections reduce confusion

3. Better Content Organization

  • using-react-on-rails.md is now focused on concepts (not mixed installation steps)
  • Clear separation between conceptual understanding and hands-on tutorial
  • Logical progression: Introduction → Quick Start → Tutorial

4. Documentation Quality

  • Writing is clear, concise, and well-structured
  • Good use of callouts, navigation aids, and visual hierarchy
  • Appropriate use of tables, bullet points, and code examples

Code Quality & Best Practices

Excellent ✅

  • Markdown formatting: Consistent and clean
  • Link structure: All internal links use relative paths correctly
  • Content accuracy: Technical details are accurate and up-to-date
  • No broken references: File moves handled correctly with updated links

Specific Review Points

1. Was deleting manual-installation-overview.md the right call? ✅ YES

  • File had "TODO: Review this file" since 2018
  • Referenced outdated patterns (webpacker, /client directory)
  • Confused purpose (title vs subtitle mismatch)
  • Generator IS the installation method - no separate manual process needed
  • Verdict: Correct decision to delete

2. New introduction.md as unified starting point? ✅ EXCELLENT

  • Clear value proposition (lines 19-27)
  • Helpful "When to Use" vs "Consider alternatives" sections
  • Multiple learning paths for different user types
  • Good balance of overview and next steps

3. using-react-on-rails.md as conceptual guide? ✅ MUCH IMPROVED

  • Now focused on understanding concepts vs step-by-step installation
  • Better explains auto-bundling vs manual registration
  • Clear explanation of render-functions and railsContext
  • Appropriate links to deeper resources

4. Tutorial improvements helpful? ✅ VERY HELPFUL

  • Version updates prevent confusion with deprecated/old versions
  • Redux vs Hooks clarity helps users choose appropriate path
  • Heroku deployment extraction improves tutorial flow
  • Note about version currency with link to Heroku Rails 7 guide is professional touch

Potential Issues

Minor Concerns

1. Heroku Deployment Guide - Outdated Version Note

The note at the top of heroku-deployment.md:

> **Note:** This guide is based on the working tutorial app at [reactrails.com](https://reactrails.com). 
> While the instructions work, some versions referenced are older.

Suggestion: Consider a follow-up task to update the Heroku guide with current versions to maintain consistency with the tutorial's modern versions.

2. PostgreSQL Setup in Heroku Guide

The Heroku guide shows Rails 6+ command but the tutorial targets Rails 7+:

rails db:system:change --to=postgresql

This is fine but could clarify "Rails 6+" → "Rails 6-7" or just "Rails 6+" depending on support scope.

3. Link to Planning Docs

The PR body mentions:

Planning docs in /docs/planning/docs-improvement/ are for development only and will be filtered from the website in Phase 1.

These docs (04-ia-redesign-plan.md, ia-redesign-live.md) are included in this PR. Consider whether they should be in a separate tracking/planning repo to avoid cluttering the main docs directory.


Performance Considerations

N/A - Documentation changes only, no runtime performance impact.


Security Concerns

None identified - Documentation changes pose no security risks.


Test Coverage

Appropriate - Documentation changes don't require automated tests. Manual review and link checking are appropriate.

Recommendation: Consider adding link validation to CI to catch broken links in future PRs.


Style & Conventions

Follows CLAUDE.md guidelines:

  • Markdown formatting is clean
  • File organization follows repository conventions
  • No linting issues (docs don't require RuboCop/Prettier)
  • Appropriate trailing newlines

Suggestions for Follow-up

  1. Phase 1 Website Config (mentioned in PR):

    • Update gatsby-node.js to use introduction.md as homepage
    • Filter /docs/planning/ from website build
  2. Heroku Guide Modernization:

    • Update version references to match tutorial (Ruby 3.0+, Rails 7+)
    • Remove or update the "outdated versions" caveat
  3. Link Validation:

    • Add CI check for broken links in documentation
  4. Planning Docs Location:

    • Consider moving to separate tracking location or GitHub Issues/Projects

Final Verdict

✅ LGTM - Approve and Merge

This PR successfully:

  • ✅ Solves Problem 1.2 (Multiple Conflicting Entry Points)
  • ✅ Improves tutorial quality and accuracy
  • ✅ Removes outdated/confusing documentation
  • ✅ Maintains high documentation standards
  • ✅ Sets foundation for future IA improvements

The documentation is now clearer, more accurate, and provides a better user experience. The identified minor concerns are truly minor and don't block this excellent work.

Great job @ihabadham! 🎉


Review Checklist
  • ✅ Code quality and best practices
  • ✅ No bugs or issues identified
  • ✅ No performance concerns (docs only)
  • ✅ No security concerns
  • ✅ Appropriate test coverage approach
  • ✅ Follows repository conventions (CLAUDE.md)
  • ✅ Clear improvement to user experience
  • ✅ Well-documented changes in PR description

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 4

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (2)
docs/getting-started/tutorial.md (1)

125-128: Tag the environment variables code fence.

Markdownlint MD040 flags this block. Add a language (e.g., bash) to satisfy linting.

-```
+```bash
 EXECJS_RUNTIME=Node
docs/planning/docs-improvement/ia-redesign-live.md (1)

402-478: Add a language tag to the folder-structure fence.

Markdownlint complains about this fence lacking a language. Tag it as text (or similar) to keep lint happy.

-```
+```text
 docs/
 ├── introduction.md              # ✅ Created - new unified homepage
 ├── README.md                    # ✅ Simplified for GitHub users
@@
 └── advanced-topics/ (1 file - KEEPING as category)
     └── rails-engine-integration.md            # Step 5 correction: from deployment
📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 80eb21e and b3493ca.

📒 Files selected for processing (15)
  • docs/README.md (3 hunks)
  • docs/advanced-topics/manual-installation-overview.md (0 hunks)
  • docs/core-concepts/react-on-rails-overview.md (0 hunks)
  • docs/deployment/heroku-deployment.md (2 hunks)
  • docs/getting-started.md (0 hunks)
  • docs/getting-started/installation-into-an-existing-rails-app.md (0 hunks)
  • docs/getting-started/quick-start.md (1 hunks)
  • docs/getting-started/tutorial.md (8 hunks)
  • docs/getting-started/using-react-on-rails.md (1 hunks)
  • docs/guides/advanced/README.md (0 hunks)
  • docs/home.md (0 hunks)
  • docs/introduction.md (1 hunks)
  • docs/misc/doctrine.md (1 hunks)
  • docs/planning/docs-improvement/04-ia-redesign-plan.md (1 hunks)
  • docs/planning/docs-improvement/ia-redesign-live.md (2 hunks)
💤 Files with no reviewable changes (6)
  • docs/guides/advanced/README.md
  • docs/advanced-topics/manual-installation-overview.md
  • docs/getting-started.md
  • docs/home.md
  • docs/core-concepts/react-on-rails-overview.md
  • docs/getting-started/installation-into-an-existing-rails-app.md
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{js,jsx,ts,tsx,css,scss,json,yml,yaml,md}

📄 CodeRabbit inference engine (CLAUDE.md)

Prettier is the sole authority for formatting all non-Ruby files; never manually format them

Files:

  • docs/getting-started/quick-start.md
  • docs/misc/doctrine.md
  • docs/getting-started/using-react-on-rails.md
  • docs/introduction.md
  • docs/README.md
  • docs/deployment/heroku-deployment.md
  • docs/getting-started/tutorial.md
  • docs/planning/docs-improvement/04-ia-redesign-plan.md
  • docs/planning/docs-improvement/ia-redesign-live.md
🪛 markdownlint-cli2 (0.18.1)
docs/getting-started/using-react-on-rails.md

150-150: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

docs/deployment/heroku-deployment.md

100-100: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

docs/getting-started/tutorial.md

150-150: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

docs/planning/docs-improvement/ia-redesign-live.md

402-402: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (10)
  • GitHub Check: dummy-app-integration-tests (3.4, 22)
  • GitHub Check: dummy-app-integration-tests (3.2, 20)
  • GitHub Check: rspec-package-tests (3.2, minimum)
  • GitHub Check: rspec-package-tests (3.4, minimum)
  • GitHub Check: rspec-package-tests (3.2, latest)
  • GitHub Check: rspec-package-tests (3.4, latest)
  • GitHub Check: claude-review
  • GitHub Check: markdown-link-check
  • GitHub Check: build
  • GitHub Check: build-and-test

@claude
Copy link

claude bot commented Oct 9, 2025

Pull Request Review: Entry Point Consolidation and Tutorial Improvements

Overall Assessment ✅

This is an excellent documentation improvement that successfully addresses the problem of multiple conflicting entry points. The changes are well-thought-out and significantly improve the user experience. I recommend approval with minor suggestions below.


Strengths 🎯

1. Clear Information Architecture

  • Excellent consolidation: The new introduction.md provides a clear, unified homepage with well-defined learning paths
  • Smart file organization: Moving getting-started.mdusing-react-on-rails.md better reflects its conceptual nature
  • Reduced confusion: Eliminating 4 conflicting entry points down to 1 primary entry makes onboarding much clearer

2. Content Quality

  • Well-structured introduction: The new introduction.md has:
    • Clear value proposition ("What is React on Rails?")
    • Practical use cases ("When to Use React on Rails")
    • Multiple learning paths for different user types
    • Appropriate system requirements placement
  • Conceptual clarity: using-react-on-rails.md successfully focuses on HOW things work rather than mixing installation steps
  • Improved tutorial: Extracting Heroku deployment (139 lines) to a dedicated guide improves tutorial flow

3. Documentation Hygiene

  • Proper cleanup: Removing outdated manual-installation-overview.md (TODO since 2018) is the right call
  • No broken links: All internal references updated correctly
  • Files end with newlines: ✅ Formatting requirements met

Suggestions for Improvement 💡

Minor Issues

1. Heroku Deployment Content (Low Priority)

The merged Heroku deployment guide contains some older patterns:

Lines 52-75 (docs/deployment/heroku-deployment.md):

default: &default
  adapter: postgresql
  username:
  password:
  host: localhost

Suggestion: Modern Rails 7+ uses DATABASE_URL environment variable pattern. Consider adding a note that this is legacy format or updating to current best practices.

Lines 86-98 (docs/deployment/heroku-deployment.md):
The Puma configuration references older patterns. The PR description acknowledges this with a disclaimer at the top, which is good, but consider:

  • Adding inline comments about what's changed in recent versions
  • Or simplifying to just reference Heroku's official Rails 7 guide

Severity: Low - The disclaimer at the top addresses this adequately.


2. Tutorial Version References

Line 113 (docs/getting-started/tutorial.md):

**Note on Redux:** The basic installer uses React Hooks for state management...

Observation: This is clear and helpful! The clarification about Redux vs Hooks is excellent. ✅

Lines 60-61 mention checking Rails 7.0+, which is good and matches the stated requirements.


3. Introduction.md Minor Polish

Line 199 (docs/getting-started/using-react-on-rails.md):

{
  renderedHtml: {
    componentHtml, redirectLocation, error;  // ← Semicolons should be commas
  }
}

Issue: JavaScript object syntax error - should use commas, not semicolons between properties.

Fix:

{
  renderedHtml: {
    componentHtml, 
    redirectLocation, 
    error
  }
}

Severity: Medium - This is example code that won't run as written.


4. README.md Simplification

The simplified docs/README.md is much better! Good job reducing from 173 → 65 lines.

Minor suggestion: Consider whether lines 44-50 (the "I want to..." table) duplicates content from introduction.md. It's fine to have this for GitHub users, but ensure consistency if use cases change.


Validation Checklist ✅

Based on CLAUDE.md requirements:

  • ✅ Files end with newline character
  • ✅ No RuboCop offenses (docs-only PR)
  • ✅ No broken internal links found
  • ✅ Planning docs appropriately documented
  • ✅ No security concerns
  • ✅ Proper markdown formatting
  • ⚠️ Minor JavaScript syntax error in example code (line 192 in using-react-on-rails.md)

Performance Considerations ⚡

Not applicable - documentation changes only. No runtime performance impact.


Security Concerns 🔒

None identified. Documentation changes pose no security risks.


Test Coverage 🧪

Not applicable for documentation. However, consider:

  • Manual verification that all internal links work (automated link checker would be valuable)
  • Smoke test the Heroku deployment instructions if possible

Recommended Next Steps 🚀

As noted in the PR description:

  1. Website Configuration (separate repo): Update Gatsby config to use introduction.md as homepage
  2. Filter planning docs: Ensure /docs/planning/ is filtered from website builds
  3. Consider: Adding automated link checking to CI for future documentation PRs

Final Recommendation

✅ APPROVE with one minor fix required:

Required: Fix JavaScript syntax error in docs/getting-started/using-react-on-rails.md:192

Optional: Consider updating Heroku database.yml example to modern pattern (or keep with disclaimer)

This PR significantly improves documentation usability and follows the Rails doctrine of "convention over configuration" by establishing clear, opinionated entry points. Excellent work! 🎉


Review Philosophy Note

Following the project's doctrine of professional objectivity: While this is overwhelmingly positive feedback, I've highlighted the genuine issues found (JavaScript syntax error) and areas where current best practices have evolved (Heroku config). The consolidation strategy is sound and well-executed.

@claude
Copy link

claude bot commented Oct 9, 2025

Code Review: Entry Point Consolidation and Tutorial Improvements

I've reviewed PR #1860, which addresses Phase 3 of the IA redesign by consolidating entry points and improving the tutorial. Overall, this is excellent work that significantly improves documentation clarity and user experience.


✅ Strengths

1. Entry Point Consolidation (Problem 1.2 - Solved!)

Excellent execution. The new structure creates a clear, single source of truth:

  • introduction.md - Well-written unified homepage with clear explanations
  • README.md - Properly simplified for GitHub users (173 → 65 lines)
  • Deletions are justified - All removed files were redundant or outdated

2. Tutorial Improvements

  • Version updates are correct: Ruby 3.0+, Rails 7, React on Rails v16
  • Redux vs Hooks clarification added
  • Structure reorganization improves flow

3. Heroku Deployment Guide

  • Content merger is valuable - Comprehensive instructions
  • Link to Heroku's Rails 7 guide - Good practice

⚠️ Minor Improvements

1. Heroku Deployment Guide - Version Currency Note

Consider being more specific about which versions are dated (Node 16.19.0, Yarn 1.22.4) or add a date stamp.

2. Tutorial.md - Heroku Section

The PR description says "Extracted Heroku deployment (139 lines)" but the section remains in tutorial.md (lines 150-289). This seems intentional for basic steps, but may confuse PR readers.

3. Puma Configuration Duplication

Both tutorial.md (lines 235-263) and heroku-deployment.md (lines 68-96) contain identical Puma configuration. Consider keeping detailed config only in deployment guide and referencing it from tutorial.

4. File Verification

Confirm docs/getting-started/using-react-on-rails.md is correctly added (245 additions shown in metadata).


🔒 Security & Best Practices

Security: No concerns - documentation-only changes
CLAUDE.md Compliance: Follows project conventions
Recommendation: Run rake autofix before committing for Prettier formatting


📋 Summary

Category Rating
Code Quality ⭐⭐⭐⭐⭐
Documentation ⭐⭐⭐⭐⭐
Best Practices ⭐⭐⭐⭐⭐
Security

🚀 Recommendation: APPROVE with minor suggestions

This PR successfully achieves its goals. The minor suggestions above are optional improvements.

Before merging:

  1. Verify all new files are committed (especially using-react-on-rails.md)
  2. Run rake autofix for Prettier formatting
  3. Consider addressing Puma duplication

Great work! 🎉

@ihabadham ihabadham force-pushed the feature/docs-ia-redesign-1845-continue branch from 5388efb to 5e71aeb Compare October 12, 2025 19:26
@claude
Copy link

claude bot commented Oct 12, 2025

PR Review: Entry Point Consolidation and Tutorial Improvements

This is excellent work that significantly improves documentation structure! Here is my detailed review:

Strengths

1. Excellent Entry Point Consolidation

  • The new introduction.md is outstanding - clear, well-structured, and provides multiple learning paths
  • Successfully eliminates conflicting entry points
  • The Choose your path approach is user-friendly
  • Clear distinction between What, Why, and When to use sections

2. Strong Conceptual Guide

  • using-react-on-rails.md is much more focused
  • Excellent progression from installation to advanced concepts
  • Good use of code examples
  • Proper separation of concepts from step-by-step installation

3. Tutorial Improvements

  • Critical fix: Updated to Ruby 3.0+, Rails 7, React on Rails v16
  • Excellent decision to extract Heroku deployment to dedicated guide
  • Much cleaner flow without deployment interruption

4. README Simplification

  • Reduced from 173 to 65 lines - much more scannable
  • Clear focus on directing GitHub users to documentation website

Issues Found

1. Syntax Error in using-react-on-rails.md line 192
The object has semicolon instead of comma after error

2. Formatting Check Required
Per CLAUDE.md requirements:

  • Run bundle exec rubocop before merging
  • Run rake autofix to ensure Prettier formatting

3. Link Validation Needed
Consider validating internal references after file moves

Deleted Files Assessment

All deletions are appropriate:

  • docs/home.md - Replaced by introduction.md
  • docs/core-concepts/react-on-rails-overview.md - Content consolidated
  • docs/guides/advanced/README.md - Orphaned file
  • docs/advanced-topics/manual-installation-overview.md - Had TODO since 2018, outdated patterns

Recommendations Before Merge

  1. Fix syntax error in using-react-on-rails.md line 192
  2. Run rake autofix and bundle exec rubocop
  3. Validate internal links after file moves

Overall Assessment

Quality: 5/5
Impact: High - Directly addresses user confusion
Risk: Low - Documentation only
Readiness: Ready after minor fixes

Final Verdict: Approve with Minor Changes

Once the syntax error is fixed and formatting tools are run, this is ready to merge. Great job on the thoughtful consolidation and improved information architecture!

Reviewed by: Claude Code
Commit: 809a894

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (2)
docs/getting-started/tutorial.md (2)

125-127: Add a language to the fenced block (MD040).

Tag this as shell/env so markdownlint passes.

-```
+```bash
 EXECJS_RUNTIME=Node

185-186: Fix path typo: “initializers.”

Correct “config/intializers/react_on_rails.rb” to “config/initializers/react_on_rails.rb”.

-`config/intializers/react_on_rails.rb`
+`config/initializers/react_on_rails.rb`
♻️ Duplicate comments (3)
docs/deployment/heroku-deployment.md (2)

100-103: Tag the Procfile code fence with a language.

Add a language hint so markdownlint (MD040) passes.

-```
+```Procfile
 web: bundle exec puma -C config/puma.rb

131-135: Update Node/Yarn engines to supported versions (Node 18+).

This still pins Node 16.19.0, which is EOL and inconsistent with prerequisites. Bump to Node 18+ (and adjust Yarn) for alignment.

-  "engines": {
-    "node": "16.19.0",
-    "yarn": "1.22.4"
-  },
+  "engines": {
+    "node": ">=18 <21",
+    "yarn": ">=1.22"
+  },
docs/getting-started/using-react-on-rails.md (1)

126-130: Add a language to the directory tree fence (MD040).

Tag this block (e.g., text) so markdownlint passes.

-```
+```text
 app/javascript/
 └── bundles/HelloWorld/          # or src/HelloWorld/ror_components/ with auto-bundling
     └── HelloWorld.jsx
🧹 Nitpick comments (7)
docs/planning/docs-improvement/ia-redesign-live.md (2)

28-38: Clarify status consistency (Step 0 vs. Completion Summary).

Step 0 shows "In Progress" with unchecked items, while the Completion Summary says all steps are complete. Update Step 0 checkboxes/status to reflect completion or annotate as historical to avoid confusion.

Also applies to: 304-314


115-121: Align Step 8 task with actual changes (README.md not deleted).

Step 8 lists “Delete/archive README.md,” but this PR simplified docs/README.md. Revise the Step 8 bullet to “Simplify README.md for GitHub users” to match what shipped.

Also applies to: 359-368

docs/deployment/heroku-deployment.md (3)

168-170: Use correct language for Ruby config snippet.

This is Ruby code, not bash. Tag the fence as Ruby.

-```bash
+```ruby
 config.build_production_command = "RAILS_ENV=production NODE_ENV=production bin/shakapacker"

177-179: Use Ruby fence for Rake task clear example.

This is Ruby that's added to a Rakefile/initializer, not a shell command.

-```bash
+```ruby
 Rake::Task['shakapacker:clean'].clear

79-82: Prefer modern Rails tasks over rake aliases.

Use rails db:setup and rails db:migrate to match current Rails conventions.

- rake db:setup
- rake db:migrate
+ rails db:setup
+ rails db:migrate
docs/getting-started/tutorial.md (1)

145-153: Clarify HMR vs full page reload; update links.

The text implies HMR but describes full page refresh (live reload). Clarify that without React Refresh you get full reloads; for state‑preserving updates enable React Fast Refresh. Also replace the deprecated Webpacker link with current Webpack docs (and/or Shakapacker docs).

docs/getting-started/quick-start.md (1)

127-133: Verify helper names/necessity with auto-bundling (Shakapacker v7).

Confirm stylesheet_pack_tag/javascript_pack_tag are the intended helpers and still required when using auto_load_bundle: true. If not, update to current helpers or note when they’re needed.

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 5388efb and 5e71aeb.

📒 Files selected for processing (15)
  • docs/README.md (3 hunks)
  • docs/advanced-topics/manual-installation-overview.md (0 hunks)
  • docs/core-concepts/react-on-rails-overview.md (0 hunks)
  • docs/deployment/heroku-deployment.md (2 hunks)
  • docs/getting-started.md (0 hunks)
  • docs/getting-started/installation-into-an-existing-rails-app.md (0 hunks)
  • docs/getting-started/quick-start.md (2 hunks)
  • docs/getting-started/tutorial.md (8 hunks)
  • docs/getting-started/using-react-on-rails.md (1 hunks)
  • docs/guides/advanced/README.md (0 hunks)
  • docs/home.md (0 hunks)
  • docs/introduction.md (1 hunks)
  • docs/misc/doctrine.md (1 hunks)
  • docs/planning/docs-improvement/04-ia-redesign-plan.md (1 hunks)
  • docs/planning/docs-improvement/ia-redesign-live.md (2 hunks)
💤 Files with no reviewable changes (6)
  • docs/guides/advanced/README.md
  • docs/core-concepts/react-on-rails-overview.md
  • docs/getting-started.md
  • docs/advanced-topics/manual-installation-overview.md
  • docs/home.md
  • docs/getting-started/installation-into-an-existing-rails-app.md
🚧 Files skipped from review as they are similar to previous changes (3)
  • docs/introduction.md
  • docs/misc/doctrine.md
  • docs/planning/docs-improvement/04-ia-redesign-plan.md
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{js,jsx,ts,tsx,css,scss,json,yml,yaml,md}

📄 CodeRabbit inference engine (CLAUDE.md)

Prettier is the sole authority for formatting all non-Ruby files; never manually format them

Files:

  • docs/getting-started/quick-start.md
  • docs/getting-started/using-react-on-rails.md
  • docs/planning/docs-improvement/ia-redesign-live.md
  • docs/README.md
  • docs/getting-started/tutorial.md
  • docs/deployment/heroku-deployment.md
🪛 markdownlint-cli2 (0.18.1)
docs/deployment/heroku-deployment.md

150-150: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (10)
  • GitHub Check: dummy-app-integration-tests (3.4, 22)
  • GitHub Check: dummy-app-integration-tests (3.2, 20)
  • GitHub Check: claude-review
  • GitHub Check: build
  • GitHub Check: rspec-package-tests (3.4, latest)
  • GitHub Check: rspec-package-tests (3.2, minimum)
  • GitHub Check: markdown-link-check
  • GitHub Check: rspec-package-tests (3.4, minimum)
  • GitHub Check: rspec-package-tests (3.2, latest)
  • GitHub Check: build-and-test
🔇 Additional comments (2)
docs/getting-started/quick-start.md (1)

162-165: Good redirect to the new concepts guide.

Pointing to “Using React on Rails” aligns with the new IA.

docs/README.md (1)

3-6: Solid simplification and IA alignment.

Concise GitHub-oriented README with clear learning paths and category index. Links align with the new structure.

Also applies to: 15-26, 45-55, 60-64

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

♻️ Duplicate comments (2)
docs/deployment/heroku-deployment.md (2)

100-102: Restore the Procfile fence language hint.

This fenced block still lacks the Procfile language tag that markdownlint flagged earlier, so CI will fail the same MD040 check unless we add it back.

-```
+```Procfile
 web: bundle exec puma -C config/puma.rb

131-134: Align Heroku engines with our supported runtime.

We still pin Heroku to Node 16.19.0, which is EOL and contradicts the Node 18+ requirement documented elsewhere in this PR. Please bump Node (and Yarn if you want to keep it) to a supported release before merging.

   "engines": {
-    "node": "16.19.0",
-    "yarn": "1.22.4"
+    "node": ">=18.18.0",
+    "yarn": "1.22.22"
   },
📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 5388efb and 5e71aeb.

📒 Files selected for processing (15)
  • docs/README.md (3 hunks)
  • docs/advanced-topics/manual-installation-overview.md (0 hunks)
  • docs/core-concepts/react-on-rails-overview.md (0 hunks)
  • docs/deployment/heroku-deployment.md (2 hunks)
  • docs/getting-started.md (0 hunks)
  • docs/getting-started/installation-into-an-existing-rails-app.md (0 hunks)
  • docs/getting-started/quick-start.md (2 hunks)
  • docs/getting-started/tutorial.md (8 hunks)
  • docs/getting-started/using-react-on-rails.md (1 hunks)
  • docs/guides/advanced/README.md (0 hunks)
  • docs/home.md (0 hunks)
  • docs/introduction.md (1 hunks)
  • docs/misc/doctrine.md (1 hunks)
  • docs/planning/docs-improvement/04-ia-redesign-plan.md (1 hunks)
  • docs/planning/docs-improvement/ia-redesign-live.md (2 hunks)
💤 Files with no reviewable changes (6)
  • docs/home.md
  • docs/core-concepts/react-on-rails-overview.md
  • docs/getting-started/installation-into-an-existing-rails-app.md
  • docs/guides/advanced/README.md
  • docs/getting-started.md
  • docs/advanced-topics/manual-installation-overview.md
✅ Files skipped from review due to trivial changes (1)
  • docs/introduction.md
🚧 Files skipped from review as they are similar to previous changes (3)
  • docs/misc/doctrine.md
  • docs/getting-started/using-react-on-rails.md
  • docs/getting-started/quick-start.md
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{js,jsx,ts,tsx,css,scss,json,yml,yaml,md}

📄 CodeRabbit inference engine (CLAUDE.md)

Prettier is the sole authority for formatting all non-Ruby files; never manually format them

Files:

  • docs/README.md
  • docs/planning/docs-improvement/ia-redesign-live.md
  • docs/deployment/heroku-deployment.md
  • docs/getting-started/tutorial.md
  • docs/planning/docs-improvement/04-ia-redesign-plan.md
🪛 markdownlint-cli2 (0.18.1)
docs/getting-started/tutorial.md

7-7: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
  • GitHub Check: build-and-test

@ihabadham ihabadham force-pushed the feature/docs-ia-redesign-1845-continue branch from 5e71aeb to 2cf9420 Compare October 15, 2025 16:50
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (2)
docs/getting-started/quick-start.md (1)

127-133: ERB example is invalid: pack helpers require names.

Both helpers need at least a pack name (e.g., 'application'). Without arguments this will raise.

-```erb
-    <%= stylesheet_pack_tag %>
-    <%= javascript_pack_tag %>
-```
+```erb
+<%= stylesheet_pack_tag 'application', media: 'all' %>
+<%= javascript_pack_tag 'application', defer: true %>
+```
docs/getting-started/tutorial.md (1)

184-189: Typo in path: initializers.

Fix the filename to avoid confusion.

-`config/intializers/react_on_rails.rb`
+`config/initializers/react_on_rails.rb`
♻️ Duplicate comments (5)
docs/deployment/heroku-deployment.md (2)

100-103: Add language to the Procfile fence (MD040).

Tag the fenced block with a language to satisfy markdownlint.

-```
+```Procfile
 web: bundle exec puma -C config/puma.rb

---

`131-135`: **Update engines to Node 18+ (aligns with system requirements).**

The guide pins Node 16.19.0 (EOL) and contradicts “Node.js 18+” elsewhere. Bump Node; adjust Yarn if needed.


```diff
-  "engines": {
-    "node": "16.19.0",
-    "yarn": "1.22.4"
-  },
+  "engines": {
+    "node": ">=18",
+    "yarn": ">=1.22.0"
+  },
docs/getting-started/using-react-on-rails.md (2)

126-130: Add language to the directory tree fence (MD040).

Tag the fence (e.g., text) so markdownlint passes.

-```
+```text
 app/javascript/
 └── bundles/HelloWorld/          # or src/HelloWorld/ror_components/ with auto-bundling
     └── HelloWorld.jsx

---

`189-195`: **Fix invalid JS example; remove stray semicolon and add language tag.**

The semicolon inside the object literal is invalid; tag the fence with js.


```diff
-```js
-{
-  renderedHtml: {
-    componentHtml, redirectLocation, error;
-  }
-}
+```js
+{
+  renderedHtml: {
+    componentHtml,
+    redirectLocation,
+    error
+  }
+}

</blockquote></details>
<details>
<summary>docs/getting-started/tutorial.md (1)</summary><blockquote>

`7-7`: **Replace italics “update” line to satisfy MD036.**

Use a callout instead of emphasis.


```diff
-_Updated for Ruby 3.0+, Rails 7, React on Rails v16, and Shakapacker v7_
+> **Note:** Updated for Ruby 3.0+, Rails 7, React on Rails v16, and Shakapacker v7.
🧹 Nitpick comments (3)
docs/deployment/heroku-deployment.md (1)

52-75: Production DB config note for Heroku.

Consider adding a note that production typically uses DATABASE_URL on Heroku, so explicit host/username/password are unnecessary (and may be ignored).

docs/getting-started/quick-start.md (1)

204-209: “Key File Locations” are out of date with auto‑bundling.

This section references the older packs/bundles layout. Update to reflect the recommended auto‑bundling paths (and optionally show both).

-- **Components**: `client/app/bundles/[ComponentName]/components/`
-- **Registration**: `client/app/bundles/[ComponentName]/startup/registration.js`
-- **Packs**: `app/javascript/packs/`
+- **Components (auto-bundling)**: `app/javascript/src/*/ror_components/`
+- **Config**: `config/initializers/react_on_rails.rb`
+- **Webpack (Shakapacker)**: `config/shakapacker.yml`
+- (Optional legacy) **packs/startup** if using manual registration
docs/getting-started/tutorial.md (1)

151-154: Update links away from deprecated Webpacker docs.

Point to Shakapacker and Webpack docs instead of Webpacker 5.x.

-- [webpack-dev-server](https://github.com/rails/webpacker/blob/5-x-stable/docs/webpack-dev-server.md)
+- [Shakapacker Dev Server](https://github.com/shakacode/shakapacker#dev-server)
 - [DevServer](https://webpack.js.org/configuration/dev-server/)
 - [Hot Module Replacement](https://webpack.js.org/concepts/hot-module-replacement/)
📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 5e71aeb and 2cf9420.

📒 Files selected for processing (15)
  • docs/README.md (3 hunks)
  • docs/advanced-topics/manual-installation-overview.md (0 hunks)
  • docs/core-concepts/react-on-rails-overview.md (0 hunks)
  • docs/deployment/heroku-deployment.md (2 hunks)
  • docs/getting-started.md (0 hunks)
  • docs/getting-started/installation-into-an-existing-rails-app.md (0 hunks)
  • docs/getting-started/quick-start.md (2 hunks)
  • docs/getting-started/tutorial.md (8 hunks)
  • docs/getting-started/using-react-on-rails.md (1 hunks)
  • docs/guides/advanced/README.md (0 hunks)
  • docs/home.md (0 hunks)
  • docs/introduction.md (1 hunks)
  • docs/misc/doctrine.md (1 hunks)
  • docs/planning/docs-improvement/04-ia-redesign-plan.md (1 hunks)
  • docs/planning/docs-improvement/ia-redesign-live.md (2 hunks)
💤 Files with no reviewable changes (6)
  • docs/getting-started.md
  • docs/home.md
  • docs/core-concepts/react-on-rails-overview.md
  • docs/guides/advanced/README.md
  • docs/advanced-topics/manual-installation-overview.md
  • docs/getting-started/installation-into-an-existing-rails-app.md
✅ Files skipped from review due to trivial changes (1)
  • docs/misc/doctrine.md
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{js,jsx,ts,tsx,css,scss,json,yml,yaml,md}

📄 CodeRabbit inference engine (CLAUDE.md)

Prettier is the sole authority for formatting all non-Ruby files; never manually format them

Files:

  • docs/README.md
  • docs/deployment/heroku-deployment.md
  • docs/introduction.md
  • docs/planning/docs-improvement/ia-redesign-live.md
  • docs/getting-started/tutorial.md
  • docs/getting-started/using-react-on-rails.md
  • docs/planning/docs-improvement/04-ia-redesign-plan.md
  • docs/getting-started/quick-start.md
🪛 LanguageTool
docs/README.md

[grammar] ~15-~15: There might be a mistake here.
Context: ...- What is React on Rails and why use it? 2. **[Quick Start](./getting-started/quick-sta...

(QB_NEW_EN)


[grammar] ~23-~23: There might be a mistake here.
Context: ...ls-app.md)** - Add to existing Rails app - **[API Reference](./api-reference/README.md...

(QB_NEW_EN)


[grammar] ~24-~24: There might be a mistake here.
Context: ...w helpers, configuration, JavaScript API - **[Core Concepts](./core-concepts/how-react...

(QB_NEW_EN)


[grammar] ~45-~45: There might be a mistake here.
Context: ... | ## 📖 Documentation Categories - Getting Started -...

(QB_NEW_EN)


[grammar] ~47-~47: There might be a mistake here.
Context: ...** - Installation, quick start, tutorial - Core Concepts - How...

(QB_NEW_EN)


[grammar] ~48-~48: There might be a mistake here.
Context: ...React on Rails works, SSR, auto-bundling - **Building Features...

(QB_NEW_EN)


[grammar] ~49-~49: There might be a mistake here.
Context: ...ures/)** - Redux, routing, i18n, testing - API Reference - Vie...

(QB_NEW_EN)


[grammar] ~50-~50: There might be a mistake here.
Context: ...w helpers, configuration, JavaScript API - Deployment - Productio...

(QB_NEW_EN)


[grammar] ~51-~51: There might be a mistake here.
Context: ...roduction deployment and troubleshooting - Upgrading - Version upg...

(QB_NEW_EN)


[grammar] ~52-~52: There might be a mistake here.
Context: ..../upgrading/)** - Version upgrade guides - Migrating - From other ...

(QB_NEW_EN)


[grammar] ~53-~53: There might be a mistake here.
Context: ...(./migrating/)** - From other frameworks - Pro - React on Rails Pro feat...

(QB_NEW_EN)


[grammar] ~56-~56: There might be a mistake here.
Context: ... on Rails Pro features ## 🆘 Need Help? - **[Troubleshooting Guide](./deployment/trou...

(QB_NEW_EN)


[grammar] ~58-~58: There might be a mistake here.
Context: ...ting.md)** - Common issues and solutions - **[GitHub Discussions](https://github.com/s...

(QB_NEW_EN)


[grammar] ~59-~59: There might be a mistake here.
Context: ..._on_rails/discussions)** - Ask questions - **[React on Rails Pro](https://www.shakacod...

(QB_NEW_EN)

docs/deployment/heroku-deployment.md

[grammar] ~34-~34: There might be a mistake here.
Context: ...tgresql. If you have not set up your app with Postgresql, you need to change your...

(QB_NEW_EN)


[style] ~77-~77: You have already used this phrasing in nearby sentences. Consider replacing it to add variety to your writing.
Context: ... database: ror_production ``` Then you need to set up Postgres so you can run locally:...

(REP_NEED_TO_VB)


[style] ~153-~153: Reusing ‘you’ could be redundant. Try omitting the pronoun.
Context: ...``` and you will see your live app and you can share this URL with your friends. Congr...

(SUBJECT_DROP)

docs/introduction.md

[grammar] ~47-~47: There might be a mistake here.
Context: ...ituation: ### 🚀 New to React on Rails? **[15-Minute Quick Start →](./getting-start...

(QB_NEW_EN)


[grammar] ~53-~53: There might be a mistake here.
Context: ... ### 📦 Adding to an Existing Rails App? **[Installation Guide →](./getting-started/...

(QB_NEW_EN)


[grammar] ~59-~59: There might be a mistake here.
Context: .... ### 📚 Want a Comprehensive Tutorial? **[Complete Tutorial →](./getting-started/t...

(QB_NEW_EN)


[grammar] ~65-~65: There might be a mistake here.
Context: ...nd deployment. ### 👀 Learn by Example? - **[Spec/Dummy App](https://github.com/shaka...

(QB_NEW_EN)


[grammar] ~67-~67: There might be a mistake here.
Context: ...c/dummy)** - Simple example in this repo - **[Tutorial Demo App](https://github.com/sh...

(QB_NEW_EN)


[grammar] ~68-~68: There might be a mistake here.
Context: ... - Example with SSR, HMR, and TypeScript - **[Live Demo with Source](https://github.co...

(QB_NEW_EN)


[grammar] ~88-~88: There might be a mistake here.
Context: ...ails-works.md)** - Architecture overview - **[Auto-Bundling](./core-concepts/auto-bund...

(QB_NEW_EN)


[grammar] ~89-~89: There might be a mistake here.
Context: ...onent registration and bundle generation - **[Client vs Server Rendering](./core-conce...

(QB_NEW_EN)


[grammar] ~90-~90: There might be a mistake here.
Context: ...erver-rendering.md)** - When to use each - **[Webpack Configuration](./core-concepts/w...

(QB_NEW_EN)


[grammar] ~97-~97: There might be a mistake here.
Context: ...faults for JavaScript tooling with Rails - Optimize for Programmer Happiness - Ho...

(QB_NEW_EN)


[grammar] ~98-~98: There might be a mistake here.
Context: ...oading, ES6+, CSS modules, NPM ecosystem - Value Integrated Systems - Tight Rails...

(QB_NEW_EN)


[grammar] ~105-~105: There might be a mistake here.
Context: ...s - Rails 7+ (Rails 5.2+ supported) - Ruby 3.0+ - Node.js 18+ - **Shakap...

(QB_NEW_EN)


[grammar] ~106-~106: There might be a mistake here.
Context: ...+** (Rails 5.2+ supported) - Ruby 3.0+ - Node.js 18+ - Shakapacker 6+ (7+ r...

(QB_NEW_EN)


[grammar] ~107-~107: There might be a mistake here.
Context: ...pported) - Ruby 3.0+ - Node.js 18+ - Shakapacker 6+ (7+ recommended for Rea...

(QB_NEW_EN)


[grammar] ~116-~116: There might be a mistake here.
Context: ...lack](https://reactrails.slack.com)** - Real-time community help - **[GitHub Issues](...

(QB_NEW_EN)


[grammar] ~121-~121: There might be a mistake here.
Context: ...ver Components, Suspense SSR, streaming) - **[ShakaCode Consulting](mailto:react_on_ra...

(QB_NEW_EN)


[grammar] ~126-~126: There might be a mistake here.
Context: ...Webpack integration for Rails (required) - **React Documentation*...

(QB_NEW_EN)


[grammar] ~127-~127: There might be a mistake here.
Context: ...ct.dev)** - Official React documentation - **[Rails Guides](https://guides.rubyonrails...

(QB_NEW_EN)


[grammar] ~132-~132: There might be a mistake here.
Context: ...bove and let's build something great! 🚀

(QB_NEW_EN)

docs/planning/docs-improvement/ia-redesign-live.md

[grammar] ~361-~361: There might be a mistake here.
Context: ... - Reduced from 173 lines to 65 lines - Directs to website first - Kept valua...

(QB_NEW_EN)


[grammar] ~362-~362: There might be a mistake here.
Context: ...o 65 lines - Directs to website first - Kept valuable learning paths from PR #18...

(QB_NEW_EN)


[grammar] ~363-~363: There might be a mistake here.
Context: ...pt valuable learning paths from PR #1813 - Kept popular use cases table - Added ...

(QB_NEW_EN)


[grammar] ~364-~364: There might be a mistake here.
Context: ... #1813 - Kept popular use cases table - Added documentation categories overview ...

(QB_NEW_EN)


[grammar] ~365-~365: There might be a mistake here.
Context: ... Added documentation categories overview - Removed duplicate content (now in introd...

(QB_NEW_EN)


[grammar] ~366-~366: There might be a mistake here.
Context: ...plicate content (now in introduction.md) - Purpose: Serves GitHub users browsing re...

(QB_NEW_EN)


[grammar] ~380-~380: There might be a mistake here.
Context: ...) - Transformed installation section to conceptual overview with links 7. **✅ ...

(QB_NEW_EN)


[grammar] ~383-~383: There might be a mistake here.
Context: ...ad "TODO: Review this file" for 7 years) - Confused purpose: title said "Manual Ins...

(QB_NEW_EN)


[grammar] ~385-~385: There might be a mistake here.
Context: ...ent, webpacker`, missing auto-bundling - No clear use case: generator IS the manu...

(QB_NEW_EN)


[grammar] ~386-~386: There might be a mistake here.
Context: ...e manual installation (not external CLI) - Content better covered in: how-react-on-...

(QB_NEW_EN)


[grammar] ~387-~387: There might be a mistake here.
Context: ...-rails-works.md, using-react-on-rails.md - Removed link from installation-into-an-e...

(QB_NEW_EN)


[grammar] ~388-~388: There might be a mistake here.
Context: ...stallation-into-an-existing-rails-app.md - Decision discussed with team in Slack ...

(QB_NEW_EN)


[grammar] ~389-~389: There might be a mistake here.
Context: ... - Decision discussed with team in Slack - Deleted original `docs/getting-started.m...

(QB_NEW_EN)

docs/getting-started/tutorial.md

[grammar] ~36-~36: There might be a mistake here.
Context: ...mr-vs-react-hot-reloading) - Deployment - Going Further - [Turn...

(QB_NEW_EN)


[grammar] ~37-~37: There might be a mistake here.
Context: ...eployment](#deployment) - Going Further - [Turning on Server Rendering](#turning-on...

(QB_NEW_EN)


[grammar] ~38-~38: There might be a mistake here.
Context: ...urther) - Turning on Server Rendering - [Optional Configuration](#optional-config...

(QB_NEW_EN)


[grammar] ~39-~39: There might be a mistake here.
Context: ...r-rendering) - Optional Configuration - [Moving from the Rails default `/app/java...

(QB_NEW_EN)


[grammar] ~40-~40: There might be a mistake here.
Context: ...to the recommended/client` structure](#moving-from-the-rails-default-appjavascript-to-the-recommended-client-structure) - [Custom IP & PORT setup (Cloud9 example)]...

(QB_NEW_EN)


[grammar] ~41-~41: There might be a mistake here.
Context: ...Custom IP & PORT setup (Cloud9 example) - [RubyMine performance tip](#rubymine-perf...

(QB_NEW_EN)


[grammar] ~42-~42: There might be a mistake here.
Context: ...example) - RubyMine performance tip - Conclusion # Installation...

(QB_NEW_EN)


[uncategorized] ~147-~147: If this is a compound adjective that modifies the following noun, use a hyphen.
Context: ...out a special React setup, will cause a full page refresh each time you save a file. If ...

(EN_COMPOUND_ADJECTIVE_INTERNAL)


[grammar] ~151-~151: There might be a mistake here.
Context: ...k at these links: - webpack-dev-server - [DevServer](https://webpack.js.org/config...

(QB_NEW_EN)


[grammar] ~152-~152: There might be a mistake here.
Context: ...docs/webpack-dev-server.md) - DevServer - [Hot Module Replacement](https://webpack....

(QB_NEW_EN)


[grammar] ~163-~163: There might be a mistake here.
Context: ...t.md)** - Step-by-step Heroku deployment - **[General Deployment Guide](../deployment/...

(QB_NEW_EN)


[grammar] ~168-~168: There might be a mistake here.
Context: ... guides cover: - Configuring buildpacks - Database setup (PostgreSQL) - Asset comp...

(QB_NEW_EN)


[grammar] ~169-~169: There might be a mistake here.
Context: ...buildpacks - Database setup (PostgreSQL) - Asset compilation - Environment variable...

(QB_NEW_EN)


[grammar] ~170-~170: There might be a mistake here.
Context: ...e setup (PostgreSQL) - Asset compilation - Environment variables - Troubleshooting ...

(QB_NEW_EN)


[grammar] ~171-~171: There might be a mistake here.
Context: ...sset compilation - Environment variables - Troubleshooting common deployment issues...

(QB_NEW_EN)

docs/getting-started/using-react-on-rails.md

[grammar] ~5-~5: There might be a mistake here.
Context: ...me back here to understand the concepts. --- ## Installation Overview When you install ...

(QB_NEW_EN)


[grammar] ~20-~20: There might be a mistake here.
Context: ... app/javascript/src/*/ror_components/) - Rails integration (controllers, views, i...

(QB_NEW_EN)


[grammar] ~21-~21: There might be a mistake here.
Context: ...ration (controllers, views, initializer) - Webpack configuration for building JavaS...

(QB_NEW_EN)


[grammar] ~22-~22: There might be a mistake here.
Context: ...guration for building JavaScript bundles - Development workflow with hot module rep...

(QB_NEW_EN)


[grammar] ~27-~27: There might be a mistake here.
Context: ...-start.md)** - Fastest path (15 minutes) - **[Installation Guide](./installation-into-...

(QB_NEW_EN)


[grammar] ~28-~28: There might be a mistake here.
Context: ...ails-app.md)** - For existing Rails apps - Complete Tutorial - St...

(QB_NEW_EN)


[grammar] ~29-~29: There might be a mistake here.
Context: ...*Complete Tutorial** - Step-by-step with Redux and routing --- ## ...

(QB_NEW_EN)


[grammar] ~61-~61: There might be a mistake here.
Context: ..._rails.rb`: - Server rendering settings - Development vs production behavior - Log...

(QB_NEW_EN)


[grammar] ~62-~62: There might be a mistake here.
Context: ...ngs - Development vs production behavior - Logging options - Auto-bundling settings...

(QB_NEW_EN)


[grammar] ~63-~63: There might be a mistake here.
Context: ...vs production behavior - Logging options - Auto-bundling settings For complete con...

(QB_NEW_EN)


[grammar] ~99-~99: There might be a mistake here.
Context: ...o manual ReactOnRails.register() calls 5. Components are loaded on-demand per page...

(QB_NEW_EN)


[grammar] ~111-~111: There might be a mistake here.
Context: ... - Eliminates boilerplate configuration - Automatic code splitting per component -...

(QB_NEW_EN)


[grammar] ~112-~112: There might be a mistake here.
Context: ...- Automatic code splitting per component - Smaller initial bundle sizes - Component...

(QB_NEW_EN)


[grammar] ~113-~113: There might be a mistake here.
Context: ...component - Smaller initial bundle sizes - Components only loaded when used For co...

(QB_NEW_EN)


[grammar] ~134-~134: There might be a mistake here.
Context: ...orld_controller.rb- Example controller - **View**:app/views/hello_world/index.htm...

(QB_NEW_EN)


[grammar] ~135-~135: There might be a mistake here.
Context: ...- Showsreact_componenthelper usage - **Route**: Added toconfig/routes.rb` - *...

(QB_NEW_EN)


[grammar] ~136-~136: There might be a mistake here.
Context: ...enthelper usage - **Route**: Added toconfig/routes.rb- **Initializer**:config/initializers/reac...

(QB_NEW_EN)


[grammar] ~149-~149: There might be a mistake here.
Context: ...arting both: - Rails server (port 3000) - Webpack dev server (for hot reloading) ...

(QB_NEW_EN)


[grammar] ~205-~205: There might be a mistake here.
Context: ...- All React on Rails errors are of type ReactOnRails::Error - Server rendering errors include context ...

(QB_NEW_EN)


[grammar] ~219-~219: There might be a mistake here.
Context: ...t-and-redux.md)** - Add state management - **[React Router](../building-features/react...

(QB_NEW_EN)


[grammar] ~220-~220: There might be a mistake here.
Context: ...react-router.md)** - Client-side routing - **[Server-Side Rendering](../core-concepts/...

(QB_NEW_EN)


[grammar] ~221-~221: There might be a mistake here.
Context: ...ver-rendering.md)** - Deep dive into SSR - **[Internationalization](../building-featur...

(QB_NEW_EN)


[grammar] ~222-~222: There might be a mistake here.
Context: ...g-features/i18n.md)** - Add i18n support - **[Testing](../building-features/rspec-conf...

(QB_NEW_EN)


[grammar] ~227-~227: There might be a mistake here.
Context: ...md)** - Production deployment strategies - **[Heroku Deployment](../deployment/heroku-...

(QB_NEW_EN)


[grammar] ~228-~228: There might be a mistake here.
Context: ...roku-deployment.md)** - Deploy to Heroku - **[Troubleshooting](../deployment/troublesh...

(QB_NEW_EN)


[grammar] ~233-~233: There might be a mistake here.
Context: ...-splitting.md)** - Optimize bundle sizes - **[Webpack Configuration](../core-concepts/...

(QB_NEW_EN)


[grammar] ~234-~234: There might be a mistake here.
Context: ...-configuration.md)** - Customize webpack - **[Different Client/Server Code](../buildin...

(QB_NEW_EN)


[grammar] ~239-~239: There might be a mistake here.
Context: ...)** - Complete react_component options - **[JavaScript API](../api-reference/javascr...

(QB_NEW_EN)


[grammar] ~240-~240: There might be a mistake here.
Context: ....md)** - ReactOnRails JavaScript methods - **[Configuration](../api-reference/configur...

(QB_NEW_EN)

docs/planning/docs-improvement/04-ia-redesign-plan.md

[grammar] ~813-~813: There might be a mistake here.
Context: ...it) - PLANNED: Move installation → docs/getting-started/installation.md - ACTUAL: Transformed to `docs/getting-s...

(QB_NEW_EN)


[grammar] ~814-~814: There might be a mistake here.
Context: ...ng-react-on-rails.md` (conceptual guide) - REASON: installation.md already existe...

(QB_NEW_EN)


[grammar] ~820-~820: There might be a mistake here.
Context: ...plified) - DECIDED: Option B (kept as simple TOC) - Reduced from 173 → 65 lin...

(QB_NEW_EN)


[grammar] ~820-~820: There might be a mistake here.
Context: ...DECIDED:** Option B (kept as simple TOC) - Reduced from 173 → 65 lines - Serves Git...

(QB_NEW_EN)


[grammar] ~821-~821: There might be a mistake here.
Context: ...imple TOC) - Reduced from 173 → 65 lines - Serves GitHub users browsing repo **4. ...

(QB_NEW_EN)


[grammar] ~822-~822: There might be a mistake here.
Context: ...om 173 → 65 lines - Serves GitHub users browsing repo 4. Delete docs/home.md: ✅ D...

(QB_NEW_EN)


[grammar] ~832-~832: There might be a mistake here.
Context: ...eployment (139 lines) to dedicated guide - Fixed outdated versions (Ruby 3.0+, Rail...

(QB_NEW_EN)


[grammar] ~833-~833: There might be a mistake here.
Context: ... versions (Ruby 3.0+, Rails 7+, RoR v16) - Clarified Redux vs Hooks usage - Merged ...

(QB_NEW_EN)


[grammar] ~834-~834: There might be a mistake here.
Context: ...oR v16) - Clarified Redux vs Hooks usage - Merged duplicate HMR sections - Reorgani...

(QB_NEW_EN)


[grammar] ~835-~835: There might be a mistake here.
Context: ...ks usage - Merged duplicate HMR sections - Reorganized "Other features" → "Going Fu...

(QB_NEW_EN)


[grammar] ~840-~840: There might be a mistake here.
Context: ...view.md`** ✅ DONE - Outdated since 2018 - Confused purpose - No clear use case (ge...

(QB_NEW_EN)


[grammar] ~841-~841: There might be a mistake here.
Context: ...- Outdated since 2018 - Confused purpose - No clear use case (generator IS manual i...

(QB_NEW_EN)


[grammar] ~847-~847: There might be a mistake here.
Context: ...s as they were discovered - Key changes: - overview.md → introduction.md (2 links) ...

(QB_NEW_EN)


[grammar] ~848-~848: There might be a mistake here.
Context: ... overview.md → introduction.md (2 links) - understanding-react-on-rails.md → using-...

(QB_NEW_EN)


[grammar] ~849-~849: There might be a mistake here.
Context: ...ls.md → using-react-on-rails.md (1 link) - manual-installation-overview.md link rem...

(QB_NEW_EN)


[grammar] ~850-~850: There might be a mistake here.
Context: ...lation-overview.md link removed (1 link) - NOTE: Did not use automated script - m...

(QB_NEW_EN)


[grammar] ~855-~855: There might be a mistake here.
Context: ...hecklist:** - [x] All new files created - [x] Old files deleted or transformed - [...

(QB_NEW_EN)


[grammar] ~856-~856: There might be a mistake here.
Context: ...d - [x] Old files deleted or transformed - [x] All internal links updated (manually...

(QB_NEW_EN)


[grammar] ~857-~857: There might be a mistake here.
Context: ... links updated (manually as encountered) - [ ] Run markdown link checker (TODO: bef...

(QB_NEW_EN)


[uncategorized] ~858-~858: Did you mean the formatting language “Markdown” (= proper noun)?
Context: ...ted (manually as encountered) - [ ] Run markdown link checker (TODO: before final merge)...

(MARKDOWN_NNP)


[grammar] ~858-~858: There might be a mistake here.
Context: ... link checker (TODO: before final merge) - [x] Manual spot-checks of navigation - [...

(QB_NEW_EN)


[grammar] ~859-~859: There might be a mistake here.
Context: ...) - [x] Manual spot-checks of navigation - [ ] Test on local gatsby build (deferred...

(QB_NEW_EN)

docs/getting-started/quick-start.md

[grammar] ~162-~162: There might be a mistake here.
Context: ...on-rails.md)** - Core concepts explained 2. **[View Helpers API](../api-reference/view-...

(QB_NEW_EN)

🪛 markdownlint-cli2 (0.18.1)
docs/deployment/heroku-deployment.md

100-100: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

docs/getting-started/tutorial.md

7-7: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)

docs/getting-started/using-react-on-rails.md

150-150: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (10)
  • GitHub Check: dummy-app-integration-tests (3.2, 20)
  • GitHub Check: dummy-app-integration-tests (3.4, 22)
  • GitHub Check: build
  • GitHub Check: rspec-package-tests (3.4, latest)
  • GitHub Check: rspec-package-tests (3.2, latest)
  • GitHub Check: rspec-package-tests (3.4, minimum)
  • GitHub Check: rspec-package-tests (3.2, minimum)
  • GitHub Check: markdown-link-check
  • GitHub Check: claude-review
  • GitHub Check: build-and-test
🔇 Additional comments (3)
docs/README.md (1)

45-55: Categories look good; ensure paths exist.

Links under Documentation Categories should be validated post-merge; otherwise LGTM.

docs/planning/docs-improvement/ia-redesign-live.md (1)

326-397: Entry point consolidation summary looks solid.

Good documentation of actions and remaining website config step. No changes requested.

docs/introduction.md (1)

45-63: Confirm docs homepage configuration
All linked targets exist. Verify that introduction.md is set as the docs homepage in your site configuration.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (4)
docs/advanced-topics/rails-engine-integration.md (2)

16-17: Update React on Rails version to v16 to match site-wide requirements.

This page still pins to '~> 6', conflicting with the PR’s v16 baseline. Align the gem specs.

Apply:

- s.add_dependency 'react_on_rails', '~> 6'
+ s.add_dependency 'react_on_rails', '~> 16'
- Place `gem 'react_on_rails', '~> 6'` before the gem pointing at your engine in your gemfile.
+ Place `gem 'react_on_rails', '~> 16'` before the gem pointing at your engine in your Gemfile.

Based on PR objectives.

Also applies to: 27-27


7-11: Update helper include for v16/Rails 7+

The view helper is now namespaced under ReactOnRails::Helper, so the snippet should read:

ActiveSupport.on_load(:action_view) do
  include ReactOnRails::Helper
end
docs/building-features/images.md (2)

3-6: Remove TODO placeholders and complete the guidance.

The list is incomplete and contains “todo reference”. Please finalize wording and add authoritative links.

Apply this edit for concise, actionable guidance:

-1. leading slash necessary on the
-   a. Option name for the file-loader and url-loader (todo reference)
-   b. Option publicPath for the output (todo reference)
+1. Leading slash guidance
+   a. Prefer configuring `output.publicPath` (or `assetModuleFilename` in Webpack 5) instead of adding a leading slash in loader `name` patterns.
+   b. If using legacy `file-loader`/`url-loader`, avoid leading slashes in `name`; rely on `publicPath`. See:
+      - https://webpack.js.org/guides/asset-modules/
+      - https://webpack.js.org/configuration/output/#outputpublicpath
+      - https://webpack.js.org/loaders/file-loader/ (deprecated), https://webpack.js.org/loaders/url-loader/ (deprecated)

15-17: Fix contradictory “Leading slash is 100% needed” and align with Webpack 5 best practices.

Comments say a leading slash is required, but one rule lacks it; also this guidance is outdated. Use consistent names without a leading slash and configure publicPath (or Asset Modules in Webpack 5).

Apply this minimal fix to the snippet:

-        // Leading slash is 100% needed
-        name: 'images/[hash].[ext]',
+        name: 'images/[hash].[ext]',
...
-        // Leading slash is 100% needed
-        name: '/images/[hash].[ext]',
+        name: 'images/[hash].[ext]',

Prefer updating the doc to Webpack 5 Asset Modules (recommended):

// webpack.config.js (excerpt)
module.exports = {
  output: {
    publicPath: '/assets/', // adjust to your CDN/host path
    assetModuleFilename: 'images/[hash][ext][query]',
  },
  module: {
    rules: [
      {
        test: /\.(png|jpe?g|gif|ico|svg)$/i,
        type: 'asset', // 'asset/resource' to always emit a file
        parser: { dataUrlCondition: { maxSize: 8 * 1024 } }, // replaces url-loader limit
      },
      {
        test: /\.(woff2?|ttf|eot)$/i,
        type: 'asset/resource',
        generator: { filename: 'fonts/[hash][ext][query]' },
      },
    ],
  },
};

Also applies to: 25-27

🧹 Nitpick comments (9)
docs/building-features/foreman-issues.md (2)

3-8: Tighten heading and link phrasing; use Markdown link.

Minor copy polish for clarity and consistency with other docs.

-## It is not recommended to include foreman into Gemfile
-
-See: https://github.com/ddollar/foreman
+## Do not add Foreman to your Gemfile
+
+See the Foreman README: [github.com/ddollar/foreman](https://github.com/ddollar/foreman)
 
 > Ruby users should take care not to install foreman in their project's Gemfile.

11-15: Re-validate “Known issues” against current baseline or mark as historical.

These notes cite specific versions (foreman 0.82.0, bundler variants). Given the PR updates our recommended stack (Ruby 3.0+, Rails 7, React on Rails v16), please:

  • Confirm these still reproduce; otherwise mark them as “Historical” with tested versions/dates, or remove.
  • If still relevant, add “Tested with:” versions and a short workaround.
docs/deployment/troubleshooting-when-using-webpacker.md (1)

1-2: Good addition; add deprecation note and cross-link to Shakapacker troubleshooting.

Webpacker is deprecated. Add a short note at the top pointing readers to the Shakapacker doc to reduce confusion for new setups.

 # Troubleshooting Webpacker Manifest Errors
 
+> Note: Webpacker is deprecated in favor of Shakapacker. For current setups, see
+> [Troubleshooting Shakapacker Configuration Issues](troubleshooting-when-using-shakapacker.md).
docs/deployment/troubleshooting-when-using-shakapacker.md (2)

68-76: Minor grammar tweak in the Solution section.

“Tense” issue. Prefer present simple.

-As it set the `optimization.runtimeChunk` to `single`. [See its source](https://github.com/shakacode/shakapacker/blob/cdf32835d3e0949952b8b4b53063807f714f9b24/package/environments/base.js#L115-L119):
+This sets `optimization.runtimeChunk` to `single`. [See source](https://github.com/shakacode/shakapacker/blob/cdf32835d3e0949952b8b4b53063807f714f9b24/package/environments/base.js#L115-L119):

5-11: Align context versions with the PR’s updated requirements or clarify scope.

PR updates minimums to Ruby 3.0+, Rails 7+, React on Rails v16. This page lists React on Rails 13.3.5. Either:

  • Update to v16.x if confirmed applicable, or
  • Explicitly note “Observed on React on Rails 13.3.5; behavior may apply to newer versions.”

Optional diff if verified to apply to v16:

-4. React on Rails version: 13.3.5
+4. React on Rails version: 16.x
docs/advanced-topics/rails-engine-integration.md (2)

35-35: Fix heading level/capitalization.

Use a subsection and proper brand capitalization.

-# Github Issues
+## GitHub Issues

25-29: Add cross-link to new guides.

Improve navigation by linking to the consolidated intro/usage docs.

  • Add a sentence: “See Introduction and Using React on Rails for setup context” with links to docs/introduction.md and docs/getting-started/using-react-on-rails.md.
docs/building-features/images.md (2)

36-47: Align image paths between narrative and alias.

Text references “/client/app/assets/images” but the alias targets “app/assets/images”. Pick one and keep consistent with current templates (Webpacker/Shakapacker).

Apply this if the canonical path is under client/:

-  resolve: {
-    alias: {
-      images: join(process.cwd(), 'app', 'assets', 'images'),
-    },
-  },
+  resolve: {
+    alias: {
+      images: join(process.cwd(), 'client', 'app', 'assets', 'images'),
+    },
+  },

Also ensure the snippet shows importing join:

const { join } = require('path');

If your current default is app/javascript or app/packs, update both the prose and alias accordingly.


34-34: Use repository-relative link for ImageExample.jsx

ImageExample.jsx exists at spec/dummy/client/app/startup/ImageExample.jsx — update docs/building-features/images.md:34 to link to that path (use a repo-relative path or the correct repo/branch URL instead of the external shakacode/react_on_rails link).

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 2cf9420 and 54dc6a6.

📒 Files selected for processing (10)
  • docs/advanced-topics/rails-engine-integration.md (1 hunks)
  • docs/api-reference/README.md (1 hunks)
  • docs/api-reference/configuration.md (1 hunks)
  • docs/building-features/foreman-issues.md (1 hunks)
  • docs/building-features/images.md (1 hunks)
  • docs/deployment/troubleshooting-when-using-shakapacker.md (2 hunks)
  • docs/deployment/troubleshooting-when-using-webpacker.md (1 hunks)
  • docs/misc/credits.md (1 hunks)
  • docs/misc/updating-dependencies.md (1 hunks)
  • docs/pro/react-on-rails-pro.md (1 hunks)
✅ Files skipped from review due to trivial changes (5)
  • docs/api-reference/README.md
  • docs/pro/react-on-rails-pro.md
  • docs/api-reference/configuration.md
  • docs/misc/credits.md
  • docs/misc/updating-dependencies.md
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{js,jsx,ts,tsx,css,scss,json,yml,yaml,md}

📄 CodeRabbit inference engine (CLAUDE.md)

Prettier is the sole authority for formatting all non-Ruby files; never manually format them

Files:

  • docs/deployment/troubleshooting-when-using-webpacker.md
  • docs/building-features/images.md
  • docs/advanced-topics/rails-engine-integration.md
  • docs/building-features/foreman-issues.md
  • docs/deployment/troubleshooting-when-using-shakapacker.md
🧠 Learnings (1)
📚 Learning: 2025-09-16T08:01:11.146Z
Learnt from: justin808
PR: shakacode/react_on_rails#1770
File: lib/generators/react_on_rails/templates/base/base/app/javascript/src/HelloWorld/ror_components/HelloWorld.client.jsx:2-2
Timestamp: 2025-09-16T08:01:11.146Z
Learning: React on Rails uses webpack CSS Modules configuration with namedExports: true, which requires the import syntax `import * as style from './file.module.css'` rather than the default export pattern. This configuration enables better tree shaking and bundle size optimization for CSS modules.

Applied to files:

  • docs/deployment/troubleshooting-when-using-shakapacker.md
🪛 LanguageTool
docs/deployment/troubleshooting-when-using-shakapacker.md

[grammar] ~7-~7: There might be a mistake here.
Context: ...iple` ### Context 1. Ruby version: 3.1 2. Rails version: 7.0.6 3. Shakapacker vers...

(QB_NEW_EN)


[grammar] ~8-~8: There might be a mistake here.
Context: ...uby version: 3.1 2. Rails version: 7.0.6 3. Shakapacker version: 6.6.0 4. React on R...

(QB_NEW_EN)


[grammar] ~9-~9: There might be a mistake here.
Context: ...ion: 7.0.6 3. Shakapacker version: 6.6.0 4. React on Rails version: 13.3.5 ### The ...

(QB_NEW_EN)

🪛 markdownlint-cli2 (0.18.1)
docs/deployment/troubleshooting-when-using-shakapacker.md

54-54: Bare URL used

(MD034, no-bare-urls)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (10)
  • GitHub Check: dummy-app-integration-tests (3.2, 20)
  • GitHub Check: dummy-app-integration-tests (3.4, 22)
  • GitHub Check: rspec-package-tests (3.2, latest)
  • GitHub Check: claude-review
  • GitHub Check: rspec-package-tests (3.2, minimum)
  • GitHub Check: build
  • GitHub Check: markdown-link-check
  • GitHub Check: rspec-package-tests (3.4, minimum)
  • GitHub Check: rspec-package-tests (3.4, latest)
  • GitHub Check: build-and-test
🔇 Additional comments (5)
docs/building-features/foreman-issues.md (1)

1-1: No internal references to #foreman-issues found; legacy anchor optional.
We searched all .md files and found no links targeting #foreman-issues. Add <a id="foreman-issues"></a> only if you must preserve external deep-links to this heading.

docs/deployment/troubleshooting-when-using-shakapacker.md (1)

1-78: Reorg reads clearly and aligns with deployment docs.

Sectioning, examples, and solution are clear. Nice job.

docs/advanced-topics/rails-engine-integration.md (2)

1-2: Clear, descriptive H1 added.

Good improvement to page structure and findability.


31-34: Asset precompile guidance remains accurate in v16. REACT_ON_RAILS_PRECOMPILE (no|false|n|f) is still supported to disable React on Rails’s integration with rails assets:precompile; for Rails 7 use jsbundling-rails (esbuild/webpack/rollup) + Propshaft or Sprockets and configure build_production_command (or rely on the default) so rails assets:precompile triggers JS bundling.

docs/building-features/images.md (1)

1-1: Title update LGTM.

Clearer, aligns with IA direction.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 3

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)
docs/getting-started/tutorial.md (1)

52-62: Align the Rails version guidance.

These lines conflict: the prerequisites claim support for Rails 6+, but the immediate instruction requires Rails 7.0 or above. Please clarify which versions this tutorial actually targets and update the wording (and section heading examples) so readers aren’t sent mixed signals.

♻️ Duplicate comments (1)
docs/getting-started/tutorial.md (1)

7-7: Resolve markdownlint MD036 by switching to a callout.

Line 7 still uses italics as a faux heading, which keeps tripping markdownlint. Replace the italic line with a blockquote note (e.g., > **Note:** …) to satisfy the rule.

🧹 Nitpick comments (2)
docs/misc/style.md (1)

38-40: Clarify the CI/coverage instruction.

Consider rephrasing to make the action explicit, e.g., “Ensure hosted CI completes successfully and review the code coverage results,” so readers know what outcome to verify rather than just “run” it.

docs/api-reference/generator-details.md (1)

50-58: Add code fence languages for tree snippets.

The two directory tree examples render as plain fenced blocks without a language hint, which triggers MD040 and loses syntax highlighting. Please mark them as text fences.

-```
+```text
 app/javascript/
 └── src/
     └── HelloWorld/
         └── ror_components/          # Components auto-registered by React on Rails
             ├── HelloWorld.jsx       # Your React component
             ├── HelloWorld.module.css
             └── HelloWorld.server.js # Optional: separate server rendering logic

@@
- +text
app/javascript/
└── src/
└── HelloWorldApp/
├── actions/ # Redux action creators



Also applies to: 70-90

</blockquote></details>

</blockquote></details>

<details>
<summary>📜 Review details</summary>

**Configuration used**: CodeRabbit UI

**Review profile**: CHILL

**Plan**: Pro

<details>
<summary>📥 Commits</summary>

Reviewing files that changed from the base of the PR and between 54dc6a6808bb86604c624d96182a0349e232013c and e2333c4ed52782445afe194a351477734d337448.

</details>

<details>
<summary>📒 Files selected for processing (13)</summary>

* `docs/advanced-topics/rails-engine-integration.md` (2 hunks)
* `docs/api-reference/generator-details.md` (1 hunks)
* `docs/api-reference/redux-store-api.md` (1 hunks)
* `docs/api-reference/view-helpers-api.md` (1 hunks)
* `docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md` (2 hunks)
* `docs/building-features/i18n.md` (1 hunks)
* `docs/building-features/react-and-redux.md` (1 hunks)
* `docs/building-features/react-router.md` (2 hunks)
* `docs/building-features/rspec-configuration.md` (2 hunks)
* `docs/building-features/turbolinks.md` (5 hunks)
* `docs/getting-started/project-structure.md` (2 hunks)
* `docs/getting-started/tutorial.md` (13 hunks)
* `docs/misc/style.md` (1 hunks)

</details>

<details>
<summary>✅ Files skipped from review due to trivial changes (3)</summary>

* docs/api-reference/redux-store-api.md
* docs/building-features/i18n.md
* docs/building-features/react-and-redux.md

</details>

<details>
<summary>🧰 Additional context used</summary>

<details>
<summary>📓 Path-based instructions (1)</summary>

<details>
<summary>**/*.{js,jsx,ts,tsx,css,scss,json,yml,yaml,md}</summary>


**📄 CodeRabbit inference engine (CLAUDE.md)**

> Prettier is the sole authority for formatting all non-Ruby files; never manually format them

Files:
- `docs/api-reference/view-helpers-api.md`
- `docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md`
- `docs/api-reference/generator-details.md`
- `docs/getting-started/tutorial.md`
- `docs/building-features/rspec-configuration.md`
- `docs/misc/style.md`
- `docs/building-features/react-router.md`
- `docs/advanced-topics/rails-engine-integration.md`
- `docs/getting-started/project-structure.md`
- `docs/building-features/turbolinks.md`

</details>

</details><details>
<summary>🧠 Learnings (3)</summary>

<details>
<summary>📚 Learning: 2025-09-16T08:01:11.146Z</summary>

Learnt from: justin808
PR: #1770
File: lib/generators/react_on_rails/templates/base/base/app/javascript/src/HelloWorld/ror_components/HelloWorld.client.jsx:2-2
Timestamp: 2025-09-16T08:01:11.146Z
Learning: React on Rails uses webpack CSS Modules configuration with namedExports: true, which requires the import syntax import * as style from './file.module.css' rather than the default export pattern. This configuration enables better tree shaking and bundle size optimization for CSS modules.


**Applied to files:**
- `docs/building-features/rspec-configuration.md`
- `docs/getting-started/project-structure.md`

</details>
<details>
<summary>📚 Learning: 2025-04-26T21:55:55.874Z</summary>

Learnt from: alexeyr-ci2
PR: #1732
File: spec/dummy/client/app-react16/startup/ReduxSharedStoreApp.client.jsx:40-44
Timestamp: 2025-04-26T21:55:55.874Z
Learning: In the react_on_rails project, files under app-react16 directories are copied/moved to corresponding /app directories during the conversion process (removing the -react16 suffix), which affects their relative import paths at runtime.


**Applied to files:**
- `docs/getting-started/project-structure.md`

</details>
<details>
<summary>📚 Learning: 2025-02-13T16:50:26.861Z</summary>

Learnt from: AbanoubGhadban
PR: #1644
File: node_package/src/turbolinksUtils.ts:34-36
Timestamp: 2025-02-13T16:50:26.861Z
Learning: In React on Rails, when checking for Turbolinks version 5 using turbolinksVersion5(), always ensure Turbolinks exists first by checking turbolinksInstalled() to prevent TypeError when accessing properties.


**Applied to files:**
- `docs/building-features/turbolinks.md`

</details>

</details><details>
<summary>🪛 LanguageTool</summary>

<details>
<summary>docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md</summary>

[grammar] ~17-~17: Use a hyphen to join words.
Context: ...v-server` during development.  ## Server Side Rendering with the Default shakacod...

(QB_NEW_EN_HYPHEN)

---

[grammar] ~19-~19: There might be a mistake here.
Context: ..., then you have a couple of options. The recommended technique is to have a diffe...

(QB_NEW_EN)

---

[grammar] ~20-~20: There might be a mistake here.
Context: ...fferent Webpack configuration for server rendering.  ### If you use the same Webp...

(QB_NEW_EN)

</details>
<details>
<summary>docs/api-reference/generator-details.md</summary>

[grammar] ~60-~60: There might be a mistake here.
Context: ...ource directory for all React components - **`ror_components/`**: Directory name is configurable via `co...

(QB_NEW_EN)

---

[grammar] ~61-~61: There might be a mistake here.
Context: ...via `config.components_subdirectory` in `config/initializers/react_on_rails.rb` - **Auto-registration**: Components in `ror_...

(QB_NEW_EN)

---

[grammar] ~94-~94: There might be a mistake here.
Context: ..." components that receive data via props - **`containers/`**: Container "smart" components connected...

(QB_NEW_EN)

---

[grammar] ~95-~95: There might be a mistake here.
Context: ... Container "smart" components connected to Redux store - **`actions/`** and **`red...

(QB_NEW_EN)

---

[grammar] ~96-~96: There might be a mistake here.
Context: ...**`reducers/`**: Standard Redux patterns - **`ror_components/`**: Entry point files that initialize Redu...

(QB_NEW_EN)

---

[grammar] ~115-~115: There might be a mistake here.
Context: ...ed for use with `react_component` helper 4. Loaded on-demand when used in views  For detai...

(QB_NEW_EN)

</details>
<details>
<summary>docs/getting-started/tutorial.md</summary>

[grammar] ~36-~36: There might be a mistake here.
Context: ...mr-vs-react-hot-reloading) - [Deployment](#deployment) - [Going Further](#going-further)   - [Turn...

(QB_NEW_EN)

---

[grammar] ~37-~37: There might be a mistake here.
Context: ...eployment](#deployment) - [Going Further](#going-further)   - [Turning on Server Rendering](#turning-on...

(QB_NEW_EN)

---

[grammar] ~38-~38: There might be a mistake here.
Context: ...urther)   - [Turning on Server Rendering](#turning-on-server-rendering)   - [Optional Configuration](#optional-config...

(QB_NEW_EN)

---

[grammar] ~39-~39: There might be a mistake here.
Context: ...r-rendering)   - [Optional Configuration](#optional-configuration)     - [Moving from the Rails default `/app/java...

(QB_NEW_EN)

---

[grammar] ~40-~40: There might be a mistake here.
Context: ...` to the recommended `/client` structure](#moving-from-the-rails-default-appjavascript-to-the-recommended-client-structure)     - [Custom IP & PORT setup (Cloud9 example)]...

(QB_NEW_EN)

---

[grammar] ~41-~41: There might be a mistake here.
Context: ...[Custom IP & PORT setup (Cloud9 example)](#custom-ip--port-setup-cloud9-example)     - [RubyMine performance tip](#rubymine-perf...

(QB_NEW_EN)

---

[grammar] ~42-~42: There might be a mistake here.
Context: ...example)     - [RubyMine performance tip](#rubymine-performance-tip) - [Conclusion](#conclusion)  ## Installatio...

(QB_NEW_EN)

---

[uncategorized] ~147-~147: If this is a compound adjective that modifies the following noun, use a hyphen.
Context: ...out a special React setup, will cause a full page refresh each time you save a file.  If ...

(EN_COMPOUND_ADJECTIVE_INTERNAL)

---

[grammar] ~151-~151: There might be a mistake here.
Context: ...k at these links:  - [webpack-dev-server](https://github.com/rails/webpacker/blob/5-x-stable/docs/webpack-dev-server.md) - [DevServer](https://webpack.js.org/config...

(QB_NEW_EN)

---

[grammar] ~152-~152: There might be a mistake here.
Context: ...docs/webpack-dev-server.md) - [DevServer](https://webpack.js.org/configuration/dev-server/) - [Hot Module Replacement](https://webpack....

(QB_NEW_EN)

---

[grammar] ~163-~163: There might be a mistake here.
Context: ...t.md)** - Step-by-step Heroku deployment - **[General Deployment Guide](../deployment/...

(QB_NEW_EN)

---

[grammar] ~168-~168: There might be a mistake here.
Context: ... guides cover:  - Configuring buildpacks - Database setup (PostgreSQL) - Asset comp...

(QB_NEW_EN)

---

[grammar] ~169-~169: There might be a mistake here.
Context: ...buildpacks - Database setup (PostgreSQL) - Asset compilation - Environment variable...

(QB_NEW_EN)

---

[grammar] ~170-~170: There might be a mistake here.
Context: ...e setup (PostgreSQL) - Asset compilation - Environment variables - Troubleshooting ...

(QB_NEW_EN)

---

[grammar] ~171-~171: There might be a mistake here.
Context: ...sset compilation - Environment variables - Troubleshooting common deployment issues...

(QB_NEW_EN)

</details>
<details>
<summary>docs/building-features/react-router.md</summary>

[uncategorized] ~7-~7: “React” is a proper noun and needs to be capitalized.
Context: ...g with the HelloWorldApp created by the react_on_rails generator (with `--redux` opti...

(A_GOOGLE)

</details>
<details>
<summary>docs/building-features/turbolinks.md</summary>

[grammar] ~24-~24: There might be a mistake here.
Context: ...nks 5.x** (e.g., 5.0.0+) - Auto-detected - **Turbolinks 2.x** (Classic) - Auto-detect...

(QB_NEW_EN)

---

[grammar] ~25-~25: There might be a mistake here.
Context: ...tected - **Turbolinks 2.x** (Classic) - Auto-detected - See [Turbolinks on Github](ht...

(QB_NEW_EN)

---

[grammar] ~25-~25: There might be a mistake here.
Context: ...rbolinks 2.x** (Classic) - Auto-detected - See [Turbolinks on Github](https://githu...

(QB_NEW_EN)

---

[uncategorized] ~26-~26: The official name of this software platform is spelled with a capital “H”.
Context: ...c) - Auto-detected - See [Turbolinks on Github](https://github.com/rails/turbolinks)  ...

(GITHUB)

---

[grammar] ~32-~32: There might be a mistake here.
Context: ...l not reload JavaScript and stylesheets. This definitely can make an app perform ...

(QB_NEW_EN)

---

[grammar] ~112-~112: There might be a mistake here.
Context: ...ges the head element by JavaScript (not only body) on page changes with the correct ...

(QB_NEW_EN)

---

[grammar] ~113-~113: There might be a mistake here.
Context: .../23/mime-type-resolution-in-rails.html). - **Multiple Webpack bundles**: If you're us...

(QB_NEW_EN)

</details>

</details>
<details>
<summary>🪛 markdownlint-cli2 (0.18.1)</summary>

<details>
<summary>docs/api-reference/generator-details.md</summary>

50-50: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

---

70-70: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

</details>
<details>
<summary>docs/getting-started/tutorial.md</summary>

7-7: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)

</details>

</details>

</details>

<details>
<summary>⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (10)</summary>

* GitHub Check: build-dummy-app-webpack-test-bundles (3.2, 20)
* GitHub Check: rspec-package-tests (3.4, latest)
* GitHub Check: build-dummy-app-webpack-test-bundles (3.4, 22)
* GitHub Check: rspec-package-tests (3.4, minimum)
* GitHub Check: rspec-package-tests (3.2, latest)
* GitHub Check: rspec-package-tests (3.2, minimum)
* GitHub Check: claude-review
* GitHub Check: markdown-link-check
* GitHub Check: build
* GitHub Check: build-and-test

</details>

<details>
<summary>🔇 Additional comments (4)</summary><blockquote>

<details>
<summary>docs/building-features/rspec-configuration.md (2)</summary><blockquote>

`5-22`: **Heading promotion reads better.**

Upgrading this section to an H2 makes the hierarchy consistent under the page title. Looks good.

---

`23-47`: **Second heading change also looks right.**

Matching the previous section with another H2 keeps the structure tidy. All good.

</blockquote></details>
<details>
<summary>docs/advanced-topics/rails-engine-integration.md (2)</summary><blockquote>

`1-2`: **Solid header upgrade.**

New H1 clarifies the page scope. Looks good.

---

`35-40`: **Useful issue cross-references added.**

Additional links and heading tweak improve navigation without regressions.

</blockquote></details>

</blockquote></details>

</details>

<!-- This is an auto-generated comment by CodeRabbit for review status -->


### Professional Support

- **[ShakaCode Support](mailto:[email protected])** - Professional React on Rails help
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm pretty sure that @justin808 will want this left on the Readme.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I didn't delete it entirely, it was moved to introduction.md to keep the docs/README focused on technical content and the TOC, while referring readers to the docs website for more in-depth information. do we need to put it here as well regardless?

@@ -1,4 +1,4 @@
## React on Rails Pro
# React on Rails Pro
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

When are we going to change the link for ReactOnRails Pro on line 10 (and probably in other places as well)?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

to what? do you mean now that we merged? the link on line 10 is pointing to the website not github

Copy link
Contributor

@Judahmeek Judahmeek left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good work!

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)
docs/planning/docs-improvement/ia-redesign-live.md (1)

402-479: Add language hint to the folder structure code block.

The fenced code block lacks a language identifier, triggering markdownlint MD040. Tag it as text for consistency.

-```
+```text
 docs/
 ├── introduction.md              # ✅ Created - new unified homepage
 ├── README.md                    # ✅ Simplified for GitHub users
♻️ Duplicate comments (2)
docs/building-features/react-router.md (1)

37-40: Verify the file path matches generator output.

A previous review noted that the React on Rails generator with --redux scaffolds bundles under app/javascript/bundles/HelloWorld/... (with startup, store, components), not src/HelloWorldApp/ror_components/. Ensure this path guidance matches the actual generated structure or clarify that it's for auto-bundling setups.

#!/bin/bash
# Verify the actual structure created by the generator with --redux
rg -n "generate react_on_rails:install.*redux" docs/ -A5 -B5
docs/getting-started/using-react-on-rails.md (1)

126-130: Add language hint to the code block.

The fenced code block showing the directory structure lacks a language identifier, which triggers markdownlint MD040.

-```
+```text
 app/javascript/
 └── bundles/HelloWorld/          # or src/HelloWorld/ror_components/ with auto-bundling
     └── HelloWorld.jsx
🧹 Nitpick comments (3)
docs/core-concepts/webpack-configuration.md (1)

25-25: Minor: Simplify verbose phrasing.

The phrase "In order to" is unnecessarily wordy. Consider using "To" instead for conciseness.

-Typical Shakapacker apps have a standard directory structure as documented [here](https://github.com/shakacode/shakapacker/blob/master/README.md#configuration-and-code). If you follow [the basic tutorial](../getting-started/tutorial.md), you will see this pattern in action. In order to customize the Webpack configuration, consult the [Shakapacker webpack customization docs](https://github.com/shakacode/shakapacker#webpack-configuration).
+Typical Shakapacker apps have a standard directory structure as documented [here](https://github.com/shakacode/shakapacker/blob/master/README.md#configuration-and-code). If you follow [the basic tutorial](../getting-started/tutorial.md), you will see this pattern in action. To customize the Webpack configuration, consult the [Shakapacker webpack customization docs](https://github.com/shakacode/shakapacker#webpack-configuration).
spec/dummy/package.json (1)

26-26: Consider specifying a more recent React Router v6 baseline.

The ^6.0.0 range will install the latest v6.x (currently 6.30.1), which is fine. However, React Router v6.4+ introduced route-level loaders, actions, and RouterProvider, so you may want to set a higher baseline like ^6.4.0 if you plan to use those features.

Based on learnings.

-    "react-router-dom": "^6.0.0",
+    "react-router-dom": "^6.4.0",
docs/building-features/process-managers.md (1)

81-85: Consider using a standard syntax identifier for the code block.

The procfile identifier may not be recognized by most Markdown renderers. Consider using bash or plain code blocks (no identifier) for better compatibility across documentation viewers.

-```procfile
+```bash
 rails: bundle exec rails s -p 3000
 wp-client: bin/shakapacker-dev-server
 wp-server: SERVER_BUNDLE_ONLY=true bin/shakapacker --watch

</blockquote></details>

</blockquote></details>

<details>
<summary>📜 Review details</summary>

**Configuration used**: CodeRabbit UI

**Review profile**: CHILL

**Plan**: Pro

<details>
<summary>📥 Commits</summary>

Reviewing files that changed from the base of the PR and between e2333c4ed52782445afe194a351477734d337448 and 5ed73ee57deecde2c04842619081e1f76eb63641.

</details>

<details>
<summary>⛔ Files ignored due to path filters (1)</summary>

* `spec/dummy/yarn.lock` is excluded by `!**/yarn.lock`, `!**/*.lock`

</details>

<details>
<summary>📒 Files selected for processing (14)</summary>

* `docs/api-reference/view-helpers-api.md` (3 hunks)
* `docs/building-features/process-managers.md` (1 hunks)
* `docs/building-features/react-router.md` (1 hunks)
* `docs/core-concepts/webpack-configuration.md` (1 hunks)
* `docs/deployment/troubleshooting-build-errors.md` (1 hunks)
* `docs/getting-started/quick-start.md` (2 hunks)
* `docs/getting-started/using-react-on-rails.md` (1 hunks)
* `docs/outdated/foreman-issues.md` (1 hunks)
* `docs/planning/docs-improvement/ia-redesign-live.md` (3 hunks)
* `lib/react_on_rails/dev/process_manager.rb` (1 hunks)
* `spec/dummy/client/app/components/RouterLayout.jsx` (2 hunks)
* `spec/dummy/client/app/routes/routes.jsx` (1 hunks)
* `spec/dummy/client/app/startup/RouterApp.server.jsx` (1 hunks)
* `spec/dummy/package.json` (1 hunks)

</details>

<details>
<summary>✅ Files skipped from review due to trivial changes (1)</summary>

* docs/outdated/foreman-issues.md

</details>

<details>
<summary>🧰 Additional context used</summary>

<details>
<summary>📓 Path-based instructions (3)</summary>

<details>
<summary>**/*.{js,jsx,ts,tsx,css,scss,json,yml,yaml,md}</summary>


**📄 CodeRabbit inference engine (CLAUDE.md)**

> Prettier is the sole authority for formatting all non-Ruby files; never manually format them

Files:
- `docs/building-features/process-managers.md`
- `docs/planning/docs-improvement/ia-redesign-live.md`
- `docs/deployment/troubleshooting-build-errors.md`
- `docs/building-features/react-router.md`
- `docs/getting-started/quick-start.md`
- `spec/dummy/client/app/routes/routes.jsx`
- `spec/dummy/package.json`
- `spec/dummy/client/app/startup/RouterApp.server.jsx`
- `spec/dummy/client/app/components/RouterLayout.jsx`
- `docs/api-reference/view-helpers-api.md`
- `docs/core-concepts/webpack-configuration.md`
- `docs/getting-started/using-react-on-rails.md`

</details>
<details>
<summary>{Gemfile,Rakefile,config.ru,**/*.{rb,rake,gemspec,ru}}</summary>


**📄 CodeRabbit inference engine (CLAUDE.md)**

> `{Gemfile,Rakefile,config.ru,**/*.{rb,rake,gemspec,ru}}`: All Ruby code must pass RuboCop with zero offenses before commit/push
> RuboCop is the sole authority for Ruby file formatting; never manually format Ruby files

Files:
- `lib/react_on_rails/dev/process_manager.rb`

</details>
<details>
<summary>**/*.{js,jsx,ts,tsx}</summary>


**📄 CodeRabbit inference engine (CLAUDE.md)**

> Use ESLint for JS/TS code (lint via rake lint or yarn lint)

Files:
- `spec/dummy/client/app/routes/routes.jsx`
- `spec/dummy/client/app/startup/RouterApp.server.jsx`
- `spec/dummy/client/app/components/RouterLayout.jsx`

</details>

</details><details>
<summary>🧠 Learnings (1)</summary>

<details>
<summary>📚 Learning: 2025-04-26T21:55:55.874Z</summary>

Learnt from: alexeyr-ci2
PR: #1732
File: spec/dummy/client/app-react16/startup/ReduxSharedStoreApp.client.jsx:40-44
Timestamp: 2025-04-26T21:55:55.874Z
Learning: In the react_on_rails project, files under app-react16 directories are copied/moved to corresponding /app directories during the conversion process (removing the -react16 suffix), which affects their relative import paths at runtime.


**Applied to files:**
- `docs/planning/docs-improvement/ia-redesign-live.md`

</details>

</details><details>
<summary>🧬 Code graph analysis (1)</summary>

<details>
<summary>spec/dummy/client/app/routes/routes.jsx (1)</summary><blockquote>

<details>
<summary>spec/dummy/client/app/components/RouterLayout.jsx (1)</summary>

* `RouterLayout` (6-29)

</details>

</blockquote></details>

</details><details>
<summary>🪛 LanguageTool</summary>

<details>
<summary>docs/api-reference/view-helpers-api.md</summary>

[grammar] ~108-~108: Use a hyphen to join words.
Context: ...itting with server rendering, the server rendered code has any async code loaded ...

(QB_NEW_EN_HYPHEN)

---

[grammar] ~108-~108: Ensure spelling is correct
Context: ...he client code must also fully load any asynch code before server rendering. Otherwise...

(QB_NEW_EN_ORTHOGRAPHY_ERROR_IDS_1)

</details>
<details>
<summary>docs/core-concepts/webpack-configuration.md</summary>

[style] ~25-~25: Consider a more concise word here.
Context: ...), you will see this pattern in action. In order to customize the Webpack configuration, co...

(IN_ORDER_TO_PREMIUM)

</details>

</details>
<details>
<summary>🪛 markdownlint-cli2 (0.18.1)</summary>

<details>
<summary>docs/planning/docs-improvement/ia-redesign-live.md</summary>

402-402: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

</details>
<details>
<summary>docs/core-concepts/webpack-configuration.md</summary>

25-25: Link text should be descriptive

(MD059, descriptive-link-text)

</details>
<details>
<summary>docs/getting-started/using-react-on-rails.md</summary>

126-126: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

</details>

</details>

</details>

<details>
<summary>⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (10)</summary>

* GitHub Check: build
* GitHub Check: build-dummy-app-webpack-test-bundles (3.4, 22)
* GitHub Check: markdown-link-check
* GitHub Check: rspec-package-tests (3.4, latest)
* GitHub Check: build-dummy-app-webpack-test-bundles (3.2, 20)
* GitHub Check: rspec-package-tests (3.4, minimum)
* GitHub Check: rspec-package-tests (3.2, latest)
* GitHub Check: rspec-package-tests (3.2, minimum)
* GitHub Check: claude-review
* GitHub Check: build-and-test

</details>

<details>
<summary>🔇 Additional comments (18)</summary><blockquote>

<details>
<summary>docs/deployment/troubleshooting-build-errors.md (1)</summary><blockquote>

`279-279`: **Link update is well-formed.**

The relative path correctly resolves from `docs/deployment/` to `docs/core-concepts/webpack-configuration.md`, and the link text is descriptive. This update aligns with the PR's documentation restructuring objectives.

</blockquote></details>
<details>
<summary>docs/api-reference/view-helpers-api.md (2)</summary><blockquote>

`122-122`: **Approve Pro guide reference addition to React Router section.**

The new link to the React on Rails Pro loadable-components guide is well-placed and aligns with the PR's broader initiative to surface Pro guidance across API references. This provides users with a clear path to modern code-splitting solutions with server-side rendering.

---

`137-137`: **Verify heading level change is correctly formatted.**

The heading for "More details" has been demoted from top-level to secondary-level, which is appropriate for the documentation structure reorganization. Ensure the Markdown syntax (number of `#` symbols) is correct and renders as intended in the published documentation.

</blockquote></details>
<details>
<summary>spec/dummy/client/app/startup/RouterApp.server.jsx (1)</summary><blockquote>

`2-2`: **LGTM! Correct StaticRouter import for React Router v6.**

In v6, StaticRouter is imported from 'react-router-dom/server', and this change correctly updates the import path for server-side rendering.



Based on learnings.

</blockquote></details>
<details>
<summary>docs/getting-started/quick-start.md (2)</summary><blockquote>

`127-127`: **Good clarification.**

The HTML tag formatting makes the instruction clearer for readers.

---

`162-162`: **Link correctly updated to new file location.**

The link now points to the newly created `using-react-on-rails.md` file, consistent with the documentation restructuring in this PR.

</blockquote></details>
<details>
<summary>spec/dummy/client/app/routes/routes.jsx (1)</summary><blockquote>

`2-10`: **LGTM! Correct React Router v6 migration.**

The changes properly implement v6 patterns:
- Routes component replaces Switch
- Route uses element prop instead of component
- Wildcard path (`/react_router/*`) correctly supports nested routing in RouterLayout



Based on learnings.

</blockquote></details>
<details>
<summary>spec/dummy/client/app/components/RouterLayout.jsx (2)</summary><blockquote>

`2-2`: **Correct imports for React Router v6.**

Adding Routes to the imports is necessary for the migration.

---

`24-27`: **LGTM! Proper v6 nested routing implementation.**

The changes correctly implement React Router v6 patterns:
- Routes replaces Switch
- Route uses element prop
- Nested routes use relative paths by default in v6



Based on learnings.

</blockquote></details>
<details>
<summary>docs/building-features/react-router.md (4)</summary><blockquote>

`7-17`: **Excellent Turbo/Turbolinks conflict warning.**

The compatibility note clearly explains the routing conflict and provides practical solutions. This will save users significant debugging time.

---

`21-29`: **Good guidance on React Router v6 vs v7.**

The explanation of why to use v6 instead of v7 (Remix merger) is valuable and aligns with React on Rails' architecture.

---

`86-119`: **LGTM! Correct server-side rendering implementation.**

The server-side setup properly uses:
- StaticRouter from 'react-router-dom/server'
- Routes and Route with element prop
- `location` from `railsContext` for SSR



Based on learnings.

---

`128-160`: **Critical Rails routing configuration guidance.**

This section is essential for React Router to work correctly with server-side rendering and direct URL visits. The wildcard route pattern is properly explained with clear examples.

</blockquote></details>
<details>
<summary>docs/planning/docs-improvement/ia-redesign-live.md (1)</summary><blockquote>

`324-396`: **Well-documented Phase 3 completion.**

The detailed tracking of completed actions provides excellent documentation of the restructuring process, including rationale for deletions and consolidations.

</blockquote></details>
<details>
<summary>lib/react_on_rails/dev/process_manager.rb (1)</summary><blockquote>

`150-150`: **LGTM! Documentation URL correctly updated.**

The URL now points to the official Foreman wiki, which is the authoritative source for this guidance. This change is consistent with the new documentation added in `docs/building-features/process-managers.md` (line 50), which references the same URL.

</blockquote></details>
<details>
<summary>docs/building-features/process-managers.md (3)</summary><blockquote>

`1-22`: **LGTM! Clear introduction and usage instructions.**

The process list and fallback order accurately reflect the implementation in `lib/react_on_rails/dev/process_manager.rb`.

---

`87-91`: **The See Also section is correct.**

The HMR documentation file exists at the referenced path. All links in this section have been verified and are valid.

---

`23-62`: **All external documentation links are verified and accessible.**

The installation instructions for both Overmind and Foreman are clear and accurate. The emphasis on not bundling Foreman is appropriate and well-supported by the official documentation. All external URLs resolve correctly (HTTP 200).

</blockquote></details>

</blockquote></details>

</details>

<!-- This is an auto-generated comment by CodeRabbit for review status -->

@justin808
Copy link
Member

@claude review this PR

@claude
Copy link

claude bot commented Oct 18, 2025

Claude finished @justin808's task —— View job


PR Review: Entry Point Consolidation and Tutorial Improvements

Reviewing PR #1860 - Phase 3 of documentation IA redesign.

Tasks

  • Read and analyze key documentation files
  • Review React Router v6 migration code
  • Check version consistency across documentation
  • Review documentation structure decisions
  • Verify internal links
  • Check for remaining issues from automated reviews
  • Provide final review feedback

Overall Assessment

This is excellent documentation work that significantly improves the user experience. The consolidation is well-executed and addresses a real problem of multiple conflicting entry points. I have a few minor issues to address and one syntax error to fix.

✅ Strengths

1. Entry Point Consolidation (Problem Solved!)

The new structure successfully eliminates confusion:

  • introduction.md - Excellent unified homepage with clear value proposition, use cases, and multiple learning paths
  • README.md - Properly simplified (173→65 lines) for GitHub browsing
  • using-react-on-rails.md - Good transformation from mixed-purpose to conceptual guide
  • ✅ Deletions are justified (home.md, react-on-rails-overview.md, manual-installation-overview.md)

2. Tutorial Improvements

  • Critical version updates: Ruby 3.0+, Rails 7, React on Rails v16, Shakapacker v7
  • Heroku deployment extraction improves flow (139 lines moved to dedicated guide)
  • Redux vs Hooks clarification (lines 113-119 in tutorial.md) is helpful
  • Clear structure with proper TOC and logical progression

3. React Router v6 Migration

Code changes look correct:

  • StaticRouter import from react-router-dom/server (not react-router)
  • Routes and Route with element prop (not component)
  • ✅ Wildcard routes for nested routing (/react_router/*)
  • ✅ Documentation properly warns about Turbo/Turbolinks conflicts

4. Documentation Quality

  • ✅ Writing is clear and well-structured
  • ✅ Good use of callouts and tables
  • ✅ Appropriate linking between related topics
  • ✅ No broken internal references found

⚠️ Issues to Address

1. Syntax Error in using-react-on-rails.md (Line 192)

File: docs/getting-started/using-react-on-rails.md:192

{
  renderedHtml: {
    componentHtml, redirectLocation, error;  // ❌ Semicolon should be comma
  }
}

Fix:

{
  renderedHtml: {
    componentHtml,
    redirectLocation,
    error
  }
}

This is invalid JavaScript that won't work if users copy it.

2. Markdownlint Issues (CI will fail)

Several code blocks missing language hints:

  • docs/getting-started/using-react-on-rails.md:126 - Directory tree needs text tag
  • docs/deployment/heroku-deployment.md:100 - Procfile needs language tag
  • docs/getting-started/tutorial.md:7 - Italics used as heading (MD036)

3. Heroku Guide Version Inconsistency

File: docs/deployment/heroku-deployment.md:131-135

Still pins Node 16.19.0 (EOL) and Yarn 1.22.4, contradicting the stated requirements of Node 18+:

"engines": {
  "node": "16.19.0",  // ❌ Should be 18+ per introduction.md
  "yarn": "1.22.4"
}

Recommendation: Update to current versions or add a note explaining why these are older (e.g., "This example uses older versions; update to your project's requirements").

4. Tutorial Rails Version Confusion

File: docs/getting-started/tutorial.md:52-62

Lines 52-53 say "We support Rails 6 and later" but line 61 requires "Rails 7.0 or above". This sends mixed signals.

Recommendation: Clarify: "This tutorial targets Rails 7.0+. Rails 6 is supported but some steps may differ."

💡 Minor Suggestions

1. Process Managers Documentation

The new docs/building-features/process-managers.md is a good addition! Moving foreman-issues.md to outdated was the right call.

2. Deleted Files Review

All deletions are appropriate:

  • code-splitting.md → outdated
  • foreman-issues.md → moved to outdated/
  • ✅ 9 outdated/* files → correctly removed
  • manual-installation-overview.md → correct decision (had TODO since 2018)

3. React Router Documentation Path Reference

File: docs/building-features/react-router.md:39

The file path reference mentions app/javascript/src/HelloWorldApp/ror_components/ but the generator with --redux actually creates app/javascript/bundles/HelloWorld/ structure. Consider clarifying this is for auto-bundling setups or updating the example path.

📋 Checklist for Merge

Before merging, please address:

  1. [REQUIRED] Fix JavaScript syntax error in using-react-on-rails.md:192
  2. [REQUIRED] Add language tags to code blocks (CI lint will fail otherwise)
  3. [RECOMMENDED] Update Heroku Node/Yarn versions or add explanatory note
  4. [RECOMMENDED] Clarify Rails version requirements in tutorial
  5. [OPTIONAL] Verify React Router file path examples match generator output

🎯 Final Verdict

Approve with minor fixes required

The documentation restructuring successfully:

  • ✅ Eliminates multiple conflicting entry points
  • ✅ Improves tutorial accuracy and flow
  • ✅ Removes genuinely outdated content
  • ✅ Maintains high documentation quality
  • ✅ Provides clear learning paths

This is a significant improvement to the user experience. Once the JavaScript syntax error is fixed and lint issues are resolved, this is ready to merge.

Excellent work @ihabadham! This reorganization will make it much easier for new users to get started.


Required Actions Before Merge

# Fix the syntax error in using-react-on-rails.md line 192
# Add language tags to code fences (text, bash, Procfile, etc.)
# Run formatting check
rake autofix

Job Run • Branch: feature/docs-ia-redesign-1845-continue

@ihabadham
Copy link
Contributor Author

@claude good catches! can you check the fixes i made and did i resolve the issues you stated or not? here's a report:

✅ Fixed Issues

  1. JavaScript syntax error (line 192) - FIXED
  • Changed to ({ renderedHtml: { componentHtml, redirectLocation, error } }) with parentheses
  • Prettier was interpreting it as a block statement instead of object literal
  • Commit: 60e9cea
  1. Markdownlint issues - FIXED
  • Added language hints: text for directory tree, procfile for Procfile
  • Commit: 60e9cea
  1. Rails version confusion - FIXED
  • Clarified: "This tutorial targets Rails 7.0+. React on Rails supports Rails 6 and later, but some tutorial steps may differ for
    Rails 6."
  • Commit: 60e9cea

⚠️ Not Changed

  1. Heroku Node/Yarn versions - ACKNOWLEDGED, NOT UPDATED
  • We already added a note: "This guide is based on the working tutorial app at reactrails.com. While the instructions work, some
    versions referenced are older."
  • The versions are from the actual working tutorial, so we're leaving them with the disclaimer
  1. React Router file path - NO ISSUE
  • The path app/javascript/src/HelloWorldApp/ror_components/ is correct for auto-bundling mode
  • Traditional bundling uses app/javascript/bundles/HelloWorld/
  • Our docs correctly reference the auto-bundling structure

@claude
Copy link

claude bot commented Oct 19, 2025

Claude finished @ihabadham's task —— View job


Verification Complete ✅

I've reviewed all the fixes and here's my assessment:

Issue 1: JavaScript Syntax Error - FIXED

File: docs/getting-started/using-react-on-rails.md:190-196

Status: ✅ Correctly fixed in commit 60e9cea

The object literal now correctly uses parentheses:

({
  renderedHtml: {
    componentHtml,
    redirectLocation,
    error,
  },
});

This is the proper syntax for returning an object literal from an arrow function. Well done!


Issue 2: Markdownlint Issues - FIXED

Status: ✅ Correctly fixed in commit 60e9cea

Both issues resolved:

  1. Directory tree (using-react-on-rails.md:126): Now has ```text language hint
  2. Procfile (heroku-deployment.md:100): Now has ```procfile language hint

These changes will prevent MD040 linting errors.


Issue 3: Rails Version Confusion - FIXED

File: docs/getting-started/tutorial.md:52

Status: ✅ Correctly fixed in commit 60e9cea

The clarification is perfect:

"This tutorial targets Rails 7.0+. React on Rails supports Rails 6 and later, but some tutorial steps may differ for Rails 6."

This clearly explains:

  • What the tutorial focuses on (Rails 7.0+)
  • What React on Rails supports (Rails 6+)
  • That there may be differences for Rails 6 users

Excellent resolution!


⚠️ Issue 4: Heroku Node/Yarn Versions - REASONABLE DECISION

File: docs/deployment/heroku-deployment.md:131-135

Status: ⚠️ Acknowledged but not updated - This is acceptable

Your reasoning: The guide is based on a working tutorial app at reactrails.com, and a disclaimer note was added at the top of the file.

My assessment:This approach is reasonable because:

  1. The disclaimer is clear and prominent (line 3):

    "This guide is based on the working tutorial app at reactrails.com. While the instructions work, some versions referenced are older. For current Heroku best practices with Rails 7, see Heroku's Rails 7 Guide."

  2. It provides a link to Heroku's current Rails 7 guide for users who want modern versions

  3. The working example serves as a verified reference point

  4. Users can adapt the versions as needed

Alternative consideration: If you want to fully address the automated review feedback, you could add a brief inline note near the engines block like:

  "engines": {
    "node": "16.19.0",  // Or use Node 18+ per system requirements
    "yarn": "1.22.4"
  },

But this is not required given your disclaimer approach is adequate.


Issue 5: React Router File Path - NO ISSUE, PATH IS CORRECT

File: docs/building-features/react-router.md:39

Status:Your assessment is correct

Path shown: app/javascript/src/HelloWorldApp/ror_components/HelloWorldApp.client.jsx

Verification from generator docs (docs/api-reference/generator-details.md:70-86):

The Redux generator (--redux flag) creates:

app/javascript/
└── src/
    └── HelloWorldApp/
        ├── actions/
        ├── components/
        ├── containers/
        ├── reducers/
        ├── ror_components/          # Auto-registered entry points
        │   ├── HelloWorldApp.client.jsx  ← This is the correct path!
        │   └── HelloWorldApp.server.jsx
        └── store/

The automated review may have been confused because:

  • Non-Redux mode uses: app/javascript/bundles/HelloWorld/
  • Redux mode uses: app/javascript/src/HelloWorldApp/

Your React Router documentation correctly shows the Redux structure since the example explicitly states "If you're using Redux (created with rails generate react_on_rails:install --redux)". No change needed.


Summary

Issue Status Action Required
1. JavaScript syntax error ✅ Fixed None
2. Markdownlint issues ✅ Fixed None
3. Rails version confusion ✅ Fixed None
4. Heroku Node/Yarn versions ⚠️ Acknowledged Optional: Add inline comment (but current disclaimer is adequate)
5. React Router path ✅ Correct None (automated review was mistaken)

Overall assessment: All critical issues have been properly addressed. The fixes in commit 60e9cea are correct and resolve the identified problems. Your decisions on issues 4 and 5 are well-reasoned and appropriate.

Great work on the fixes! 🎉


Job Run • Branch: feature/docs-ia-redesign-1845-continue

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 0

♻️ Duplicate comments (2)
docs/deployment/heroku-deployment.md (1)

131-135: Update Node version from EOL 16.x to 18+.

Node 16.19.0 is end-of-life and does not match the Node 18+ requirement mentioned in the Quick Start. Users following this guide will deploy on an unsupported runtime.

Apply this diff to align with current requirements:

   "engines": {
-    "node": "16.19.0",
+    "node": ">=18.0.0",
     "yarn": "1.22.4"
   },
docs/getting-started/tutorial.md (1)

7-7: Fix MD036 linting violation: convert italics to a proper blockquote.

The emphasized line is flagged by markdownlint MD036 (emphasis used instead of a heading). Convert it to a blockquote-style note while preserving the version information.

Apply this diff:

-_Updated for Ruby 3.0+, Rails 7, React on Rails v16, and Shakapacker v7_
+> **Note:** Updated for Ruby 3.0+, Rails 7, React on Rails v16, and Shakapacker v7.
🧹 Nitpick comments (3)
docs/deployment/heroku-deployment.md (3)

100-100: Capitalize the Procfile code fence language hint for consistency.

The language hint is present (fixing MD040), but convention and the past review comment specify Procfile with a capital P.

Apply this diff:

-```procfile
+```Procfile
 web: bundle exec puma -C config/puma.rb

77-77: Optional: Reduce redundant phrasing for variety.

The phrase "Then you need to set up Postgres" reuses phrasing from nearby sentences. Consider rephrasing for variety:

-Then you need to set up Postgres so you can run locally:
+Now set up Postgres locally:

Per LanguageTool style guidance.


153-153: Optional: Reduce redundant pronoun usage.

The sentence reuses "you" pronouns, which could be tightened:

-and you will see your live app and you can share this URL with your friends.
+and you'll see your live app—share the URL with your friends.

Per LanguageTool style guidance.

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 8b334ba and 60e9cea.

📒 Files selected for processing (3)
  • docs/deployment/heroku-deployment.md (2 hunks)
  • docs/getting-started/tutorial.md (12 hunks)
  • docs/getting-started/using-react-on-rails.md (1 hunks)
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{js,jsx,ts,tsx,css,scss,json,yml,yaml,md}

📄 CodeRabbit inference engine (CLAUDE.md)

Prettier is the sole authority for formatting all non-Ruby files; never manually format them

Files:

  • docs/getting-started/tutorial.md
  • docs/getting-started/using-react-on-rails.md
  • docs/deployment/heroku-deployment.md
🪛 LanguageTool
docs/getting-started/tutorial.md

[uncategorized] ~147-~147: If this is a compound adjective that modifies the following noun, use a hyphen.
Context: ...out a special React setup, will cause a full page refresh each time you save a file. If ...

(EN_COMPOUND_ADJECTIVE_INTERNAL)

docs/deployment/heroku-deployment.md

[style] ~77-~77: You have already used this phrasing in nearby sentences. Consider replacing it to add variety to your writing.
Context: ... database: ror_production ``` Then you need to set up Postgres so you can run locally:...

(REP_NEED_TO_VB)


[style] ~153-~153: Reusing ‘you’ could be redundant. Try omitting the pronoun.
Context: ...``` and you will see your live app and you can share this URL with your friends. Congr...

(SUBJECT_DROP)

🪛 markdownlint-cli2 (0.18.1)
docs/getting-started/tutorial.md

7-7: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (9)
  • GitHub Check: rspec-package-tests (3.4, latest)
  • GitHub Check: rspec-package-tests (3.2, latest)
  • GitHub Check: rspec-package-tests (3.4, minimum)
  • GitHub Check: rspec-package-tests (3.2, minimum)
  • GitHub Check: build-dummy-app-webpack-test-bundles (3.4, 22)
  • GitHub Check: build-dummy-app-webpack-test-bundles (3.2, 20)
  • GitHub Check: build
  • GitHub Check: markdown-link-check
  • GitHub Check: build-and-test
🔇 Additional comments (6)
docs/deployment/heroku-deployment.md (1)

1-179: Content structure and organization look solid.

The consolidation of Heroku deployment guidance is well-organized with clear step-by-step sections. The introduction disclaimer appropriately notes version age and directs readers to current Heroku Rails 7 guidance. The new sections (app creation, PostgreSQL migration, Puma config, Node/Yarn specification, deployment steps) are comprehensive and follow Heroku best practices.

The main issues to address are the Node version pin (flagged separately) and optional style improvements.

docs/getting-started/using-react-on-rails.md (2)

126-130: Past review issues have been properly addressed.

The code fences now include appropriate language hints (text, js), and the JavaScript object syntax is correct with proper comma separation and no extraneous semicolons. Good attention to detail in resolving the linting violations.

Also applies to: 189-197


1-246: Comprehensive documentation with clear progression and helpful examples.

The document effectively scaffolds understanding from installation through advanced topics. The code examples are well-commented, all code fences have proper language hints, and the navigation callout at the top appropriately directs new users to the quick-start before returning here. Links to related documentation are consistent and comprehensive.

docs/getting-started/tutorial.md (3)

113-119: Redux vs. Hooks choice is well-clarified.

The distinction between the default Hooks-based installer and the optional Redux setup is now explicit and helpful. This addresses a common point of confusion for new users following the tutorial.


157-173: Deployment section properly extracted and well-organized.

The new Deployment section appropriately redirects readers to dedicated guides (Heroku and General Deployment) rather than duplicating instructions inline. This aligns with the PR's goal of consolidating deployment content and improves maintainability.


25-43: Table of Contents properly reflects restructured content.

The TOC accurately maps the new organization with "Deployment" as a top-level section and "Going Further" replacing "Other features," making the document structure clearer and more logical for users seeking deployment guidance early.

@ihabadham ihabadham force-pushed the feature/docs-ia-redesign-1845-continue branch from 52d4a18 to 98ca50a Compare October 21, 2025 17:52
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

♻️ Duplicate comments (5)
docs/building-features/turbolinks.md (2)

16-16: Remove or replace the TODO placeholder before publishing.

Line 16 still contains the unfinished placeholder _TODO: Walk through code changes in PR 1620._ This was flagged in a prior review and should not ship in published documentation. Either replace it with a brief summary of key changes from PR 1620 or remove the line entirely.

-_TODO: Walk through code changes in PR 1620._
+_For details on the changes that enabled Turbo support, see [PR 1620](https://github.com/shakacode/react_on_rails/pull/1620)._

Or simply delete the line if a summary is not needed.


26-26: Fix GitHub branding capitalization.

Line 26 uses the incorrect branding "Github". The official name is "GitHub" (capital H). This was flagged in a prior review and should be corrected.

-- See [Turbolinks on Github](https://github.com/rails/turbolinks)
+- See [Turbolinks on GitHub](https://github.com/rails/turbolinks)
docs/building-features/react-router.md (1)

35-78: Redux + React Router v6 client-side setup is correct.

The BrowserRouter pattern with Routes/Route and element prop correctly reflects v6 syntax. The Redux Provider wrapping is the appropriate pattern. The file path reference (app/javascript/src/HelloWorldApp/ror_components/) aligns with auto-bundling, which was confirmed in the PR objectives as correct. The key points section (lines 72–77) accurately summarizes v5→v6 changes. The previous review concern about this path has been addressed.

docs/deployment/troubleshooting-when-using-shakapacker.md (1)

54-54: Convert bare URL to Markdown link format.

This bare URL triggers markdownlint MD034. Use a labeled link instead for both compliance and readability.

Apply this fix:

-Read more at https://github.com/shakacode/react_on_rails/issues/1558.
+Read more at [shakacode/react_on_rails#1558](https://github.com/shakacode/react_on_rails/issues/1558).

Note: This issue was flagged in the previous review and remains unresolved.

docs/getting-started/tutorial.md (1)

7-7: Fix MD036 violation: convert italicized heading to a blockquote.

Using italics as a heading violates markdownlint MD036. Convert to a blockquote or callout format to maintain the visual prominence while satisfying the linter.

Apply this diff:

-_Updated for Ruby 3.0+, Rails 7, React on Rails v16, and Shakapacker v7_
+> **Note:** Updated for Ruby 3.0+, Rails 7, React on Rails v16, and Shakapacker v7.
🧹 Nitpick comments (2)
docs/getting-started/project-structure.md (1)

15-20: Clarify file extension conventions for server-side rendering files.

The structure diagram shows inconsistent file extensions: HelloWorld.server.js (line 16) vs. AnotherComponent.server.jsx (line 20). This creates ambiguity about whether server-only files should use .js or .jsx.

Consider standardizing to .jsx for consistency with the rest of the component setup, or add a clarifying note explaining when to use each extension (e.g., if .js is intended for non-JSX server logic and .jsx for JSX). Also clarify the distinction between:

  • A single .jsx file with an optional .server.js companion (HelloWorld pattern)
  • Separate .client.jsx and .server.jsx files (AnotherComponent pattern)

Suggested improvement:

 app/javascript/
 ├── src/
 │   ├── HelloWorld/
 │   │   ├── HelloWorld.module.css
 │   │   └── ror_components/          # Auto-discovered by React on Rails
 │   │       ├── HelloWorld.jsx       # Client & server rendering
-│   │       └── HelloWorld.server.js # Optional: server-only code
+│   │       └── HelloWorld.server.jsx # Optional: server-only code
 │   └── AnotherComponent/
 │       └── ror_components/
 │           ├── AnotherComponent.client.jsx  # Client-only rendering
 │           └── AnotherComponent.server.jsx  # Server-only rendering

Alternatively, expand the comments to explain the pattern choice for each example.

docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md (1)

17-17: Use consistent hyphenation for compound modifiers.

"Server Side Rendering" should be hyphenated as "Server-Side Rendering" when used as a compound adjective.

Apply this fix:

-## Server Side Rendering with the Default shakacode/shakapacker bin/shakapacker-dev-server
+## Server-Side Rendering with the Default shakacode/shakapacker bin/shakapacker-dev-server
📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 52d4a18 and 98ca50a.

⛔ Files ignored due to path filters (1)
  • spec/dummy/yarn.lock is excluded by !**/yarn.lock, !**/*.lock
📒 Files selected for processing (56)
  • docs/README.md (3 hunks)
  • docs/advanced-topics/manual-installation-overview.md (0 hunks)
  • docs/advanced-topics/rails-engine-integration.md (2 hunks)
  • docs/api-reference/README.md (0 hunks)
  • docs/api-reference/configuration.md (1 hunks)
  • docs/api-reference/generator-details.md (1 hunks)
  • docs/api-reference/redux-store-api.md (1 hunks)
  • docs/api-reference/view-helpers-api.md (3 hunks)
  • docs/building-features/code-splitting.md (0 hunks)
  • docs/building-features/foreman-issues.md (0 hunks)
  • docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md (2 hunks)
  • docs/building-features/i18n.md (1 hunks)
  • docs/building-features/images.md (1 hunks)
  • docs/building-features/process-managers.md (1 hunks)
  • docs/building-features/react-and-redux.md (1 hunks)
  • docs/building-features/react-router.md (1 hunks)
  • docs/building-features/rspec-configuration.md (2 hunks)
  • docs/building-features/turbolinks.md (5 hunks)
  • docs/core-concepts/react-on-rails-overview.md (0 hunks)
  • docs/core-concepts/webpack-configuration.md (1 hunks)
  • docs/deployment/heroku-deployment.md (2 hunks)
  • docs/deployment/troubleshooting-build-errors.md (1 hunks)
  • docs/deployment/troubleshooting-when-using-shakapacker.md (2 hunks)
  • docs/deployment/troubleshooting-when-using-webpacker.md (1 hunks)
  • docs/getting-started.md (0 hunks)
  • docs/getting-started/installation-into-an-existing-rails-app.md (0 hunks)
  • docs/getting-started/project-structure.md (2 hunks)
  • docs/getting-started/quick-start.md (2 hunks)
  • docs/getting-started/tutorial.md (12 hunks)
  • docs/getting-started/using-react-on-rails.md (1 hunks)
  • docs/guides/advanced/README.md (0 hunks)
  • docs/home.md (0 hunks)
  • docs/introduction.md (1 hunks)
  • docs/misc/credits.md (1 hunks)
  • docs/misc/doctrine.md (1 hunks)
  • docs/misc/style.md (1 hunks)
  • docs/misc/updating-dependencies.md (1 hunks)
  • docs/outdated/converting-from-custom-webpack-config-to-rails-webpacker-config.md (0 hunks)
  • docs/outdated/deferred-rendering.md (0 hunks)
  • docs/outdated/rails-assets-relative-paths.md (0 hunks)
  • docs/outdated/rails-assets.md (0 hunks)
  • docs/outdated/rails3.md (0 hunks)
  • docs/outdated/tips-for-usage-with-sp6.md (0 hunks)
  • docs/outdated/upgrade-webpacker-v3-to-v4.md (0 hunks)
  • docs/outdated/webpack-v1-notes.md (0 hunks)
  • docs/outdated/webpack.md (0 hunks)
  • docs/planning/docs-improvement/04-ia-redesign-plan.md (1 hunks)
  • docs/planning/docs-improvement/ia-redesign-live.md (3 hunks)
  • docs/pro/react-on-rails-pro.md (1 hunks)
  • lib/react_on_rails/dev/process_manager.rb (1 hunks)
  • spec/dummy/client/app/components/RouterLayout.jsx (2 hunks)
  • spec/dummy/client/app/routes/routes.jsx (1 hunks)
  • spec/dummy/client/app/startup/RouterApp.client.jsx (1 hunks)
  • spec/dummy/client/app/startup/RouterApp.server.jsx (1 hunks)
  • spec/dummy/package.json (1 hunks)
  • spec/react_on_rails/dev/process_manager_spec.rb (1 hunks)
💤 Files with no reviewable changes (18)
  • docs/building-features/foreman-issues.md
  • docs/building-features/code-splitting.md
  • docs/outdated/rails-assets.md
  • docs/api-reference/README.md
  • docs/guides/advanced/README.md
  • docs/home.md
  • docs/advanced-topics/manual-installation-overview.md
  • docs/outdated/rails-assets-relative-paths.md
  • docs/getting-started.md
  • docs/outdated/deferred-rendering.md
  • docs/outdated/upgrade-webpacker-v3-to-v4.md
  • docs/outdated/rails3.md
  • docs/outdated/webpack.md
  • docs/outdated/converting-from-custom-webpack-config-to-rails-webpacker-config.md
  • docs/outdated/webpack-v1-notes.md
  • docs/getting-started/installation-into-an-existing-rails-app.md
  • docs/core-concepts/react-on-rails-overview.md
  • docs/outdated/tips-for-usage-with-sp6.md
✅ Files skipped from review due to trivial changes (3)
  • docs/pro/react-on-rails-pro.md
  • docs/building-features/react-and-redux.md
  • docs/deployment/troubleshooting-when-using-webpacker.md
🚧 Files skipped from review as they are similar to previous changes (12)
  • spec/react_on_rails/dev/process_manager_spec.rb
  • docs/misc/updating-dependencies.md
  • docs/building-features/images.md
  • docs/api-reference/configuration.md
  • docs/api-reference/redux-store-api.md
  • docs/api-reference/view-helpers-api.md
  • docs/building-features/process-managers.md
  • lib/react_on_rails/dev/process_manager.rb
  • docs/advanced-topics/rails-engine-integration.md
  • docs/misc/credits.md
  • docs/getting-started/using-react-on-rails.md
  • spec/dummy/client/app/startup/RouterApp.server.jsx
🧰 Additional context used
📓 Path-based instructions (2)
**/*.{js,jsx,ts,tsx,css,scss,json,yml,yaml,md}

📄 CodeRabbit inference engine (CLAUDE.md)

Prettier is the sole authority for formatting all non-Ruby files; never manually format them

Files:

  • spec/dummy/client/app/routes/routes.jsx
  • spec/dummy/client/app/components/RouterLayout.jsx
  • docs/api-reference/generator-details.md
  • docs/planning/docs-improvement/ia-redesign-live.md
  • docs/deployment/heroku-deployment.md
  • docs/README.md
  • docs/building-features/react-router.md
  • spec/dummy/package.json
  • docs/getting-started/quick-start.md
  • docs/introduction.md
  • docs/building-features/turbolinks.md
  • docs/planning/docs-improvement/04-ia-redesign-plan.md
  • docs/misc/doctrine.md
  • docs/building-features/i18n.md
  • docs/deployment/troubleshooting-build-errors.md
  • docs/getting-started/project-structure.md
  • spec/dummy/client/app/startup/RouterApp.client.jsx
  • docs/building-features/rspec-configuration.md
  • docs/getting-started/tutorial.md
  • docs/misc/style.md
  • docs/deployment/troubleshooting-when-using-shakapacker.md
  • docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md
  • docs/core-concepts/webpack-configuration.md
**/*.{js,jsx,ts,tsx}

📄 CodeRabbit inference engine (CLAUDE.md)

Use ESLint for JS/TS code (lint via rake lint or yarn lint)

Files:

  • spec/dummy/client/app/routes/routes.jsx
  • spec/dummy/client/app/components/RouterLayout.jsx
  • spec/dummy/client/app/startup/RouterApp.client.jsx
🧠 Learnings (3)
📚 Learning: 2025-04-26T21:55:55.874Z
Learnt from: alexeyr-ci2
PR: shakacode/react_on_rails#1732
File: spec/dummy/client/app-react16/startup/ReduxSharedStoreApp.client.jsx:40-44
Timestamp: 2025-04-26T21:55:55.874Z
Learning: In the react_on_rails project, files under `app-react16` directories are copied/moved to corresponding `/app` directories during the conversion process (removing the `-react16` suffix), which affects their relative import paths at runtime.

Applied to files:

  • docs/planning/docs-improvement/ia-redesign-live.md
  • docs/getting-started/project-structure.md
📚 Learning: 2025-02-13T16:50:26.861Z
Learnt from: AbanoubGhadban
PR: shakacode/react_on_rails#1644
File: node_package/src/turbolinksUtils.ts:34-36
Timestamp: 2025-02-13T16:50:26.861Z
Learning: In React on Rails, when checking for Turbolinks version 5 using `turbolinksVersion5()`, always ensure `Turbolinks` exists first by checking `turbolinksInstalled()` to prevent TypeError when accessing properties.

Applied to files:

  • docs/building-features/turbolinks.md
📚 Learning: 2025-09-16T08:01:11.146Z
Learnt from: justin808
PR: shakacode/react_on_rails#1770
File: lib/generators/react_on_rails/templates/base/base/app/javascript/src/HelloWorld/ror_components/HelloWorld.client.jsx:2-2
Timestamp: 2025-09-16T08:01:11.146Z
Learning: React on Rails uses webpack CSS Modules configuration with namedExports: true, which requires the import syntax `import * as style from './file.module.css'` rather than the default export pattern. This configuration enables better tree shaking and bundle size optimization for CSS modules.

Applied to files:

  • docs/getting-started/project-structure.md
  • docs/building-features/rspec-configuration.md
  • docs/deployment/troubleshooting-when-using-shakapacker.md
🧬 Code graph analysis (2)
spec/dummy/client/app/routes/routes.jsx (1)
spec/dummy/client/app/components/RouterLayout.jsx (1)
  • RouterLayout (6-29)
spec/dummy/client/app/startup/RouterApp.client.jsx (1)
spec/dummy/client/app/startup/RouterApp.server.jsx (1)
  • props (6-10)
🪛 LanguageTool
docs/deployment/heroku-deployment.md

[style] ~77-~77: You have already used this phrasing in nearby sentences. Consider replacing it to add variety to your writing.
Context: ... database: ror_production ``` Then you need to set up Postgres so you can run locally:...

(REP_NEED_TO_VB)


[style] ~153-~153: Reusing ‘you’ could be redundant. Try omitting the pronoun.
Context: ...``` and you will see your live app and you can share this URL with your friends. Congr...

(SUBJECT_DROP)

docs/building-features/turbolinks.md

[uncategorized] ~26-~26: The official name of this software platform is spelled with a capital “H”.
Context: ...c) - Auto-detected - See Turbolinks on Github ...

(GITHUB)

docs/planning/docs-improvement/04-ia-redesign-plan.md

[uncategorized] ~858-~858: Did you mean the formatting language “Markdown” (= proper noun)?
Context: ...ted (manually as encountered) - [ ] Run markdown link checker (TODO: before final merge)...

(MARKDOWN_NNP)

docs/getting-started/tutorial.md

[uncategorized] ~147-~147: If this is a compound adjective that modifies the following noun, use a hyphen.
Context: ...out a special React setup, will cause a full page refresh each time you save a file. If ...

(EN_COMPOUND_ADJECTIVE_INTERNAL)

docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md

[grammar] ~17-~17: Use a hyphen to join words.
Context: ...v-server` during development. ## Server Side Rendering with the Default shakacod...

(QB_NEW_EN_HYPHEN)

docs/core-concepts/webpack-configuration.md

[style] ~25-~25: Consider a more concise word here.
Context: ...), you will see this pattern in action. In order to customize the Webpack configuration, co...

(IN_ORDER_TO_PREMIUM)

🪛 markdownlint-cli2 (0.18.1)
docs/api-reference/generator-details.md

50-50: Fenced code blocks should have a language specified

(MD040, fenced-code-language)


70-70: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

docs/planning/docs-improvement/ia-redesign-live.md

402-402: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

docs/getting-started/tutorial.md

7-7: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (11)
  • GitHub Check: dummy-app-integration-tests (3.2, 20)
  • GitHub Check: dummy-app-integration-tests (3.4, 22)
  • GitHub Check: rspec-package-tests (3.2, latest)
  • GitHub Check: rspec-package-tests (3.2, minimum)
  • GitHub Check: rspec-package-tests (3.4, minimum)
  • GitHub Check: rspec-package-tests (3.4, latest)
  • GitHub Check: build-dummy-app-webpack-test-bundles
  • GitHub Check: markdown-link-check
  • GitHub Check: lint-js-and-ruby
  • GitHub Check: build
  • GitHub Check: build-dummy-app-webpack-test-bundles
🔇 Additional comments (36)
docs/misc/style.md (2)

36-36: Heading restructuring aligns with documentation IA redesign.

The change from primary (#) to secondary (##) heading places "Git Usage" at the same level as other major sections ("Client Side JavaScript and React", "Style Guides to Follow"), creating a consistent information hierarchy. This is consistent with the PR's broader heading-level adjustments.


38-40: Clarify the intent of the new CI/code coverage bullet.

Line 40 introduces "Run hosted CI and code coverage" alongside the git flow and rebase guidance, but it's noticeably brief and semantically distinct from the preceding bullets. Confirm this bullet is complete as written—should it be expanded with context on when or how to run CI (e.g., before pushing, as part of the merge checklist), or is the terseness intentional as a standalone checklist item?

docs/building-features/i18n.md (1)

95-99: LGTM — proper heading hierarchy and clear outdated label.

Correcting the "Notes" section from h1 to h2 establishes proper semantic hierarchy under the main h1 heading. The "Outdated:" label clearly signals to readers that the referenced tutorial may not reflect current best practices, which is a valuable documentation improvement as part of the IA redesign cleanup.

docs/api-reference/generator-details.md (6)

50-58: Add language hint to code block (MD040).

Markdownlint flags this code block as missing a language specification. Per the PR comments, this should have been fixed in commit 60e9cea, but the issue persists. Add a language hint after the opening fence (e.g., ```text or ```bash).


70-90: Add language hint to code block (MD040).

Markdownlint flags this code block as missing a language specification. Per the PR comments, this should have been fixed in commit 60e9cea, but the issue persists. Add a language hint after the opening fence (e.g., ```text or ```bash).


42-118: Content restructuring looks solid.

The reorganization of generator documentation into default vs. Redux modes is clearer and more useful. Directory structures are accurate and well-annotated. The new TypeScript section is concise, and the auto-bundling reference points to the right guide. One minor observation: if components use separate .server.jsx files, consider adding a note that this is optional and explain the trade-offs (e.g., when to use server vs. client components).


50-58: Add language hint to code block (MD040).

Markdownlint requires a language specification on fenced code blocks. This directory tree is missing one. Per the PR comments, commit 60e9cea should have fixed this, but the issue persists. Add a language tag after the opening fence (e.g., ```text or ```bash).


70-90: Add language hint to code block (MD040).

Markdownlint requires a language specification on fenced code blocks. This directory tree is missing one. Per the PR comments, commit 60e9cea should have fixed this, but the issue persists. Add a language tag after the opening fence (e.g., ```text or ```bash).


42-118: Content restructuring is clear and well-organized.

The reorganization into default vs. Redux modes significantly improves clarity. Directory structures are accurate, annotations are helpful, and the TypeScript section is concise. The reference to the Auto-Bundling Guide keeps documentation DRY. One optional enhancement: consider adding a brief note on line 64 about when to use .server.jsx vs. .client.jsx or link to a reference.

docs/building-features/react-router.md (4)

1-33: Clear setup guidance and v6-focused explanation.

The introduction, compatibility note, and installation section are well-structured. The distinction between Declarative Mode and Data Mode (lines 31–33) correctly explains why Data Mode doesn't fit React on Rails' server-side data loading pattern. One minor note: the statement on line 29 that "React Router v7 has merged with Remix" would benefit from verification against the latest React Router release notes to ensure the compatibility claim is current.

[web]
Has React Router v7 merged with Remix or adopted a fundamentally different architecture incompatible with SSR?
[/web]


79-127: Server-side StaticRouter setup correctly uses v6 patterns.

The StaticRouter import from 'react-router-dom/server' (line 88) and the Routes/Route+element pattern are correct for v6. The location prop assignment and renderToString usage align with React Router v6 SSR guidance. The "Important changes" section (lines 121–126) accurately contrasts v5 and v6 approaches. One clarification: verify that the return format on line 115 ({ renderedHtml: html }) matches React on Rails' server-side rendering expectations, as the exact return shape may depend on your Rails integration layer.


128-170: Rails routing guidance is clear and practical.

The wildcard route pattern (lines 134–143) and the Rails-to-React Router path alignment explanation (lines 161–169) correctly address the critical setup needed for SSR and direct URL visits. The concrete example showing /hello_world and nested routes is helpful and prevents a common integration mistake. This section provides solid operational guidance.


171-182: External resources and tutorial references are well-contextualized.

The links to the React Webpack Rails Tutorial and official React Router documentation are valuable. The note on line 177 that the tutorial uses legacy directory structure but patterns remain applicable is a helpful caveat. The v5 migration guide link supports users who are upgrading.

spec/dummy/client/app/components/RouterLayout.jsx (1)

2-2: LGTM! Clean React Router v6 migration.

The migration correctly updates to v6 conventions: SwitchRoutes, component prop → element prop with JSX, and relative paths for nested routes.

Also applies to: 24-27

spec/dummy/client/app/startup/RouterApp.client.jsx (1)

8-11: Good practice: enabling v7 future flags incrementally.

The implementation correctly enables two future flags (v7_startTransition and v7_relativeSplatPath) to prepare for React Router v7. Additional flags like v7_fetcherPersist, v7_normalizeFormMethod, v7_partialHydration, and v7_skipActionErrorRevalidation can be enabled and tested one at a time as needed. Based on learnings.

spec/dummy/client/app/routes/routes.jsx (1)

2-2: LGTM! Correct v6 pattern with wildcard for nested routes.

The migration properly wraps the Route in Routes, uses the element prop, and adds the /* wildcard to the path. The wildcard is essential here because RouterLayout contains its own nested <Routes> (in spec/dummy/client/app/components/RouterLayout.jsx lines 24-27), allowing those child routes to match relative paths.

Also applies to: 6-9

spec/dummy/package.json (1)

21-22: React 19 is compatible with react-router-dom v6 — no action needed.

React-router-dom v6 specifies a permissive peerDependency (react >=16.8) and React 19 satisfies this requirement. The test suite dependencies are properly aligned.

docs/getting-started/project-structure.md (3)

103-108: CSS Module import syntax is correct.

The import * as style from './HelloWorld.module.css' pattern aligns correctly with React on Rails' webpack CSS Modules configuration (namedExports: true). The example and benefits section provide clear guidance on modern styling practices.


1-153: Overall structure and guidance are comprehensive and well-organized.

The dual-structure approach (Modern Auto-Bundling recommended, Traditional Manual legacy) aligns well with the PR objectives to modernize documentation. The "Choosing Your Structure" section provides clear decision criteria, and the styling guidance covers modern (CSS Modules), traditional (Rails Asset Pipeline), and advanced (global styles) approaches effectively. The file successfully consolidates entry-point guidance and removes outdated boilerplate references.


35-35: No issues found—links are valid and resolve correctly.

Both referenced documentation files exist at the specified locations. The relative paths ../core-concepts/auto-bundling-file-system-based-automated-bundle-generation.md and ../api-reference/generator-details.md resolve correctly from docs/getting-started/project-structure.md.

docs/building-features/rspec-configuration.md (1)

5-5: LGTM!

Heading level adjustments are appropriate for the documentation restructuring.

Also applies to: 23-23

docs/deployment/troubleshooting-build-errors.md (1)

279-279: LGTM!

The link update to the correct webpack configuration guide is appropriate and aligns with the documentation consolidation.

docs/getting-started/quick-start.md (1)

127-127: LGTM!

Navigation updates appropriately direct users to the new consolidated documentation page. The text clarification improves readability without altering meaning.

Also applies to: 162-162

docs/misc/doctrine.md (1)

7-7: LGTM!

The updated link correctly references the new consolidated introduction.md, maintaining the doctrine's connection to the project overview.

docs/deployment/heroku-deployment.md (1)

3-3: LGTM!

The disclaimer note properly sets expectations about version currency and links to official Heroku Rails 7 guidance.

docs/introduction.md (1)

1-132: Internal links verified—no broken references found.

All 14 internal cross-references in introduction.md resolve successfully to their target documentation files. The file is ready as a consolidated entry point.

docs/getting-started/tutorial.md (2)

25-43: Navigation structure is clear and up-to-date.

The table of contents reflects the restructured content with new "Going Further" section and separate "Deployment" section. This aligns well with the PR's consolidation objectives and deployment content extraction.


157-172: Deployment guide links verified and correct.

Both target files exist at their expected locations:

  • docs/deployment/heroku-deployment.md
  • docs/deployment/deployment.md

The relative paths from docs/getting-started/tutorial.md resolve correctly.

docs/planning/docs-improvement/ia-redesign-live.md (3)

326-396: Phase 3 completion is well-documented with clear actions and rationale.

The Actions Completed subsection provides concrete details for each of the seven major changes (file deletions, creations, transformations). Rationale is provided for each decision, making the actual vs. planned changes transparent. This aligns with the PR objectives and serves as a valuable reference for future phases.


400-478: Reference: Final Folder Structure is comprehensive and accurate.

The file tree shows the complete post-Phase-3 structure with all moves, creations, and deletions accounted for. The inline comments clarifying file status (✅ Created, ✅ Simplified, etc.) improve clarity. This serves as an effective reference artifact for validation.


480-485: Final Decisions section appropriately documents permanent category choices.

The note that misc/ and advanced-topics/ are now permanent categories (not temporary) clarifies the outcome of the reorganization steps. The statement "All orphaned files found homes" is a good summary of completeness.

docs/core-concepts/webpack-configuration.md (1)

25-25: Link update to external Shakapacker docs is accurate and helpful.

The change from a local "Webpack Tips" reference to the upstream Shakapacker webpack customization docs improves documentation quality by directing users to the authoritative source. The anchor text is clear and descriptive.

docs/planning/docs-improvement/04-ia-redesign-plan.md (2)

799-843: Phase 3 completion is well-documented with transparent adaptations.

The status line clearly references the live tracker for details. The ADDITIONS subsection (lines 828–851) transparently documents unplanned improvements (tutorial enhancements, manual-installation-overview.md deletion, cross-reference updates). This shows adaptability and responsiveness to findings during implementation, which is good for a major reorganization.


853-860: Markdown link checker automation already exists and is active—no implementation needed.

The repository already has a fully configured GitHub Actions workflow (.github/workflows/check-markdown-links.yml) that automatically validates markdown links on every PR and push to master. The workflow uses tcort/[email protected] with a config file at .github/markdown-link-check-config.json, targeting the docs/ folder.

The "TODO: before final merge" at line 858 refers to manual verification that the CI check passed, not to implementing link-checker automation. The workflow will run automatically on this PR due to markdown file changes—no manual shell script execution is required.

Likely an incorrect or invalid review comment.

docs/README.md (2)

11-54: Navigation structure is logical and user-friendly with clear learning paths.

The simplified README now provides three clear entry points (Beginner, Experienced, Migrating) instead of the previous cluttered structure. The Popular Use Cases table adds actionable quick links, and the Documentation Categories section provides a comprehensive overview. This aligns with the PR's goal of consolidating entry points and improving navigation clarity.


3-64: All relative links in the simplified README.md resolve correctly—approved.

Verification confirms all 20 unique link paths in the README exist in the documentation structure. The simplified navigation correctly references the primary user-facing categories (Getting Started, Core Concepts, API Reference, Building Features, Deployment, Upgrading, Migrating, Pro), while additional filesystem directories (advanced-topics, contributor-info, assets, images, misc, testimonials) are appropriately omitted from the main navigation for clarity.

@ihabadham ihabadham force-pushed the feature/docs-ia-redesign-1845-continue branch from 98ca50a to 766739c Compare October 23, 2025 20:05
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

♻️ Duplicate comments (5)
docs/deployment/troubleshooting-when-using-shakapacker.md (1)

50-54: Replace bare URL with a labeled Markdown link (fixes MD034).

This was previously flagged—the bare URL on line 54 violates markdownlint's MD034 rule. Replace it with a labeled Markdown link for readability and lint compliance.

-Read more at https://github.com/shakacode/react_on_rails/issues/1558.
+Read more at [shakacode/react_on_rails#1558](https://github.com/shakacode/react_on_rails/issues/1558).
docs/building-features/turbolinks.md (2)

26-26: Fix GitHub brand capitalization.

Line 26 uses the incorrect capitalization "Github" instead of the official brand name "GitHub".

-- See [Turbolinks on Github](https://github.com/rails/turbolinks)
+- See [Turbolinks on GitHub](https://github.com/rails/turbolinks)

Note: This issue was flagged in past review but appears to still be present.


16-16: Remove TODO placeholder before publishing.

Line 16 contains a template placeholder: "TODO: Walk through code changes in PR 1620." This should be removed or replaced with actual content before the documentation is published. Unfinished placeholders degrade doc quality and suggest incomplete work.

Replace or remove the TODO:

-_TODO: Walk through code changes in PR 1620._
+See PR 1620 for implementation details and changes.

Or delete the line entirely if the PR link above is sufficient.

docs/deployment/heroku-deployment.md (1)

131-135: Update Node version to align with React on Rails v16 requirements.

The engines block specifies Node 16.19.0, which reached end-of-life on September 11, 2023. React on Rails v16 requires Node.js 20 or newer, and the project's own package.json already targets Node 20+ (via @types/node: ^20.17.16). The specified version contradicts both React on Rails v16 requirements and the project's own configuration.

Update to:

   "engines": {
-    "node": "16.19.0",
+    "node": "20.0.0",
     "yarn": "1.22.4"
   },

Additionally, upgrade Yarn to a newer 1.x release (e.g., 1.22.19) for Node 20 compatibility, as 1.22.4 (2020) predates Node 20 and may encounter compatibility issues.

docs/getting-started/tutorial.md (1)

7-7: MD036 violation remains unresolved: italicized heading should use callout format.

Line 7 still uses italics as a heading, which violates markdownlint MD036. This was flagged in a previous review and appears not to have been fixed. Apply this diff:

-_Updated for Ruby 3.0+, Rails 7, React on Rails v16, and Shakapacker v7_
+> **Note:** Updated for Ruby 3.0+, Rails 7, React on Rails v16, and Shakapacker v7.
🧹 Nitpick comments (2)
docs/core-concepts/webpack-configuration.md (1)

25-25: Simplify "In order to" for conciseness.

Replace "In order to customize" with "To customize" for a more direct and concise tone, which is especially valuable in technical documentation.

-Typical Shakapacker apps have a standard directory structure as documented [here](https://github.com/shakacode/shakapacker/blob/master/README.md#configuration-and-code). If you follow [the basic tutorial](../getting-started/tutorial.md), you will see this pattern in action. In order to customize the Webpack configuration, consult the [Shakapacker webpack customization docs](https://github.com/shakacode/shakapacker#webpack-configuration).
+Typical Shakapacker apps have a standard directory structure as documented [here](https://github.com/shakacode/shakapacker/blob/master/README.md#configuration-and-code). If you follow [the basic tutorial](../getting-started/tutorial.md), you will see this pattern in action. To customize the Webpack configuration, consult the [Shakapacker webpack customization docs](https://github.com/shakacode/shakapacker#webpack-configuration).
docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md (1)

17-17: Hyphenate compound adjectives per English style.

Line 17 should use "Server-Side Rendering" (hyphenated) instead of "Server Side Rendering" to follow standard English grammar for compound modifiers.

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 98ca50a and 766739c.

⛔ Files ignored due to path filters (1)
  • spec/dummy/yarn.lock is excluded by !**/yarn.lock, !**/*.lock
📒 Files selected for processing (56)
  • docs/README.md (3 hunks)
  • docs/advanced-topics/manual-installation-overview.md (0 hunks)
  • docs/advanced-topics/rails-engine-integration.md (2 hunks)
  • docs/api-reference/README.md (0 hunks)
  • docs/api-reference/configuration.md (1 hunks)
  • docs/api-reference/generator-details.md (1 hunks)
  • docs/api-reference/redux-store-api.md (1 hunks)
  • docs/api-reference/view-helpers-api.md (3 hunks)
  • docs/building-features/code-splitting.md (0 hunks)
  • docs/building-features/foreman-issues.md (0 hunks)
  • docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md (2 hunks)
  • docs/building-features/i18n.md (1 hunks)
  • docs/building-features/images.md (1 hunks)
  • docs/building-features/process-managers.md (1 hunks)
  • docs/building-features/react-and-redux.md (1 hunks)
  • docs/building-features/react-router.md (1 hunks)
  • docs/building-features/rspec-configuration.md (2 hunks)
  • docs/building-features/turbolinks.md (5 hunks)
  • docs/core-concepts/react-on-rails-overview.md (0 hunks)
  • docs/core-concepts/webpack-configuration.md (1 hunks)
  • docs/deployment/heroku-deployment.md (2 hunks)
  • docs/deployment/troubleshooting-build-errors.md (1 hunks)
  • docs/deployment/troubleshooting-when-using-shakapacker.md (2 hunks)
  • docs/deployment/troubleshooting-when-using-webpacker.md (1 hunks)
  • docs/getting-started.md (0 hunks)
  • docs/getting-started/installation-into-an-existing-rails-app.md (0 hunks)
  • docs/getting-started/project-structure.md (2 hunks)
  • docs/getting-started/quick-start.md (2 hunks)
  • docs/getting-started/tutorial.md (12 hunks)
  • docs/getting-started/using-react-on-rails.md (1 hunks)
  • docs/guides/advanced/README.md (0 hunks)
  • docs/home.md (0 hunks)
  • docs/introduction.md (1 hunks)
  • docs/misc/credits.md (1 hunks)
  • docs/misc/doctrine.md (1 hunks)
  • docs/misc/style.md (1 hunks)
  • docs/misc/updating-dependencies.md (1 hunks)
  • docs/outdated/converting-from-custom-webpack-config-to-rails-webpacker-config.md (0 hunks)
  • docs/outdated/deferred-rendering.md (0 hunks)
  • docs/outdated/rails-assets-relative-paths.md (0 hunks)
  • docs/outdated/rails-assets.md (0 hunks)
  • docs/outdated/rails3.md (0 hunks)
  • docs/outdated/tips-for-usage-with-sp6.md (0 hunks)
  • docs/outdated/upgrade-webpacker-v3-to-v4.md (0 hunks)
  • docs/outdated/webpack-v1-notes.md (0 hunks)
  • docs/outdated/webpack.md (0 hunks)
  • docs/planning/docs-improvement/04-ia-redesign-plan.md (1 hunks)
  • docs/planning/docs-improvement/ia-redesign-live.md (3 hunks)
  • docs/pro/react-on-rails-pro.md (1 hunks)
  • lib/react_on_rails/dev/process_manager.rb (1 hunks)
  • spec/dummy/client/app/components/RouterLayout.jsx (2 hunks)
  • spec/dummy/client/app/routes/routes.jsx (1 hunks)
  • spec/dummy/client/app/startup/RouterApp.client.jsx (1 hunks)
  • spec/dummy/client/app/startup/RouterApp.server.jsx (1 hunks)
  • spec/dummy/package.json (1 hunks)
  • spec/react_on_rails/dev/process_manager_spec.rb (1 hunks)
💤 Files with no reviewable changes (18)
  • docs/outdated/deferred-rendering.md
  • docs/core-concepts/react-on-rails-overview.md
  • docs/getting-started/installation-into-an-existing-rails-app.md
  • docs/outdated/rails-assets-relative-paths.md
  • docs/outdated/tips-for-usage-with-sp6.md
  • docs/getting-started.md
  • docs/outdated/rails-assets.md
  • docs/advanced-topics/manual-installation-overview.md
  • docs/home.md
  • docs/outdated/webpack-v1-notes.md
  • docs/guides/advanced/README.md
  • docs/building-features/foreman-issues.md
  • docs/outdated/webpack.md
  • docs/building-features/code-splitting.md
  • docs/outdated/rails3.md
  • docs/outdated/upgrade-webpacker-v3-to-v4.md
  • docs/outdated/converting-from-custom-webpack-config-to-rails-webpacker-config.md
  • docs/api-reference/README.md
✅ Files skipped from review due to trivial changes (2)
  • docs/deployment/troubleshooting-when-using-webpacker.md
  • docs/api-reference/redux-store-api.md
🚧 Files skipped from review as they are similar to previous changes (14)
  • docs/misc/updating-dependencies.md
  • docs/misc/credits.md
  • spec/dummy/client/app/startup/RouterApp.client.jsx
  • docs/api-reference/view-helpers-api.md
  • docs/introduction.md
  • docs/building-features/process-managers.md
  • spec/dummy/client/app/routes/routes.jsx
  • docs/advanced-topics/rails-engine-integration.md
  • docs/misc/doctrine.md
  • docs/building-features/react-and-redux.md
  • docs/README.md
  • docs/building-features/images.md
  • docs/deployment/troubleshooting-build-errors.md
  • docs/api-reference/configuration.md
🧰 Additional context used
📓 Path-based instructions (3)
**/*.{js,jsx,ts,tsx,css,scss,json,yml,yaml,md}

📄 CodeRabbit inference engine (CLAUDE.md)

Prettier is the sole authority for formatting all non-Ruby files; never manually format them

Files:

  • docs/pro/react-on-rails-pro.md
  • docs/building-features/rspec-configuration.md
  • docs/getting-started/project-structure.md
  • docs/getting-started/tutorial.md
  • docs/planning/docs-improvement/04-ia-redesign-plan.md
  • docs/building-features/react-router.md
  • docs/deployment/heroku-deployment.md
  • docs/getting-started/using-react-on-rails.md
  • docs/api-reference/generator-details.md
  • docs/planning/docs-improvement/ia-redesign-live.md
  • docs/getting-started/quick-start.md
  • spec/dummy/package.json
  • docs/core-concepts/webpack-configuration.md
  • spec/dummy/client/app/startup/RouterApp.server.jsx
  • docs/misc/style.md
  • docs/building-features/i18n.md
  • docs/deployment/troubleshooting-when-using-shakapacker.md
  • spec/dummy/client/app/components/RouterLayout.jsx
  • docs/building-features/turbolinks.md
  • docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md
{Gemfile,Rakefile,config.ru,**/*.{rb,rake,gemspec,ru}}

📄 CodeRabbit inference engine (CLAUDE.md)

{Gemfile,Rakefile,config.ru,**/*.{rb,rake,gemspec,ru}}: All Ruby code must pass RuboCop with zero offenses before commit/push
RuboCop is the sole authority for Ruby file formatting; never manually format Ruby files

Files:

  • lib/react_on_rails/dev/process_manager.rb
  • spec/react_on_rails/dev/process_manager_spec.rb
**/*.{js,jsx,ts,tsx}

📄 CodeRabbit inference engine (CLAUDE.md)

Use ESLint for JS/TS code (lint via rake lint or yarn lint)

Files:

  • spec/dummy/client/app/startup/RouterApp.server.jsx
  • spec/dummy/client/app/components/RouterLayout.jsx
🧠 Learnings (5)
📚 Learning: 2025-10-23T17:22:01.064Z
Learnt from: AbanoubGhadban
PR: shakacode/react_on_rails#1875
File: lib/react_on_rails/utils.rb:112-124
Timestamp: 2025-10-23T17:22:01.064Z
Learning: In React on Rails, when Pro is installed but not licensed, the intended behavior is to raise an error on boot. The `react_on_rails_pro?` method validates licenses and should raise errors early (including during path resolution in methods like `server_bundle?`) to enforce licensing requirements rather than failing later with obscure errors.

Applied to files:

  • docs/pro/react-on-rails-pro.md
📚 Learning: 2025-09-15T21:24:48.207Z
Learnt from: AbanoubGhadban
PR: shakacode/react_on_rails#1781
File: node_package/src/ClientSideRenderer.ts:82-95
Timestamp: 2025-09-15T21:24:48.207Z
Learning: In React on Rails, the force_load feature includes both explicit `data-force-load="true"` usage and the ability to hydrate components during the page loading state (`document.readyState === 'loading'`). Both capabilities require a Pro license, so the condition `!railsContext.rorPro && (isComponentForceLoaded || document.readyState === 'loading')` correctly gates both scenarios.

Applied to files:

  • docs/pro/react-on-rails-pro.md
📚 Learning: 2025-09-16T08:01:11.146Z
Learnt from: justin808
PR: shakacode/react_on_rails#1770
File: lib/generators/react_on_rails/templates/base/base/app/javascript/src/HelloWorld/ror_components/HelloWorld.client.jsx:2-2
Timestamp: 2025-09-16T08:01:11.146Z
Learning: React on Rails uses webpack CSS Modules configuration with namedExports: true, which requires the import syntax `import * as style from './file.module.css'` rather than the default export pattern. This configuration enables better tree shaking and bundle size optimization for CSS modules.

Applied to files:

  • docs/building-features/rspec-configuration.md
  • docs/getting-started/project-structure.md
  • docs/deployment/troubleshooting-when-using-shakapacker.md
📚 Learning: 2025-04-26T21:55:55.874Z
Learnt from: alexeyr-ci2
PR: shakacode/react_on_rails#1732
File: spec/dummy/client/app-react16/startup/ReduxSharedStoreApp.client.jsx:40-44
Timestamp: 2025-04-26T21:55:55.874Z
Learning: In the react_on_rails project, files under `app-react16` directories are copied/moved to corresponding `/app` directories during the conversion process (removing the `-react16` suffix), which affects their relative import paths at runtime.

Applied to files:

  • docs/getting-started/project-structure.md
  • docs/planning/docs-improvement/ia-redesign-live.md
📚 Learning: 2025-02-13T16:50:26.861Z
Learnt from: AbanoubGhadban
PR: shakacode/react_on_rails#1644
File: node_package/src/turbolinksUtils.ts:34-36
Timestamp: 2025-02-13T16:50:26.861Z
Learning: In React on Rails, when checking for Turbolinks version 5 using `turbolinksVersion5()`, always ensure `Turbolinks` exists first by checking `turbolinksInstalled()` to prevent TypeError when accessing properties.

Applied to files:

  • docs/building-features/turbolinks.md
🪛 LanguageTool
docs/getting-started/tutorial.md

[uncategorized] ~147-~147: If this is a compound adjective that modifies the following noun, use a hyphen.
Context: ...out a special React setup, will cause a full page refresh each time you save a file. If ...

(EN_COMPOUND_ADJECTIVE_INTERNAL)

docs/planning/docs-improvement/04-ia-redesign-plan.md

[uncategorized] ~858-~858: Did you mean the formatting language “Markdown” (= proper noun)?
Context: ...ted (manually as encountered) - [ ] Run markdown link checker (TODO: before final merge)...

(MARKDOWN_NNP)

docs/deployment/heroku-deployment.md

[style] ~77-~77: You have already used this phrasing in nearby sentences. Consider replacing it to add variety to your writing.
Context: ... database: ror_production ``` Then you need to set up Postgres so you can run locally:...

(REP_NEED_TO_VB)


[style] ~153-~153: Reusing ‘you’ could be redundant. Try omitting the pronoun.
Context: ...``` and you will see your live app and you can share this URL with your friends. Congr...

(SUBJECT_DROP)

docs/core-concepts/webpack-configuration.md

[style] ~25-~25: Consider a more concise word here.
Context: ...), you will see this pattern in action. In order to customize the Webpack configuration, co...

(IN_ORDER_TO_PREMIUM)

docs/building-features/turbolinks.md

[uncategorized] ~26-~26: The official name of this software platform is spelled with a capital “H”.
Context: ...c) - Auto-detected - See Turbolinks on Github ...

(GITHUB)

docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md

[grammar] ~17-~17: Use a hyphen to join words.
Context: ...v-server` during development. ## Server Side Rendering with the Default shakacod...

(QB_NEW_EN_HYPHEN)

🪛 markdownlint-cli2 (0.18.1)
docs/api-reference/generator-details.md

43-43: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

docs/deployment/troubleshooting-when-using-shakapacker.md

54-54: Bare URL used

(MD034, no-bare-urls)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (12)
  • GitHub Check: dummy-app-integration-tests (3.2, 20)
  • GitHub Check: dummy-app-integration-tests (3.4, 22)
  • GitHub Check: markdown-link-check
  • GitHub Check: claude-review
  • GitHub Check: rspec-package-tests (3.2, latest)
  • GitHub Check: rspec-package-tests (3.4, latest)
  • GitHub Check: rspec-package-tests (3.4, minimum)
  • GitHub Check: rspec-package-tests (3.2, minimum)
  • GitHub Check: build-dummy-app-webpack-test-bundles
  • GitHub Check: build
  • GitHub Check: lint-js-and-ruby
  • GitHub Check: build-dummy-app-webpack-test-bundles
🔇 Additional comments (32)
docs/core-concepts/webpack-configuration.md (1)

25-25: Link update aligns with documentation reorganization.

The reference to Shakapacker webpack customization docs is accurate and well-placed within the Option 1 context.

spec/react_on_rails/dev/process_manager_spec.rb (1)

237-237: LGTM! Test assertion properly updated.

The regex pattern correctly validates the new external URL reference in the help message, replacing the old internal documentation reference. The pattern matches the URL text exactly.

lib/react_on_rails/dev/process_manager.rb (1)

150-150: LGTM! External documentation reference is appropriate.

The URL change from internal documentation to the official foreman wiki is a good improvement. This aligns with the PR's documentation consolidation objectives and points users directly to the authoritative source for why foreman shouldn't be bundled.

spec/dummy/package.json (1)

26-26: React Router v6 migration is properly pinned.

The dependency update aligns with the spec/dummy app's React Router v6 migration across related components (RouterLayout.jsx, routes.jsx, RouterApp.client/server.jsx). The ^6.0.0 constraint is appropriate.

docs/misc/style.md (1)

36-40: Heading restructuring and CI/coverage guidance are well-integrated.

The heading level adjustment and new CI/code coverage bullet fit naturally into the Git Usage section and support the documentation's emphasis on development workflow best practices.

docs/building-features/rspec-configuration.md (1)

5-5: Heading hierarchy normalization is appropriate.

The heading level adjustments improve document structure and are consistent with the documentation reorganization across this PR.

Also applies to: 23-23

docs/building-features/i18n.md (1)

95-99: Heading adjustment and outdated reference labeling are well-executed.

The new "Outdated:" note properly flags the deprecated reference with clear context, allowing users to understand why it's included while discouraging reliance on it. This is better than silent removal.

docs/deployment/heroku-deployment.md (1)

3-3: Disclaimer note provides helpful transparency.

The note about version currency and link to Heroku's Rails 7 guide is excellent for setting expectations about the guide's age and directing users to official Heroku resources.

docs/planning/docs-improvement/04-ia-redesign-plan.md (1)

799-860: Phase 3 status documentation is clear and comprehensive.

The updated planning document accurately reflects actual implementation vs. planned approach, including helpful notes about adaptations (e.g., transform vs. split, manual vs. automated updates). The transparency about decisions made during execution is valuable for future reference and demonstrates thorough planning execution.

docs/building-features/turbolinks.md (1)

9-18: Content restructuring and new sections are comprehensive.

The reorganization to emphasize Turbo as the recommended path with a deprecation notice for Turbolinks, combined with new detailed sections on Technical Details and Debugging, significantly improves the guide's usefulness and currency.

Also applies to: 45-102

docs/planning/docs-improvement/ia-redesign-live.md (1)

324-397: LGTM! Phase 3 documentation is clear and well-organized.

The Phase 3 Entry Point Consolidation section provides excellent tracking of all completed actions with clear rationale for each change. The documentation accurately reflects the consolidation work described in the PR objectives.

docs/pro/react-on-rails-pro.md (1)

1-1: LGTM! Correct heading level for page title.

Changing the main heading from level-2 to level-1 is the correct markdown structure for a standalone documentation page.

spec/dummy/client/app/startup/RouterApp.server.jsx (1)

2-2: LGTM! Correct React Router v6 import path.

The change to import StaticRouter from react-router-dom/server is required for React Router v6 compatibility, where server-specific exports were moved to a separate entry point.

docs/getting-started/quick-start.md (2)

127-127: LGTM! Improved clarity.

Adding "section" clarifies that the code should be placed within the HTML <head> section.


162-162: LGTM! Updated navigation aligns with documentation restructuring.

The link now points to the new using-react-on-rails.md page created in Phase 3, with an updated descriptor that better reflects the content.

docs/getting-started/using-react-on-rails.md (1)

1-246: LGTM! Excellent comprehensive guide.

This new documentation page provides a thorough, well-organized introduction to React on Rails core concepts. The structure flows logically from installation through advanced topics, with clear examples and helpful cross-references to other documentation pages.

Key strengths:

  • Clear distinction between auto-bundling and manual registration approaches
  • Practical code examples throughout
  • Helpful "when to use" guidance for render-functions
  • Well-organized navigation to related topics
spec/dummy/client/app/components/RouterLayout.jsx (1)

2-2: LGTM! Correct React Router v6 migration.

The changes properly migrate this component to React Router v6:

  • Switch replaced with Routes
  • Route now uses the element prop with JSX elements
  • Paths converted to relative paths for proper nested routing

These changes align with React Router v6 API requirements and work correctly with the parent route configuration.

Also applies to: 24-27

docs/api-reference/generator-details.md (1)

42-118: LGTM! Excellent documentation restructuring.

The new dual-structure approach (Default vs Redux) is much clearer than the previous organization. The side-by-side comparison with concrete directory trees helps users understand the differences and choose the right approach for their needs.

Key improvements:

  • Clear separation of default and Redux structures
  • Concrete directory trees for each approach
  • Auto-bundling explanation integrated naturally
  • TypeScript support documented
docs/getting-started/project-structure.md (2)

1-70: LGTM! Excellent restructuring with clear guidance.

The reorganization into Modern Auto-Bundling vs Traditional Manual Structure provides much clearer guidance for users. The "Choosing Your Structure" section offers practical decision criteria that will help users make informed choices.

Key improvements:

  • Clear labeling of recommended vs legacy approaches
  • Concrete directory trees for both structures
  • Practical decision criteria based on project needs
  • Well-organized presentation

86-153: LGTM! Comprehensive styling guidance added.

The new styling section provides excellent guidance on modern approaches (CSS Modules) while maintaining backward compatibility information for Rails Asset Pipeline users. The CSS Modules import syntax correctly uses import * as style per webpack configuration requirements.

docs/getting-started/tutorial.md (5)

25-43: Well-structured TOC reorganization.

The Table of Contents has been thoughtfully reorganized to reflect the new documentation structure (consolidating deployment guidance, introducing "Going Further" and "Optional Configuration" sections). This improves navigation and reduces redundancy.


52-52: Clear and helpful Rails version clarification.

The note that this tutorial targets Rails 7.0+ while acknowledging React on Rails support for Rails 6 is helpful for users on earlier versions. This balances tutorial simplicity with transparency about compatibility.


113-119: Good modernization of Redux guidance.

Framing Redux as an optional feature (via the --redux flag) with Hooks as the default is a clearer, more contemporary approach. The guidance appropriately guides users to choose their state management path early.


157-173: Deployment section consolidation is effective.

Rather than embedding Heroku deployment inline, the section now links to dedicated deployment guides, reducing duplication and improving maintainability. The summary of what deployment guides cover sets clear expectations.


220-248: Optional Configuration section is well-organized and actionable.

Clear, step-by-step guidance for /client structure migration, custom IP/PORT setup, and RubyMine performance tuning. Subsection headings make it easy for readers to find what they need.

docs/building-features/react-router.md (7)

3-17: Compatibility section strikes the right balance.

The Compatibility Note clearly outlines the challenge with Turbo/Turbolinks coexisting with React Router (without forbidding it) and provides practical mitigation strategies. This helps readers understand the tradeoff and make informed decisions. Linking to the Turbolinks guide is helpful.


19-33: Installation and approach guidance is clear and well-reasoned.

The rationale for React Router v6 (v7 merged with Remix) is helpful context, and the explanation of why Declarative Mode is preferred over Data Mode for React on Rails' server-side data loading pattern is insightful and prevents a common integration mistake.


39-70: Client-side Redux setup example is correct and idiomatic.

The code correctly uses React Router v6 patterns (Routes/Route with element prop, not component/render), properly wraps BrowserRouter with Provider for Redux access, and includes helpful comments for extending the routing. The path app/javascript/src/HelloWorldApp/ror_components/ aligns with modern auto-bundling structure.


79-119: Server-side rendering example is correct and mirrors client setup well.

The use of StaticRouter from 'react-router-dom/server' is correct for React Router v6, and the example properly passes location from railsContext. The parallel structure with the client example makes the difference clear. The return format { renderedHtml: html } is consistent with React on Rails SSR expectations.


128-160: Rails routes configuration is practical and comprehensive.

The wildcard catch-all pattern ensures that all React Router sub-routes are served by the same Rails view, enabling browser refresh and direct URL visits with SSR. The examples are clear, and the explanation of what each route does aids understanding. The note about matching React Router paths to Rails structure is an important detail.


171-177: Example links and context are appropriately positioned.

References to the React Webpack Rails Tutorial are helpful, and the note about legacy directory structure (client/app/bundles) vs. modern structure (app/javascript/src/) contextualizes the examples without losing the routing patterns' applicability.


179-183: Resource links are current and relevant.

Links to React Router official docs, v5-to-v6 migration guide, and the Turbo/Turbolinks guide provide good jumping-off points for readers seeking deeper information.

ihabadham added a commit that referenced this pull request Oct 23, 2025
Fixes Node version inconsistencies identified by CodeRabbit in PR #1860.

Changes:
- docs/introduction.md: 18+ → 20+
- docs/getting-started/quick-start.md: 18+ → 20+
- docs/deployment/heroku-deployment.md: 16.19.0 → 20.0.0

Rationale:
- React on Rails v16 requires Node 20+ for ESM module support
- Node 16 reached EOL in September 2023
- Node 18 reaches EOL in April 2025
- CI currently tests only Node 20 and 22
- Release notes specify Node 20.19.0+ or 22.12.0+ required

The tutorial.md (line 7) says "Updated for React on Rails v16" and
users following it would use Node 20+, so deployment guide should
match to avoid confusion.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <[email protected]>
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 0

🧹 Nitpick comments (3)
docs/deployment/heroku-deployment.md (3)

77-82: Consider reducing repetitive phrasing.

The phrase "you need to" appears in both lines 77 and earlier context. For variety, consider rephrasing one occurrence—e.g., "Set up Postgres for local development" or simply "To set up Postgres locally:".


150-153: Slightly redundant pronoun usage.

The sentence "and you will see your live app and you can share this URL" repeats "you" in close succession. Consider: "Visit the link to view your live app, then share the URL with your friends."


126-136: Optional enhancement: add context for version pinning.

The engines block now correctly specifies Node 20.0.0. While the versions match the working tutorial app, adding a brief comment explaining why these versions are pinned (e.g., "Heroku uses these settings to control build-time and runtime environments; pin them to avoid version drift between dev and deploy") could help future maintainers understand the rationale. This was discussed in past reviews but is not a blocker if intentionally deferred.

This is a nice-to-have improvement based on earlier review feedback (see past comment threads on version rationale), but the PR objectives indicate this was acknowledged and deferred. Only apply if you'd like to add this context now.

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between da6e8c6 and 96ec27d.

📒 Files selected for processing (3)
  • docs/deployment/heroku-deployment.md (2 hunks)
  • docs/getting-started/quick-start.md (3 hunks)
  • docs/introduction.md (1 hunks)
🚧 Files skipped from review as they are similar to previous changes (2)
  • docs/getting-started/quick-start.md
  • docs/introduction.md
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{js,jsx,ts,tsx,css,scss,json,yml,yaml,md}

📄 CodeRabbit inference engine (CLAUDE.md)

Prettier is the sole authority for formatting all non-Ruby files; never manually format them

Files:

  • docs/deployment/heroku-deployment.md
🪛 LanguageTool
docs/deployment/heroku-deployment.md

[style] ~77-~77: You have already used this phrasing in nearby sentences. Consider replacing it to add variety to your writing.
Context: ... database: ror_production ``` Then you need to set up Postgres so you can run locally:...

(REP_NEED_TO_VB)


[style] ~153-~153: Reusing ‘you’ could be redundant. Try omitting the pronoun.
Context: ...``` and you will see your live app and you can share this URL with your friends. Congr...

(SUBJECT_DROP)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (11)
  • GitHub Check: dummy-app-integration-tests (3.2, 20)
  • GitHub Check: build-dummy-app-webpack-test-bundles
  • GitHub Check: build-dummy-app-webpack-test-bundles
  • GitHub Check: build
  • GitHub Check: lint-js-and-ruby
  • GitHub Check: claude-review
  • GitHub Check: rspec-package-tests (3.4, latest)
  • GitHub Check: rspec-package-tests (3.4, minimum)
  • GitHub Check: rspec-package-tests (3.2, minimum)
  • GitHub Check: rspec-package-tests (3.2, latest)
  • GitHub Check: markdown-link-check
🔇 Additional comments (1)
docs/deployment/heroku-deployment.md (1)

1-154: Comprehensive Heroku deployment guide with corrected Node version.

The expanded guidance is well-structured and covers the essential deployment workflow clearly. The Node.js version has been correctly updated to 20.0.0 (fixing the previous EOL issue), and the Procfile language hint is now in place.

ihabadham and others added 9 commits October 28, 2025 00:04
Updated two broken links in react-router.md that were pointing to the old
location ../rails/turbolinks.md which no longer exists.

The turbolinks.md file was moved from docs/rails/ to docs/building-features/
during the PR #1845 documentation reorganization, but these links were not
updated at that time.

Changes:
- ../rails/turbolinks.md → ./turbolinks.md (same directory)

This fixes the markdown-link-check CI failure:
ERROR: 1 dead link found in docs/building-features/react-router.md !
[✖] ../rails/turbolinks.md → Status: 400

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <[email protected]>
Added future flags to BrowserRouter in the dummy app to enable v7-compatible
behavior and eliminate console warnings that were causing test failures.

Changes:
- spec/dummy/client/app/startup/RouterApp.client.jsx: Added future prop with
  v7_startTransition and v7_relativeSplatPath flags

Why this fixes the issue:
The dummy app integration tests were failing because selenium_logger.rb treats
JavaScript console warnings as errors. React Router v6 emits warnings about
upcoming v7 changes:

  ⚠️ React Router Future Flag Warning: React Router will begin wrapping state
  updates in React.startTransition in v7. You can use the v7_startTransition
  future flag to opt-in early.

  ⚠️ React Router Future Flag Warning: Relative route resolution within Splat
  routes is changing in v7. You can use the v7_relativeSplatPath future flag
  to opt-in early.

By enabling these flags, we:
1. Silence the warnings
2. Adopt v7-compatible behavior early
3. Demonstrate best practices for React Router v6 users
4. Align with React Router's official migration guide

Reference: https://reactrouter.com/upgrading/future

Fixes test failures:
- React Router when rendering /react_router is expected to have text "Woohoo..."
- React Router when rendering /react_router clicking links correctly renders...

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <[email protected]>
Addresses valid issues from Claude's PR review:

1. Fixed JavaScript syntax error in using-react-on-rails.md:192
   - Changed semicolon to comma in object destructuring example
   - Was accidentally introduced during linting commit

2. Clarified Rails version requirements in tutorial.md
   - Changed "We support Rails 6 and later" to "This tutorial targets Rails 7.0+"
   - Explicitly noted Rails 6 is supported but tutorial uses Rails 7
   - Removed version confusion between prerequisites and tutorial steps

3. Fixed markdownlint issues
   - Added language hint to code fence in using-react-on-rails.md (text)
   - Added language hint to Procfile code fence in heroku-deployment.md (procfile)

These changes ensure code examples are syntactically correct and version
requirements are clear for users following the tutorial.
This category index file was an orphaned remnant from PR #1813 that used
a different navigation approach with category landing pages.

During the IA redesign (PR #1845), similar category index files like
guides/advanced/README.md were deleted as "redundant" because docs/README.md
now serves as the single navigation hub.

The api-reference/README.md survived by accident and is now the only category
with such an index file, creating inconsistency.

Changes:
- Deleted docs/api-reference/README.md (7-line TOC)
- Updated docs/README.md reference to point directly to view-helpers-api.md
  (the main API reference file)
- Preserves existing folder-level link on line 50 that points to api-reference/

Rationale: Category folders don't need README indexes when the main docs hub
already provides navigation. This matches the pattern established when we
deleted guides/advanced/README.md.
Fixes Node version inconsistencies identified by CodeRabbit in PR #1860.

Changes:
- docs/introduction.md: 18+ → 20+
- docs/getting-started/quick-start.md: 18+ → 20+
- docs/deployment/heroku-deployment.md: 16.19.0 → 20.0.0

Rationale:
- React on Rails v16 requires Node 20+ for ESM module support
- Node 16 reached EOL in September 2023
- Node 18 reaches EOL in April 2025
- CI currently tests only Node 20 and 22
- Release notes specify Node 20.19.0+ or 22.12.0+ required

The tutorial.md (line 7) says "Updated for React on Rails v16" and
users following it would use Node 20+, so deployment guide should
match to avoid confusion.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <[email protected]>
The link was returning 404. Updated from the incorrect path:
- /en/main/upgrading/v5 (broken)
to the working path:
- /docs/en/v6/upgrading/v5 (verified working)

This link was added in commit 391281a when updating React Router
documentation to v6. The URL structure changed on reactrouter.com.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <[email protected]>
@ihabadham ihabadham force-pushed the feature/docs-ia-redesign-1845-continue branch from 102fba3 to f0d6fe6 Compare October 27, 2025 21:05
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

♻️ Duplicate comments (4)
docs/building-features/turbolinks.md (2)

16-16: Remove or replace the TODO placeholder before publishing.

This placeholder remains unfinished. Either replace it with actionable guidance summarizing the key changes from PR 1620 (affected files, what to verify), or delete the line so published docs contain no TODO notes.

-_TODO: Walk through code changes in PR 1620._
+_React on Rails 15+ auto-detects Turbo availability and fires lifecycle events without manual initialization. For upgrade details, see [PR 1620](https://github.com/shakacode/react_on_rails/pull/1620)._

26-26: Capitalize "GitHub" in the link text for correct branding.

The link text uses "Github" (lowercase) instead of the official "GitHub" brand name.

-- See [Turbolinks on Github](https://github.com/rails/turbolinks)
+- See [Turbolinks on GitHub](https://github.com/rails/turbolinks)
docs/building-features/react-router.md (1)

37-70: Verify path consistency with generator output.

The example references app/javascript/src/HelloWorldApp/ror_components/ (line 39), but the PR context mentions this was previously flagged. While you noted this is correct for auto-bundling, it may confuse users since:

  • Line 177 states the tutorial uses "legacy directory structure (client/app/bundles)"
  • Line 177 also claims "Modern projects use app/javascript/src/ structure"

Please ensure the path guidance is consistent with what the generator actually creates and clarify when to use each structure (auto-bundling vs. traditional bundling).

docs/planning/docs-improvement/04-ia-redesign-plan.md (1)

853-861: Link checker automation still pending.

The checklist correctly documents that the markdown link checker task remains TODO before final merge. This was previously flagged and is being tracked appropriately.

🧹 Nitpick comments (3)
docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md (1)

17-17: Hyphenate "Server-Side Rendering" for consistency with standard English style.

Line 17 should read "Server-Side Rendering" rather than "Server Side Rendering" to follow proper compound adjective conventions.

-## Server Side Rendering with the Default shakacode/shakapacker bin/shakapacker-dev-server
+## Server-Side Rendering with the Default shakacode/shakapacker bin/shakapacker-dev-server
docs/core-concepts/webpack-configuration.md (1)

25-25: Minor text conciseness improvement suggested.

Consider shortening "In order to customize" to "To customize" for improved conciseness, as flagged by static analysis.

-Typical Shakapacker apps have a standard directory structure as documented [here](https://github.com/shakacode/shakapacker/blob/master/README.md#configuration-and-code). If you follow [the basic tutorial](../getting-started/tutorial.md), you will see this pattern in action. In order to customize the Webpack configuration, consult the [Shakapacker webpack customization docs](https://github.com/shakacode/shakapacker#webpack-configuration).
+Typical Shakapacker apps have a standard directory structure as documented [here](https://github.com/shakacode/shakapacker/blob/master/README.md#configuration-and-code). If you follow [the basic tutorial](../getting-started/tutorial.md), you will see this pattern in action. To customize the Webpack configuration, consult the [Shakapacker webpack customization docs](https://github.com/shakacode/shakapacker#webpack-configuration).

The link reference update to "Shakapacker webpack customization docs" is appropriate and aligns with the PR's documentation consolidation objectives.

docs/deployment/heroku-deployment.md (1)

126-135: Consider adding "Why specify engines?" explanation.

The past review discussion suggested adding a brief rationale explaining that Heroku's buildpack reads the engines field to select Node/Yarn versions at build time, and that pinning ensures reproducible builds. This would help users understand the purpose of this configuration.

Would you like me to draft the explanatory text to add after line 135?

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 102fba3 and f0d6fe6.

⛔ Files ignored due to path filters (1)
  • spec/dummy/yarn.lock is excluded by !**/yarn.lock, !**/*.lock
📒 Files selected for processing (57)
  • docs/README.md (3 hunks)
  • docs/advanced-topics/manual-installation-overview.md (0 hunks)
  • docs/advanced-topics/rails-engine-integration.md (2 hunks)
  • docs/api-reference/README.md (0 hunks)
  • docs/api-reference/configuration.md (1 hunks)
  • docs/api-reference/generator-details.md (1 hunks)
  • docs/api-reference/redux-store-api.md (1 hunks)
  • docs/api-reference/view-helpers-api.md (3 hunks)
  • docs/building-features/code-splitting.md (0 hunks)
  • docs/building-features/foreman-issues.md (0 hunks)
  • docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md (2 hunks)
  • docs/building-features/how-to-conditionally-server-render-based-on-device-type.md (1 hunks)
  • docs/building-features/i18n.md (1 hunks)
  • docs/building-features/images.md (1 hunks)
  • docs/building-features/process-managers.md (1 hunks)
  • docs/building-features/react-and-redux.md (1 hunks)
  • docs/building-features/react-router.md (1 hunks)
  • docs/building-features/rspec-configuration.md (2 hunks)
  • docs/building-features/turbolinks.md (5 hunks)
  • docs/core-concepts/react-on-rails-overview.md (0 hunks)
  • docs/core-concepts/webpack-configuration.md (1 hunks)
  • docs/deployment/heroku-deployment.md (2 hunks)
  • docs/deployment/troubleshooting-build-errors.md (1 hunks)
  • docs/deployment/troubleshooting-when-using-shakapacker.md (2 hunks)
  • docs/deployment/troubleshooting-when-using-webpacker.md (1 hunks)
  • docs/getting-started.md (0 hunks)
  • docs/getting-started/installation-into-an-existing-rails-app.md (0 hunks)
  • docs/getting-started/project-structure.md (2 hunks)
  • docs/getting-started/quick-start.md (3 hunks)
  • docs/getting-started/tutorial.md (12 hunks)
  • docs/getting-started/using-react-on-rails.md (1 hunks)
  • docs/guides/advanced/README.md (0 hunks)
  • docs/home.md (0 hunks)
  • docs/introduction.md (1 hunks)
  • docs/misc/credits.md (1 hunks)
  • docs/misc/doctrine.md (1 hunks)
  • docs/misc/style.md (1 hunks)
  • docs/misc/updating-dependencies.md (1 hunks)
  • docs/outdated/converting-from-custom-webpack-config-to-rails-webpacker-config.md (0 hunks)
  • docs/outdated/deferred-rendering.md (0 hunks)
  • docs/outdated/rails-assets-relative-paths.md (0 hunks)
  • docs/outdated/rails-assets.md (0 hunks)
  • docs/outdated/rails3.md (0 hunks)
  • docs/outdated/tips-for-usage-with-sp6.md (0 hunks)
  • docs/outdated/upgrade-webpacker-v3-to-v4.md (0 hunks)
  • docs/outdated/webpack-v1-notes.md (0 hunks)
  • docs/outdated/webpack.md (0 hunks)
  • docs/planning/docs-improvement/04-ia-redesign-plan.md (1 hunks)
  • docs/planning/docs-improvement/ia-redesign-live.md (3 hunks)
  • docs/pro/react-on-rails-pro.md (1 hunks)
  • lib/react_on_rails/dev/process_manager.rb (1 hunks)
  • spec/dummy/client/app/components/RouterLayout.jsx (2 hunks)
  • spec/dummy/client/app/routes/routes.jsx (1 hunks)
  • spec/dummy/client/app/startup/RouterApp.client.jsx (1 hunks)
  • spec/dummy/client/app/startup/RouterApp.server.jsx (1 hunks)
  • spec/dummy/package.json (1 hunks)
  • spec/react_on_rails/dev/process_manager_spec.rb (1 hunks)
💤 Files with no reviewable changes (18)
  • docs/building-features/code-splitting.md
  • docs/outdated/upgrade-webpacker-v3-to-v4.md
  • docs/home.md
  • docs/outdated/deferred-rendering.md
  • docs/outdated/tips-for-usage-with-sp6.md
  • docs/getting-started.md
  • docs/outdated/webpack-v1-notes.md
  • docs/api-reference/README.md
  • docs/guides/advanced/README.md
  • docs/getting-started/installation-into-an-existing-rails-app.md
  • docs/outdated/rails-assets.md
  • docs/outdated/converting-from-custom-webpack-config-to-rails-webpacker-config.md
  • docs/outdated/rails-assets-relative-paths.md
  • docs/core-concepts/react-on-rails-overview.md
  • docs/outdated/webpack.md
  • docs/outdated/rails3.md
  • docs/building-features/foreman-issues.md
  • docs/advanced-topics/manual-installation-overview.md
✅ Files skipped from review due to trivial changes (6)
  • docs/building-features/images.md
  • docs/misc/updating-dependencies.md
  • docs/pro/react-on-rails-pro.md
  • docs/api-reference/redux-store-api.md
  • lib/react_on_rails/dev/process_manager.rb
  • docs/building-features/rspec-configuration.md
🚧 Files skipped from review as they are similar to previous changes (13)
  • docs/deployment/troubleshooting-build-errors.md
  • docs/misc/credits.md
  • docs/misc/doctrine.md
  • spec/dummy/client/app/components/RouterLayout.jsx
  • docs/deployment/troubleshooting-when-using-webpacker.md
  • spec/dummy/client/app/startup/RouterApp.server.jsx
  • spec/react_on_rails/dev/process_manager_spec.rb
  • docs/api-reference/view-helpers-api.md
  • docs/building-features/i18n.md
  • docs/advanced-topics/rails-engine-integration.md
  • docs/api-reference/configuration.md
  • docs/building-features/react-and-redux.md
  • spec/dummy/package.json
🧰 Additional context used
📓 Path-based instructions (2)
**/*.{js,jsx,ts,tsx,css,scss,json,yml,yaml,md}

📄 CodeRabbit inference engine (CLAUDE.md)

Prettier is the sole authority for formatting all non-Ruby files; never manually format them

Files:

  • spec/dummy/client/app/startup/RouterApp.client.jsx
  • docs/README.md
  • docs/building-features/react-router.md
  • docs/deployment/troubleshooting-when-using-shakapacker.md
  • docs/api-reference/generator-details.md
  • spec/dummy/client/app/routes/routes.jsx
  • docs/getting-started/quick-start.md
  • docs/building-features/turbolinks.md
  • docs/building-features/how-to-conditionally-server-render-based-on-device-type.md
  • docs/introduction.md
  • docs/getting-started/project-structure.md
  • docs/deployment/heroku-deployment.md
  • docs/getting-started/tutorial.md
  • docs/getting-started/using-react-on-rails.md
  • docs/building-features/process-managers.md
  • docs/misc/style.md
  • docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md
  • docs/core-concepts/webpack-configuration.md
  • docs/planning/docs-improvement/04-ia-redesign-plan.md
  • docs/planning/docs-improvement/ia-redesign-live.md
**/*.{js,jsx,ts,tsx}

📄 CodeRabbit inference engine (CLAUDE.md)

Use ESLint for JS/TS code (lint via rake lint or yarn lint)

Files:

  • spec/dummy/client/app/startup/RouterApp.client.jsx
  • spec/dummy/client/app/routes/routes.jsx
🧠 Learnings (3)
📚 Learning: 2025-09-16T08:01:11.146Z
Learnt from: justin808
PR: shakacode/react_on_rails#1770
File: lib/generators/react_on_rails/templates/base/base/app/javascript/src/HelloWorld/ror_components/HelloWorld.client.jsx:2-2
Timestamp: 2025-09-16T08:01:11.146Z
Learning: React on Rails uses webpack CSS Modules configuration with namedExports: true, which requires the import syntax `import * as style from './file.module.css'` rather than the default export pattern. This configuration enables better tree shaking and bundle size optimization for CSS modules.

Applied to files:

  • docs/deployment/troubleshooting-when-using-shakapacker.md
  • docs/getting-started/project-structure.md
📚 Learning: 2025-02-13T16:50:26.861Z
Learnt from: AbanoubGhadban
PR: shakacode/react_on_rails#1644
File: node_package/src/turbolinksUtils.ts:34-36
Timestamp: 2025-02-13T16:50:26.861Z
Learning: In React on Rails, when checking for Turbolinks version 5 using `turbolinksVersion5()`, always ensure `Turbolinks` exists first by checking `turbolinksInstalled()` to prevent TypeError when accessing properties.

Applied to files:

  • docs/building-features/turbolinks.md
📚 Learning: 2025-04-26T21:55:55.874Z
Learnt from: alexeyr-ci2
PR: shakacode/react_on_rails#1732
File: spec/dummy/client/app-react16/startup/ReduxSharedStoreApp.client.jsx:40-44
Timestamp: 2025-04-26T21:55:55.874Z
Learning: In the react_on_rails project, files under `app-react16` directories are copied/moved to corresponding `/app` directories during the conversion process (removing the `-react16` suffix), which affects their relative import paths at runtime.

Applied to files:

  • docs/getting-started/project-structure.md
  • docs/planning/docs-improvement/ia-redesign-live.md
🧬 Code graph analysis (2)
spec/dummy/client/app/startup/RouterApp.client.jsx (1)
spec/dummy/client/app/startup/RouterApp.server.jsx (1)
  • props (6-10)
spec/dummy/client/app/routes/routes.jsx (1)
spec/dummy/client/app/components/RouterLayout.jsx (1)
  • RouterLayout (6-29)
🪛 LanguageTool
docs/building-features/turbolinks.md

[uncategorized] ~26-~26: The official name of this software platform is spelled with a capital “H”.
Context: ...c) - Auto-detected - See Turbolinks on Github ...

(GITHUB)

docs/deployment/heroku-deployment.md

[style] ~77-~77: You have already used this phrasing in nearby sentences. Consider replacing it to add variety to your writing.
Context: ... database: ror_production ``` Then you need to set up Postgres so you can run locally:...

(REP_NEED_TO_VB)


[style] ~153-~153: Reusing ‘you’ could be redundant. Try omitting the pronoun.
Context: ...``` and you will see your live app and you can share this URL with your friends. Congr...

(SUBJECT_DROP)

docs/getting-started/tutorial.md

[uncategorized] ~147-~147: If this is a compound adjective that modifies the following noun, use a hyphen.
Context: ...out a special React setup, will cause a full page refresh each time you save a file. If ...

(EN_COMPOUND_ADJECTIVE_INTERNAL)

docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md

[grammar] ~17-~17: Use a hyphen to join words.
Context: ...v-server` during development. ## Server Side Rendering with the Default shakacod...

(QB_NEW_EN_HYPHEN)

docs/core-concepts/webpack-configuration.md

[style] ~25-~25: Consider a more concise word here.
Context: ...), you will see this pattern in action. In order to customize the Webpack configuration, co...

(IN_ORDER_TO_PREMIUM)

docs/planning/docs-improvement/04-ia-redesign-plan.md

[uncategorized] ~858-~858: Did you mean the formatting language “Markdown” (= proper noun)?
Context: ...ted (manually as encountered) - [ ] Run markdown link checker (TODO: before final merge)...

(MARKDOWN_NNP)

🪛 markdownlint-cli2 (0.18.1)
docs/api-reference/generator-details.md

50-50: Fenced code blocks should have a language specified

(MD040, fenced-code-language)


70-70: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

docs/core-concepts/webpack-configuration.md

25-25: Link text should be descriptive

(MD059, descriptive-link-text)

docs/planning/docs-improvement/ia-redesign-live.md

350-350: Fenced code blocks should have a language specified

(MD040, fenced-code-language)


375-375: Fenced code blocks should have a language specified

(MD040, fenced-code-language)


394-394: Fenced code blocks should have a language specified

(MD040, fenced-code-language)


403-403: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)


405-405: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (11)
  • GitHub Check: build-dummy-app-webpack-test-bundles
  • GitHub Check: claude-review
  • GitHub Check: markdown-link-check
  • GitHub Check: build-dummy-app-webpack-test-bundles
  • GitHub Check: build-dummy-app-webpack-test-bundles (3.2, 20)
  • GitHub Check: lint-js-and-ruby
  • GitHub Check: build
  • GitHub Check: rspec-package-tests (3.4, latest)
  • GitHub Check: rspec-package-tests (3.2, minimum)
  • GitHub Check: rspec-package-tests (3.4, minimum)
  • GitHub Check: rspec-package-tests (3.2, latest)
🔇 Additional comments (30)
docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md (1)

17-17: Heading level adjustments improve documentation hierarchy.

The restructuring from single-hash headings to properly nested levels (## and ###) enhances readability and establishes a clearer organizational structure for this guide. This aligns well with the documentation IA redesign objectives.

Also applies to: 23-23, 43-43, 45-45

docs/building-features/turbolinks.md (1)

102-116: New troubleshooting and debugging sections are well-structured.

The addition of "Turbolinks 5 Specific Information," "Technical Details and Troubleshooting," and "Debugging Turbolinks Events" with concrete examples (TRACE_TURBOLINKS setup, sample console outputs for Classic vs. 5.x) significantly improves the documentation's practical utility. The distinction between event handler differences and configuration examples is clear.

docs/building-features/how-to-conditionally-server-render-based-on-device-type.md (1)

30-30: ✓ Documentation link updated correctly.

The reference to the configuration documentation has been properly updated to align with the IA restructuring, changing from docs/guides/configuration.md to docs/api-reference/configuration.md.

docs/misc/style.md (1)

36-40: LGTM! Clean documentation hierarchy improvement.

The demotion of the Git Usage heading to a secondary level improves the document structure, and the addition of CI/code coverage guidance is a practical enhancement.

spec/dummy/client/app/startup/RouterApp.client.jsx (1)

5-15: LGTM! Properly configured React Router v6 with v7 future flags.

The future flags prepare the application for eventual React Router v7 migration by enabling:

  • v7_startTransition: React 18 transition API for smoother navigation
  • v7_relativeSplatPath: Updated relative path resolution in nested routes

This aligns with the v6 migration visible across RouterLayout and routes components.

spec/dummy/client/app/routes/routes.jsx (1)

1-10: LGTM! Clean React Router v6 migration.

The migration correctly:

  • Uses Routes wrapper (required in v6)
  • Replaces component prop with element prop
  • Employs wildcard path (/react_router/*) for nested routing

This properly integrates with the nested Routes in RouterLayout.jsx.

docs/building-features/react-router.md (2)

21-29: Excellent React Router version guidance!

The explicit warning about v7's Remix merger and recommendation to use v6 for stable SSR integration is valuable, practical advice that will save users from compatibility headaches.


85-119: SSR example is clear and well-structured.

The StaticRouter example correctly demonstrates:

  • Import from 'react-router-dom/server' (v6 requirement)
  • Using location from railsContext
  • Returning { renderedHtml: html } (correct RoR pattern)

The migration notes from v5 are helpful context.

docs/planning/docs-improvement/04-ia-redesign-plan.md (1)

799-852: Phase 3 completion well-documented.

The status updates clearly track what was completed versus planned, with helpful rationale for adaptations (e.g., transforming getting-started.md to using-react-on-rails.md instead of splitting). This level of detail aids future maintenance.

docs/deployment/heroku-deployment.md (2)

1-4: Good disclaimer about version currency.

The prominent note linking to Heroku's Rails 7 guide manages expectations about the tutorial app versions while still providing working instructions.


94-124: Comprehensive Puma configuration guidance.

The reference to Heroku's official docs combined with the concrete example configuration provides users with both authoritative guidance and a working starting point.

docs/deployment/troubleshooting-when-using-shakapacker.md (1)

1-6: Improved heading specificity.

The updated heading "Troubleshooting Shakapacker Configuration Issues" more accurately describes the document's scope compared to a generic title, helping users quickly identify relevant content.

docs/README.md (3)

1-6: Excellent refocusing for GitHub users.

The opening clearly directs users to the full website experience while acknowledging GitHub browsing needs. This successfully consolidates entry points as intended in the IA redesign.


7-31: Clear learning paths improve discoverability.

The Beginner vs. Experienced Developer split provides immediate, obvious paths based on user needs. The addition of the "Migrating from Other Solutions" section addresses a key user journey.


45-55: Clean category structure replaces overwhelming TOC.

Consolidating the detailed sub-item lists into top-level category links dramatically improves scannability. The 173→65 line reduction makes this file far more useful as a GitHub navigation aid.

docs/api-reference/generator-details.md (2)

50-58: Add language hint to the directory tree code fence (MD040).

The fenced code block lacks a language identifier, triggering markdownlint MD040. Add text as the language.

-```
+```text
 app/javascript/
 └── src/

70-90: Add language hint to the Redux structure directory tree (MD040).

This fenced code block also lacks a language identifier. Add text.

-```
+```text
 app/javascript/
 └── src/
docs/getting-started/quick-start.md (2)

15-15: Node.js prerequisite update aligns with system requirements.

Updated from 18+ to 20+ is consistent with the broader documentation updates and reflects current LTS recommendations.


162-162: Navigation link updated correctly for new documentation structure.

Link now points to the new focused guide at using-react-on-rails.md rather than a generic "Basic Configuration" section.

docs/building-features/process-managers.md (1)

81-85: Add language hint to Procfile code fence (MD040).

The Procfile code block should have a language identifier. Use procfile.

-```procfile
+```procfile
 rails: bundle exec rails s -p 3000
 wp-client: bin/shakapacker-dev-server
 wp-server: SERVER_BUNDLE_ONLY=true bin/shakapacker --watch
docs/introduction.md (1)

1-132: Excellent new homepage that consolidates entry points effectively.

The introduction provides clear decision paths for different user scenarios (new to framework, adding to existing app, learning by example) and ties the documentation structure together well. Navigation to related docs is consistent with the IA redesign.

docs/getting-started/using-react-on-rails.md (2)

126-130: Verify language hint was added to directory tree code fence.

Past review comments (commit 60e9cea) indicate a language hint should be added to this tree structure. The current code shows the fence without a language identifier. Please confirm the fix was applied, as this triggers markdownlint MD040.

-```
+```text
 app/javascript/
 └── bundles/HelloWorld/          # or src/HelloWorld/ror_components/ with auto-bundling
     └── HelloWorld.jsx

189-197: Verify JavaScript example syntax and language hint.

Past review comments indicate fixes were applied (commits 60e9cea and da9ae1f) for both the destructuring syntax and language hint on this JavaScript object example. Please confirm:

  1. The fence includes a language hint (should be js or javascript)
  2. The object syntax is correct (no stray semicolons)

Current code shows:

-```
+```js
 ({
   renderedHtml: {
     componentHtml,
     redirectLocation,
     error,
   },
 });
docs/getting-started/project-structure.md (1)

1-152: Dual-structure guidance effectively supports the modern auto-bundling approach while documenting legacy patterns.

The file clearly distinguishes between modern (recommended) and traditional structures, includes practical styling guidance, and the decision tree helps users choose their path. Content aligns well with related documentation updates.

docs/getting-started/tutorial.md (2)

7-7: Fix emphasis-as-heading to satisfy markdownlint MD036.

Using italics as a heading triggers MD036. Convert to a blockquote or note format.

-_Updated for Ruby 3.0+, Rails 7, React on Rails v16, and Shakapacker v7_
+> **Note:** Updated for Ruby 3.0+, Rails 7, React on Rails v16, and Shakapacker v7.

25-43: Tutorial restructuring effectively consolidates entry points and clarifies Rails version targeting.

The reorganized table of contents now clearly separates Installation, HMR, Deployment, and Going Further sections. Updates to version guidance (Rails 7.0+, noting Rails 6 support) align with the broader documentation redesign. Separation of deployment guidance into its own section and link is a good improvement.

docs/planning/docs-improvement/ia-redesign-live.md (4)

350-350: Add language hint to code fence on line 350 (MD040).

-```
+```text
 1. 🚀 Getting Started
 2. 📚 Core Concepts

375-375: Add language hint to code fence on line 375 (MD040).

-```
+```bash
 mv app/javascript client

394-394: Add language hint to code fence on line 394 (MD040).

-```
+```text
 docs/

403-478: Fix emphasis-as-heading (MD036) and add language hint to code fence (MD040).

Line 403 uses emphasis formatting where a heading should be. Convert to proper markdown heading, and add language hint to the code block.

-**Reference: Final Folder Structure**
-
-```
+## Reference: Final Folder Structure
+
+```text
 docs/

github-actions bot and others added 2 commits October 27, 2025 21:12
Update link display text from 'here in docs/basics/configuration.md' to 'available here' to match the actual URL path (docs/api-reference/configuration/)

Co-authored-by: Ihab Adham <[email protected]>
…ODO)

Replace TODO from PR #1620 with comprehensive Turbo documentation covering
both free (Turbo Frames) and Pro (Turbo Streams) features.

Changes:

1. **New "Using Turbo" Section**
   - Installation steps (turbo-rails gem + @hotwired/turbo-rails package)
   - Basic configuration (ReactOnRails.setOptions({ turbo: true }))
   - Turbo Frames usage (free, works out of the box)
   - Turbo Streams usage (requires immediate_hydration: true - Pro feature)
   - Complete working example with turbo_frame_tag and turbo_stream.update
   - Links to v16.0 release notes, streaming docs, and spec/dummy example

2. **Migration Context**
   - Note about force_load → immediate_hydration rename in v16.0
   - Clear distinction between free vs Pro features
   - Explanation of WHY Turbo Streams need immediate_hydration
     (they don't dispatch turbo:render events, directly manipulate DOM)

3. **Improved Async Scripts Warning**
   - Replaced confusing "Do not use immediate_hydration: false" warning
   - New clear warning: "Async Scripts with Turbolinks Require Pro Feature"
   - Explains the race condition problem
   - Provides three alternatives with behavioral descriptions:
     * defer (waits for full page load before hydration)
     * Upgrade to Turbo (recommended)
     * Use Pro for immediate_hydration: true

Technical Context:
- PR #1620 (Aug 2024) added force_load for Turbo Streams
- PR #1781 (Sep 2025) renamed to immediate_hydration + made Pro-only
- Feature still actively used (spec/dummy has working example)
- Default immediate_hydration: false causes race conditions with async scripts

Resolves TODO on line 16 left by Justin in PR #1620 comments.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <[email protected]>
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 0

♻️ Duplicate comments (1)
docs/building-features/turbolinks.md (1)

105-105: Fix GitHub brand capitalization.

"Github" should be capitalized as "GitHub" per official branding.

-- See [Turbolinks on Github](https://github.com/rails/turbolinks)
+- See [Turbolinks on GitHub](https://github.com/rails/turbolinks)
🧹 Nitpick comments (4)
docs/building-features/turbolinks.md (4)

11-11: Hyphenate compound adjective modifying noun.

Line 11: "full page reloads" should be "full-page reloads" when used as a compound adjective.

-Turbo is the modern replacement for Turbolinks, providing fast navigation through your Rails app without full page reloads.
+Turbo is the modern replacement for Turbolinks, providing fast navigation through your Rails app without full-page reloads.

15-15: Convert bold-formatted steps to Markdown headings.

Lines 15 and 27 use bold text for numbered steps; convert them to proper Markdown headings (####) for better semantic structure and compliance with markdown linting rules (MD036).

-**1. Install Turbo**
+#### 1. Install Turbo

-**2. Enable Turbo in React on Rails**
+#### 2. Enable Turbo in React on Rails

Also applies to: 27-27


63-63: Fix Markdown heading and alert syntax issues.

Two formatting problems:

  1. Line 63: Convert bold to proper heading (#### Why Turbo Streams Need Special Handling:)
  2. Line 178: Remove duplicate > in GitHub alert syntax (should be > [!WARNING] not > [!WARNING] >)
-**Why Turbo Streams Need Special Handling:**
+#### Why Turbo Streams Need Special Handling:

-> [!WARNING] > **Async Scripts with Turbolinks Require Pro Feature**
+> [!WARNING]
+> **Async Scripts with Turbolinks Require Pro Feature**

Also applies to: 178-178


186-186: Hyphenate compound adjective.

Line 186: "full page load" should be "full-page load" when used as a compound adjective modifying the noun.

-- Use `defer` instead of `async` (waits for full page load before hydration)
+- Use `defer` instead of `async` (waits for full-page load before hydration)
📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 28b8c8f and 1f05e1a.

📒 Files selected for processing (1)
  • docs/building-features/turbolinks.md (4 hunks)
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{js,jsx,ts,tsx,css,scss,json,yml,yaml,md}

📄 CodeRabbit inference engine (CLAUDE.md)

Prettier is the sole authority for formatting all non-Ruby files; never manually format them

Files:

  • docs/building-features/turbolinks.md
🧠 Learnings (2)
📚 Learning: 2025-02-13T16:50:26.861Z
Learnt from: AbanoubGhadban
PR: shakacode/react_on_rails#1644
File: node_package/src/turbolinksUtils.ts:34-36
Timestamp: 2025-02-13T16:50:26.861Z
Learning: In React on Rails, when checking for Turbolinks version 5 using `turbolinksVersion5()`, always ensure `Turbolinks` exists first by checking `turbolinksInstalled()` to prevent TypeError when accessing properties.

Applied to files:

  • docs/building-features/turbolinks.md
📚 Learning: 2025-09-15T21:24:48.207Z
Learnt from: AbanoubGhadban
PR: shakacode/react_on_rails#1781
File: node_package/src/ClientSideRenderer.ts:82-95
Timestamp: 2025-09-15T21:24:48.207Z
Learning: In React on Rails, the force_load feature includes both explicit `data-force-load="true"` usage and the ability to hydrate components during the page loading state (`document.readyState === 'loading'`). Both capabilities require a Pro license, so the condition `!railsContext.rorPro && (isComponentForceLoaded || document.readyState === 'loading')` correctly gates both scenarios.

Applied to files:

  • docs/building-features/turbolinks.md
🪛 LanguageTool
docs/building-features/turbolinks.md

[uncategorized] ~11-~11: If this is a compound adjective that modifies the following noun, use a hyphen.
Context: ...vigation through your Rails app without full page reloads. ### Basic Setup (Free) **1. ...

(EN_COMPOUND_ADJECTIVE_INTERNAL)


[uncategorized] ~105-~105: The official name of this software platform is spelled with a capital “H”.
Context: ...c) - Auto-detected - See Turbolinks on Github ...

(GITHUB)


[uncategorized] ~186-~186: If this is a compound adjective that modifies the following noun, use a hyphen.
Context: ...e defer instead of async (waits for full page load before hydration) > - Upgrade to m...

(EN_COMPOUND_ADJECTIVE_INTERNAL)

🪛 markdownlint-cli2 (0.18.1)
docs/building-features/turbolinks.md

15-15: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)


27-27: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)


63-63: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (10)
  • GitHub Check: lint-js-and-ruby
  • GitHub Check: build
  • GitHub Check: rspec-package-tests (3.4, minimum)
  • GitHub Check: build-dummy-app-webpack-test-bundles
  • GitHub Check: rspec-package-tests (3.2, minimum)
  • GitHub Check: rspec-package-tests (3.4, latest)
  • GitHub Check: build-dummy-app-webpack-test-bundles
  • GitHub Check: rspec-package-tests (3.2, latest)
  • GitHub Check: markdown-link-check
  • GitHub Check: claude-review

ihabadham and others added 2 commits October 28, 2025 09:20
The "(Free)" label in "### Basic Setup (Free)" was confusing because:
- Appears before any mention of Pro features
- Not used elsewhere in the codebase
- Readers don't know what it's contrasting with yet
- The Pro callout box later provides sufficient contrast

Changed to simply "### Basic Setup" to match patterns used in other docs
like streaming-server-rendering.md.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <[email protected]>
Changed second H1 to H2 for proper document structure:
- Line 21: "# Different Server-Side Rendering Code" → "## Different..."

Having multiple H1s in a document is problematic for:
- SEO (search engines expect one H1 per page)
- Accessibility (screen readers use heading hierarchy)
- Documentation systems (assume H1 is the page title)
- Navigation/table of contents generation

The second heading is a subtopic about techniques for having different
client/server code, so it should be H2 under the main page topic.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <[email protected]>
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 0

♻️ Duplicate comments (1)
docs/building-features/turbolinks.md (1)

105-105: Correct "GitHub" capitalization (unresolved from past review).

Line 105 still shows "Github" instead of the official "GitHub" branding. Although this was flagged in a past review, the issue persists in the current code.

-- See [Turbolinks on Github](https://github.com/rails/turbolinks)
+- See [Turbolinks on GitHub](https://github.com/rails/turbolinks)
🧹 Nitpick comments (4)
docs/building-features/turbolinks.md (4)

11-11: Use hyphenated compound adjective.

Line 11 uses "full page reloads" which should be hyphenated as "full-page reloads" when modifying a noun.

-Turbo is the modern replacement for Turbolinks, providing fast navigation through your Rails app without full page reloads.
+Turbo is the modern replacement for Turbolinks, providing fast navigation through your Rails app without full-page reloads.

15-15: Replace emphasis-based section labels with proper markdown headings.

Lines 15 and 27 use bold emphasis (**text**) as pseudo-headings for numbered steps, which violates the markdownlint MD036 rule (no-emphasis-as-heading). Convert these to proper markdown heading syntax or restructure without emphasis.

-**1. Install Turbo**
+#### 1. Install Turbo

-**2. Enable Turbo in React on Rails**
+#### 2. Enable Turbo in React on Rails

Alternatively, if you prefer keeping them as inline labels without full heading treatment, restructure to avoid the emphasis-as-heading pattern:

-**1. Install Turbo**
+1. Install Turbo

Also applies to: 27-27


63-63: Replace emphasis-based section label with proper markdown heading.

Line 63 uses bold emphasis as a pseudo-heading (**Why Turbo Streams Need Special Handling:**), violating markdownlint MD036. Convert to a proper heading:

-**Why Turbo Streams Need Special Handling:**
+#### Why Turbo Streams Need Special Handling

186-186: Use hyphenated compound adjective.

Line 186 in the warning alternatives uses "full page load" which should be hyphenated as "full-page load" when modifying the noun "load" context.

-- Use `defer` instead of `async` (waits for full page load before hydration)
+- Use `defer` instead of `async` (waits for full-page load before hydration)
📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 1f05e1a and d719da4.

📒 Files selected for processing (1)
  • docs/building-features/turbolinks.md (4 hunks)
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{js,jsx,ts,tsx,css,scss,json,yml,yaml,md}

📄 CodeRabbit inference engine (CLAUDE.md)

Prettier is the sole authority for formatting all non-Ruby files; never manually format them

Files:

  • docs/building-features/turbolinks.md
🧠 Learnings (2)
📚 Learning: 2025-02-13T16:50:26.861Z
Learnt from: AbanoubGhadban
PR: shakacode/react_on_rails#1644
File: node_package/src/turbolinksUtils.ts:34-36
Timestamp: 2025-02-13T16:50:26.861Z
Learning: In React on Rails, when checking for Turbolinks version 5 using `turbolinksVersion5()`, always ensure `Turbolinks` exists first by checking `turbolinksInstalled()` to prevent TypeError when accessing properties.

Applied to files:

  • docs/building-features/turbolinks.md
📚 Learning: 2025-09-15T21:24:48.207Z
Learnt from: AbanoubGhadban
PR: shakacode/react_on_rails#1781
File: node_package/src/ClientSideRenderer.ts:82-95
Timestamp: 2025-09-15T21:24:48.207Z
Learning: In React on Rails, the force_load feature includes both explicit `data-force-load="true"` usage and the ability to hydrate components during the page loading state (`document.readyState === 'loading'`). Both capabilities require a Pro license, so the condition `!railsContext.rorPro && (isComponentForceLoaded || document.readyState === 'loading')` correctly gates both scenarios.

Applied to files:

  • docs/building-features/turbolinks.md
🪛 LanguageTool
docs/building-features/turbolinks.md

[uncategorized] ~11-~11: If this is a compound adjective that modifies the following noun, use a hyphen.
Context: ...vigation through your Rails app without full page reloads. ### Basic Setup **1. Install...

(EN_COMPOUND_ADJECTIVE_INTERNAL)


[uncategorized] ~105-~105: The official name of this software platform is spelled with a capital “H”.
Context: ...c) - Auto-detected - See Turbolinks on Github ...

(GITHUB)


[uncategorized] ~186-~186: If this is a compound adjective that modifies the following noun, use a hyphen.
Context: ...e defer instead of async (waits for full page load before hydration) > - Upgrade to m...

(EN_COMPOUND_ADJECTIVE_INTERNAL)

🪛 markdownlint-cli2 (0.18.1)
docs/building-features/turbolinks.md

15-15: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)


27-27: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)


63-63: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (10)
  • GitHub Check: claude-review
  • GitHub Check: markdown-link-check
  • GitHub Check: build-dummy-app-webpack-test-bundles
  • GitHub Check: lint-js-and-ruby
  • GitHub Check: rspec-package-tests (3.2, latest)
  • GitHub Check: rspec-package-tests (3.2, minimum)
  • GitHub Check: build-dummy-app-webpack-test-bundles
  • GitHub Check: build
  • GitHub Check: rspec-package-tests (3.4, minimum)
  • GitHub Check: rspec-package-tests (3.4, latest)

@Judahmeek
Copy link
Contributor

@CodeRabbit help

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Oct 28, 2025

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>, please review it.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.

CodeRabbit commands

These commands are invoked using PR/Issue comments.

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai full review to do a full review from scratch and review all the files again.
  • @coderabbitai summary to regenerate the summary of the PR.
  • @coderabbitai evaluate custom pre-merge check --instructions <custom-checks-instructions> --name <custom-checks-title> [--mode <error|warning>] to validate the custom pre-merge checks instructions. Defaults to error when --mode is omitted.
    • @coderabbitai ignore pre-merge checks to override pre-merge checks and get an approval on PR.
    • @coderabbitai run pre-merge checks to run pre-merge checks on the pull request.
  • @coderabbitai generate docstrings to generate docstrings for this PR.
  • @coderabbitai generate sequence diagram to generate a sequence diagram of the changes in this PR.
  • @coderabbitai generate unit tests to generate unit tests for this PR.
  • @coderabbitai resolve to resolve all the CodeRabbit review comments.
  • @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
  • @coderabbitai help to get help.

Other keywords and placeholders

  • Add @coderabbitai ignore or @coderabbit ignore anywhere in the PR description to prevent this PR from being reviewed.
  • Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
  • Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit configuration file (.coderabbit.yaml)

  • You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
  • Please see the configuration documentation for more information.
  • If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Status, support, documentation and community

  • Visit our status page to check the current availability of CodeRabbit.
  • Create a ticket on our support page for assistance with any issues or questions.
  • Visit our documentation site for detailed information on how to use CodeRabbit.
  • Join our Discord community to connect with other users and get help from the community.
  • Follow us on X/Twitter for updates and announcements.

@Judahmeek
Copy link
Contributor

@CodeRabbit full review

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Oct 28, 2025

✅ Actions performed

Full review triggered.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 3

♻️ Duplicate comments (4)
docs/deployment/troubleshooting-when-using-shakapacker.md (1)

54-54: Bare URL still present (duplicate concern).

The bare URL at line 54 was flagged in a previous review and marked as addressed, but it still appears to be present in the current code. Ensure the fix was applied.

docs/building-features/turbolinks.md (1)

105-105: Fix GitHub capitalization (duplicate issue).

The official GitHub brand uses a capital H. This was flagged in a past review but remains unfixed.

-- See [Turbolinks on Github](https://github.com/rails/turbolinks)
+- See [Turbolinks on GitHub](https://github.com/rails/turbolinks)
docs/getting-started/tutorial.md (1)

7-7: Fix markdownlint MD036: Convert italicized version note to blockquote (duplicate issue).

This was flagged in a past review and remains unaddressed. Replace the italicized line with a blockquote to satisfy MD036 and improve readability.

-_Updated for Ruby 3.0+, Rails 7, React on Rails v16, and Shakapacker v7_
+> **Note:** Updated for Ruby 3.0+, Rails 7, React on Rails v16, and Shakapacker v7.
docs/planning/docs-improvement/04-ia-redesign-plan.md (1)

853-861: Resolve markdown link-checker TODO before final merge (duplicate issue).

This was flagged in a past review and remains unresolved. Line 858 shows: - [ ] Run markdown link checker (TODO: before final merge). Implement an automated link-checking step in CI (e.g., markdown-link-check or similar tool) and update the checklist to mark complete, or explicitly defer with rationale.

🧹 Nitpick comments (7)
docs/core-concepts/webpack-configuration.md (1)

25-25: Consider simplifying wording and improving link text.

Two minor style improvements flagged by linters:

  • "In order to customize" can be shortened to "To customize"
  • The "here" link text could be more descriptive per MD059

Apply this diff:

-Typical Shakapacker apps have a standard directory structure as documented [here](https://github.com/shakacode/shakapacker/blob/master/README.md#configuration-and-code). If you follow [the basic tutorial](../getting-started/tutorial.md), you will see this pattern in action. In order to customize the Webpack configuration, consult the [Shakapacker webpack customization docs](https://github.com/shakacode/shakapacker#webpack-configuration).
+Typical Shakapacker apps have a standard directory structure as documented in the [Shakapacker README](https://github.com/shakacode/shakapacker/blob/master/README.md#configuration-and-code). If you follow [the basic tutorial](../getting-started/tutorial.md), you will see this pattern in action. To customize the Webpack configuration, consult the [Shakapacker webpack customization docs](https://github.com/shakacode/shakapacker#webpack-configuration).
docs/deployment/heroku-deployment.md (1)

126-135: Consider adding rationale for pinning Node and Yarn versions.

The engines specification is correct (Node 20.0.0 aligns with React on Rails v16 requirements), but based on the past review discussion, users would benefit from understanding why these versions are pinned. The disclaimer at the top (lines 3-4) partially addresses this, but a brief note here would be more discoverable.

Consider adding a short explanation after the JSON block:

   "engines": {
     "node": "20.0.0",
     "yarn": "1.22.4"
   },

+> Why specify engines? Heroku's Node.js buildpack reads the "engines" field to select the Node and Yarn versions used at build and runtime. Pinning these versions ensures reproducible builds and prevents unexpected upgrades between development and deployment.


</blockquote></details>
<details>
<summary>docs/building-features/turbolinks.md (2)</summary><blockquote>

`15-15`: **Convert bold numbered items to proper markdown headings.**

Lines 15, 27, and 63 use bold text where markdownlint (MD036) expects proper heading syntax. If these are intended as subsection headers, convert to `####` level headings for consistency with markdown structure.

For example, line 15:
```diff
-**1. Install Turbo**
+#### 1. Install Turbo

Apply this pattern to lines 27 and 63 as well. This satisfies MD036 and improves semantic heading hierarchy.

Also applies to: 27-27, 63-63


11-11: Add hyphens to compound adjectives.

Lines 11 and 186 use "full page" as a compound adjective modifying a noun. Per grammar conventions, this should be hyphenated: "full-page".

-Turbo is the modern replacement for Turbolinks, providing fast navigation through your Rails app without full page reloads.
+Turbo is the modern replacement for Turbolinks, providing fast navigation through your Rails app without full-page reloads.

-Use `defer` instead of `async` (waits for full page load before hydration)
+Use `defer` instead of `async` (waits for full-page load before hydration)

Also applies to: 186-186

docs/planning/docs-improvement/ia-redesign-live.md (1)

402-403: Add language identifier to fenced code block (MD040).

The fenced code block starting at line 402 should specify a language for markdownlint compliance.

-```
+```text
 docs/
docs/getting-started/tutorial.md (1)

147-147: Add hyphen to compound adjective "full page refresh".

Per grammar conventions, when "full page" modifies a noun, use a hyphen: "full-page refresh".

-The basic [HMR](https://webpack.js.org/concepts/hot-module-replacement/), without a special React setup, will cause a full page refresh each time you save a file.
+The basic [HMR](https://webpack.js.org/concepts/hot-module-replacement/), without a special React setup, will cause a full-page refresh each time you save a file.
docs/planning/docs-improvement/04-ia-redesign-plan.md (1)

858-858: Capitalize "Markdown" (proper noun).

Per style conventions, "Markdown" should be capitalized when referring to the formatting language.

-- [ ] Run markdown link checker (TODO: before final merge)
+- [ ] Run Markdown link checker (TODO: before final merge)
📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 2398430 and f76707c.

⛔ Files ignored due to path filters (1)
  • spec/dummy/yarn.lock is excluded by !**/yarn.lock, !**/*.lock
📒 Files selected for processing (58)
  • docs/README.md (3 hunks)
  • docs/advanced-topics/manual-installation-overview.md (0 hunks)
  • docs/advanced-topics/rails-engine-integration.md (2 hunks)
  • docs/api-reference/README.md (0 hunks)
  • docs/api-reference/configuration.md (1 hunks)
  • docs/api-reference/generator-details.md (1 hunks)
  • docs/api-reference/redux-store-api.md (1 hunks)
  • docs/api-reference/view-helpers-api.md (3 hunks)
  • docs/building-features/code-splitting.md (0 hunks)
  • docs/building-features/foreman-issues.md (0 hunks)
  • docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md (2 hunks)
  • docs/building-features/how-to-conditionally-server-render-based-on-device-type.md (1 hunks)
  • docs/building-features/i18n.md (1 hunks)
  • docs/building-features/images.md (1 hunks)
  • docs/building-features/process-managers.md (1 hunks)
  • docs/building-features/react-and-redux.md (1 hunks)
  • docs/building-features/react-router.md (1 hunks)
  • docs/building-features/rspec-configuration.md (2 hunks)
  • docs/building-features/turbolinks.md (4 hunks)
  • docs/core-concepts/client-vs-server-rendering.md (1 hunks)
  • docs/core-concepts/react-on-rails-overview.md (0 hunks)
  • docs/core-concepts/webpack-configuration.md (1 hunks)
  • docs/deployment/heroku-deployment.md (2 hunks)
  • docs/deployment/troubleshooting-build-errors.md (1 hunks)
  • docs/deployment/troubleshooting-when-using-shakapacker.md (2 hunks)
  • docs/deployment/troubleshooting-when-using-webpacker.md (1 hunks)
  • docs/getting-started.md (0 hunks)
  • docs/getting-started/installation-into-an-existing-rails-app.md (0 hunks)
  • docs/getting-started/project-structure.md (2 hunks)
  • docs/getting-started/quick-start.md (3 hunks)
  • docs/getting-started/tutorial.md (12 hunks)
  • docs/getting-started/using-react-on-rails.md (1 hunks)
  • docs/guides/advanced/README.md (0 hunks)
  • docs/home.md (0 hunks)
  • docs/introduction.md (1 hunks)
  • docs/misc/credits.md (1 hunks)
  • docs/misc/doctrine.md (1 hunks)
  • docs/misc/style.md (1 hunks)
  • docs/misc/updating-dependencies.md (1 hunks)
  • docs/outdated/converting-from-custom-webpack-config-to-rails-webpacker-config.md (0 hunks)
  • docs/outdated/deferred-rendering.md (0 hunks)
  • docs/outdated/rails-assets-relative-paths.md (0 hunks)
  • docs/outdated/rails-assets.md (0 hunks)
  • docs/outdated/rails3.md (0 hunks)
  • docs/outdated/tips-for-usage-with-sp6.md (0 hunks)
  • docs/outdated/upgrade-webpacker-v3-to-v4.md (0 hunks)
  • docs/outdated/webpack-v1-notes.md (0 hunks)
  • docs/outdated/webpack.md (0 hunks)
  • docs/planning/docs-improvement/04-ia-redesign-plan.md (1 hunks)
  • docs/planning/docs-improvement/ia-redesign-live.md (3 hunks)
  • docs/pro/react-on-rails-pro.md (1 hunks)
  • lib/react_on_rails/dev/process_manager.rb (1 hunks)
  • spec/dummy/client/app/components/RouterLayout.jsx (2 hunks)
  • spec/dummy/client/app/routes/routes.jsx (1 hunks)
  • spec/dummy/client/app/startup/RouterApp.client.jsx (1 hunks)
  • spec/dummy/client/app/startup/RouterApp.server.jsx (1 hunks)
  • spec/dummy/package.json (1 hunks)
  • spec/react_on_rails/dev/process_manager_spec.rb (1 hunks)
💤 Files with no reviewable changes (18)
  • docs/api-reference/README.md
  • docs/outdated/upgrade-webpacker-v3-to-v4.md
  • docs/outdated/deferred-rendering.md
  • docs/advanced-topics/manual-installation-overview.md
  • docs/building-features/foreman-issues.md
  • docs/outdated/tips-for-usage-with-sp6.md
  • docs/outdated/rails3.md
  • docs/outdated/converting-from-custom-webpack-config-to-rails-webpacker-config.md
  • docs/outdated/rails-assets.md
  • docs/outdated/rails-assets-relative-paths.md
  • docs/getting-started/installation-into-an-existing-rails-app.md
  • docs/guides/advanced/README.md
  • docs/building-features/code-splitting.md
  • docs/outdated/webpack.md
  • docs/getting-started.md
  • docs/home.md
  • docs/core-concepts/react-on-rails-overview.md
  • docs/outdated/webpack-v1-notes.md
🧰 Additional context used
📓 Path-based instructions (3)
**/*.{js,jsx,ts,tsx,css,scss,json,yml,yaml,md}

📄 CodeRabbit inference engine (CLAUDE.md)

Prettier is the sole authority for formatting all non-Ruby files; never manually format them

Files:

  • docs/deployment/troubleshooting-build-errors.md
  • docs/misc/doctrine.md
  • spec/dummy/client/app/startup/RouterApp.client.jsx
  • docs/building-features/i18n.md
  • docs/core-concepts/webpack-configuration.md
  • docs/deployment/heroku-deployment.md
  • docs/api-reference/generator-details.md
  • spec/dummy/client/app/routes/routes.jsx
  • spec/dummy/package.json
  • spec/dummy/client/app/components/RouterLayout.jsx
  • docs/core-concepts/client-vs-server-rendering.md
  • docs/api-reference/configuration.md
  • spec/dummy/client/app/startup/RouterApp.server.jsx
  • docs/advanced-topics/rails-engine-integration.md
  • docs/getting-started/tutorial.md
  • docs/getting-started/project-structure.md
  • docs/building-features/rspec-configuration.md
  • docs/misc/style.md
  • docs/getting-started/using-react-on-rails.md
  • docs/building-features/how-to-conditionally-server-render-based-on-device-type.md
  • docs/deployment/troubleshooting-when-using-webpacker.md
  • docs/introduction.md
  • docs/building-features/turbolinks.md
  • docs/misc/credits.md
  • docs/README.md
  • docs/pro/react-on-rails-pro.md
  • docs/misc/updating-dependencies.md
  • docs/planning/docs-improvement/04-ia-redesign-plan.md
  • docs/building-features/process-managers.md
  • docs/api-reference/redux-store-api.md
  • docs/api-reference/view-helpers-api.md
  • docs/deployment/troubleshooting-when-using-shakapacker.md
  • docs/building-features/react-router.md
  • docs/planning/docs-improvement/ia-redesign-live.md
  • docs/building-features/react-and-redux.md
  • docs/getting-started/quick-start.md
  • docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md
  • docs/building-features/images.md
{Gemfile,Rakefile,config.ru,**/*.{rb,rake,gemspec,ru}}

📄 CodeRabbit inference engine (CLAUDE.md)

{Gemfile,Rakefile,config.ru,**/*.{rb,rake,gemspec,ru}}: All Ruby code must pass RuboCop with zero offenses before commit/push
RuboCop is the sole authority for Ruby file formatting; never manually format Ruby files

Files:

  • lib/react_on_rails/dev/process_manager.rb
  • spec/react_on_rails/dev/process_manager_spec.rb
**/*.{js,jsx,ts,tsx}

📄 CodeRabbit inference engine (CLAUDE.md)

Use ESLint for JS/TS code (lint via rake lint or yarn lint)

Files:

  • spec/dummy/client/app/startup/RouterApp.client.jsx
  • spec/dummy/client/app/routes/routes.jsx
  • spec/dummy/client/app/components/RouterLayout.jsx
  • spec/dummy/client/app/startup/RouterApp.server.jsx
🧠 Learnings (5)
📚 Learning: 2025-09-16T08:01:11.146Z
Learnt from: justin808
PR: shakacode/react_on_rails#1770
File: lib/generators/react_on_rails/templates/base/base/app/javascript/src/HelloWorld/ror_components/HelloWorld.client.jsx:2-2
Timestamp: 2025-09-16T08:01:11.146Z
Learning: React on Rails uses webpack CSS Modules configuration with namedExports: true, which requires the import syntax `import * as style from './file.module.css'` rather than the default export pattern. This configuration enables better tree shaking and bundle size optimization for CSS modules.

Applied to files:

  • docs/api-reference/configuration.md
  • docs/getting-started/project-structure.md
  • docs/building-features/rspec-configuration.md
  • docs/deployment/troubleshooting-when-using-shakapacker.md
📚 Learning: 2025-04-26T21:55:55.874Z
Learnt from: alexeyr-ci2
PR: shakacode/react_on_rails#1732
File: spec/dummy/client/app-react16/startup/ReduxSharedStoreApp.client.jsx:40-44
Timestamp: 2025-04-26T21:55:55.874Z
Learning: In the react_on_rails project, files under `app-react16` directories are copied/moved to corresponding `/app` directories during the conversion process (removing the `-react16` suffix), which affects their relative import paths at runtime.

Applied to files:

  • docs/getting-started/project-structure.md
  • docs/planning/docs-improvement/ia-redesign-live.md
📚 Learning: 2025-02-13T16:50:26.861Z
Learnt from: AbanoubGhadban
PR: shakacode/react_on_rails#1644
File: node_package/src/turbolinksUtils.ts:34-36
Timestamp: 2025-02-13T16:50:26.861Z
Learning: In React on Rails, when checking for Turbolinks version 5 using `turbolinksVersion5()`, always ensure `Turbolinks` exists first by checking `turbolinksInstalled()` to prevent TypeError when accessing properties.

Applied to files:

  • docs/building-features/turbolinks.md
📚 Learning: 2025-09-15T21:24:48.207Z
Learnt from: AbanoubGhadban
PR: shakacode/react_on_rails#1781
File: node_package/src/ClientSideRenderer.ts:82-95
Timestamp: 2025-09-15T21:24:48.207Z
Learning: In React on Rails, the force_load feature includes both explicit `data-force-load="true"` usage and the ability to hydrate components during the page loading state (`document.readyState === 'loading'`). Both capabilities require a Pro license, so the condition `!railsContext.rorPro && (isComponentForceLoaded || document.readyState === 'loading')` correctly gates both scenarios.

Applied to files:

  • docs/building-features/turbolinks.md
  • docs/pro/react-on-rails-pro.md
📚 Learning: 2025-10-23T17:22:01.064Z
Learnt from: AbanoubGhadban
PR: shakacode/react_on_rails#1875
File: lib/react_on_rails/utils.rb:112-124
Timestamp: 2025-10-23T17:22:01.064Z
Learning: In React on Rails, when Pro is installed but not licensed, the intended behavior is to raise an error on boot. The `react_on_rails_pro?` method validates licenses and should raise errors early (including during path resolution in methods like `server_bundle?`) to enforce licensing requirements rather than failing later with obscure errors.

Applied to files:

  • docs/pro/react-on-rails-pro.md
🪛 LanguageTool
docs/core-concepts/webpack-configuration.md

[style] ~25-~25: Consider a more concise word here.
Context: ...), you will see this pattern in action. In order to customize the Webpack configuration, co...

(IN_ORDER_TO_PREMIUM)

docs/deployment/heroku-deployment.md

[style] ~77-~77: You have already used this phrasing in nearby sentences. Consider replacing it to add variety to your writing.
Context: ... database: ror_production ``` Then you need to set up Postgres so you can run locally:...

(REP_NEED_TO_VB)


[style] ~153-~153: Reusing ‘you’ could be redundant. Try omitting the pronoun.
Context: ...``` and you will see your live app and you can share this URL with your friends. Congr...

(SUBJECT_DROP)

docs/getting-started/tutorial.md

[uncategorized] ~147-~147: If this is a compound adjective that modifies the following noun, use a hyphen.
Context: ...out a special React setup, will cause a full page refresh each time you save a file. If ...

(EN_COMPOUND_ADJECTIVE_INTERNAL)

docs/building-features/turbolinks.md

[uncategorized] ~11-~11: If this is a compound adjective that modifies the following noun, use a hyphen.
Context: ...vigation through your Rails app without full page reloads. ### Basic Setup **1. Install...

(EN_COMPOUND_ADJECTIVE_INTERNAL)


[uncategorized] ~105-~105: The official name of this software platform is spelled with a capital “H”.
Context: ...c) - Auto-detected - See Turbolinks on Github ...

(GITHUB)


[uncategorized] ~186-~186: If this is a compound adjective that modifies the following noun, use a hyphen.
Context: ...e defer instead of async (waits for full page load before hydration) > - Upgrade to m...

(EN_COMPOUND_ADJECTIVE_INTERNAL)

docs/planning/docs-improvement/04-ia-redesign-plan.md

[uncategorized] ~858-~858: Did you mean the formatting language “Markdown” (= proper noun)?
Context: ...ted (manually as encountered) - [ ] Run markdown link checker (TODO: before final merge)...

(MARKDOWN_NNP)

docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md

[grammar] ~17-~17: Use a hyphen to join words.
Context: ...v-server` during development. ## Server Side Rendering with the Default shakacod...

(QB_NEW_EN_HYPHEN)

🪛 markdownlint-cli2 (0.18.1)
docs/core-concepts/webpack-configuration.md

25-25: Link text should be descriptive

(MD059, descriptive-link-text)

docs/api-reference/generator-details.md

50-50: Fenced code blocks should have a language specified

(MD040, fenced-code-language)


70-70: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

docs/getting-started/tutorial.md

7-7: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)

docs/building-features/turbolinks.md

15-15: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)


27-27: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)


63-63: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)

docs/planning/docs-improvement/ia-redesign-live.md

402-402: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

🔇 Additional comments (29)
docs/misc/credits.md (1)

1-2: Well-structured documentation improvement.

Adding a top-level heading properly establishes the document hierarchy and aligns with the documentation IA redesign goals outlined in the PR.

docs/building-features/rspec-configuration.md (1)

5-5: Good improvement to document structure.

The heading level changes (H1 → H2) on lines 5 and 23 properly establish a consistent document hierarchy where the main title is H1 and subsections are H2. This improves readability and aligns with markdown best practices.

Also applies to: 23-23

docs/building-features/i18n.md (2)

95-95: Header hierarchy is correct.

The change from # Notes to ## Notes properly nests the section as a subsection of the main # Internationalization heading, following correct Markdown hierarchy.


99-99: Outdated note clearly marked.

The addition of the "Outdated:" label explicitly signals that the referenced examples from the react-webpack-rails-tutorial may be stale, improving documentation clarity and helping readers distinguish current guidance from legacy examples.

docs/advanced-topics/rails-engine-integration.md (1)

1-2: Proper spacing after the top-level heading is already present.

The file currently has a blank line (line 2) after the heading (line 1), which aligns with standard markdown formatting. No changes are required.

docs/deployment/troubleshooting-when-using-webpacker.md (1)

1-2: LGTM! Heading improves document structure.

The addition of a top-level heading enhances navigation and aligns with the documentation IA redesign.

docs/misc/style.md (2)

36-36: LGTM! Heading level adjustment improves document hierarchy.

Changing from top-level to second-level heading creates better structure within the style guide.


40-40: LGTM! Valuable addition to Git workflow guidance.

Adding CI and code coverage to the Git usage section reinforces best practices.

docs/misc/updating-dependencies.md (1)

1-1: LGTM! More descriptive heading improves clarity.

The expanded heading better reflects the document's coverage of both Ruby and JavaScript dependency management.

docs/pro/react-on-rails-pro.md (1)

1-1: LGTM! Appropriate heading level for major topic.

Elevating React on Rails Pro to a top-level heading aligns with its importance and the documentation restructuring.

lib/react_on_rails/dev/process_manager.rb (1)

150-150: LGTM! Updated reference points to authoritative source.

The new URL points to the official foreman wiki, which is more authoritative and stable than internal documentation. This aligns with the removal of the internal foreman-issues.md doc.

docs/building-features/react-and-redux.md (1)

7-7: LGTM! Heading level adjustment improves document hierarchy.

Changing to a second-level heading creates proper nesting under the main topic.

docs/building-features/images.md (1)

1-1: LGTM! More descriptive heading improves clarity.

The expanded heading better describes the document's focus on webpack configuration for images and assets.

spec/react_on_rails/dev/process_manager_spec.rb (1)

237-237: LGTM! Test expectation correctly updated.

The test expectation matches the implementation change in lib/react_on_rails/dev/process_manager.rb, verifying the error message now references the authoritative foreman wiki.

docs/deployment/troubleshooting-build-errors.md (1)

279-279: LGTM!

The link update correctly points to the relocated webpack configuration documentation, maintaining proper cross-references in the restructured docs.

docs/building-features/hmr-and-hot-reloading-with-the-webpack-dev-server.md (1)

17-17: LGTM!

The heading level adjustments improve the document structure and hierarchy. These formatting-only changes maintain consistency with the broader documentation reorganization.

Also applies to: 23-23, 43-45

docs/building-features/process-managers.md (1)

1-91: LGTM!

This new documentation provides clear, comprehensive guidance on using process managers with React on Rails. The detailed explanation of why Foreman should be installed globally (lines 46-61) is particularly valuable, addressing a common configuration pitfall with well-reasoned justification.

spec/dummy/client/app/startup/RouterApp.client.jsx (1)

5-15: LGTM!

The addition of React Router v7 future flags is a best practice for migrating to React Router v6. These flags (v7_startTransition and v7_relativeSplatPath) opt into forward-compatible behaviors and will ease future upgrades to v7.

docs/core-concepts/client-vs-server-rendering.md (1)

21-27: LGTM!

The heading adjustment improves document hierarchy, and the new content (lines 25-27) provides valuable guidance on using separate Webpack configurations for server vs. client rendering—a useful alternative to conditional code patterns.

docs/getting-started/quick-start.md (2)

15-15: LGTM!

The Node.js requirement update to 20+ is correct and essential for React on Rails v16 compatibility. This aligns with the project's system requirements.


127-127: LGTM!

Minor wording improvements that enhance clarity: the <head> section phrasing is clearer, and the updated link text "Using React on Rails" is more descriptive than "Basic Configuration."

Also applies to: 162-162

docs/deployment/heroku-deployment.md (4)

3-4: LGTM!

The disclaimer about version currency is transparent and helpful, acknowledging that while the tutorial works, some versions may be dated. The link to Heroku's Rails 7 guide provides users with current best practices.


5-93: LGTM!

The new sections (Create Heroku App, Buildpacks, and PostgreSQL migration) provide comprehensive, step-by-step guidance. The PostgreSQL migration instructions are particularly thorough, covering both automatic (db:system:change) and manual approaches.


94-124: LGTM!

The Puma configuration section provides clear guidance with proper references to Heroku's official documentation. The Procfile code block correctly uses the procfile language identifier (resolving the previous markdownlint issue).


137-153: LGTM!

The deployment section provides clear, actionable steps with appropriate git commands and the final heroku open command for immediate verification.

docs/building-features/turbolinks.md (1)

9-96: Approve comprehensive Turbo/Turbolinks documentation restructure.

The restructured content provides excellent clarity: immediate Turbo focus with clear setup steps, Pro feature licensing callouts are transparent, migration guidance is actionable, and legacy Turbolinks support is well-documented separately. The addition of debugging traces and console examples significantly improves troubleshooting experience.

docs/planning/docs-improvement/ia-redesign-live.md (1)

326-396: Approve Phase 3 completion documentation.

Phase 3 actions are clearly documented with rationale. The "Actions Completed" section (7 items) and "Remaining Entry Point Tasks" succinctly capture work done and outstanding items. Cross-reference to ia-redesign-live.md as source of truth is well-positioned. Final folder structure shows how the IA redesign was actually executed vs. planned, which is valuable for future phases.

docs/getting-started/tutorial.md (1)

45-174: Approve tutorial version updates and content reorganization.

The tutorial improvements align well with PR objectives:

  • Version guidance is clear: Rails 7.0+ target with explicit Rails 6+ support note (line 52)
  • Redux vs. Hooks installer paths are explicitly explained (lines 113–119)
  • HMR behavior clarified with ./bin/dev usage and server-rendering auto-disable explanation (lines 145, 155)
  • Deployment content cleanly extracted to dedicated guides (lines 157–173), reducing tutorial scope
  • "Going Further" heading (line 174) is more discoverable than prior naming

Content progression from installation → HMR → deployment → optional advanced topics is logical and user-friendly.

docs/planning/docs-improvement/04-ia-redesign-plan.md (1)

797-851: Approve Phase 3 documentation and cross-reference to live tracker.

The Phase 3 section clearly documents completion with "STATUS: ✅ COMPLETED (with adaptations)." The section references ia-redesign-live.md as the source of truth, which appropriately consolidates actual vs. planned changes post-PR #1845. The testing checklist marks most items complete with rationale for deferred items (e.g., local Gatsby build deferred to Phase 1 website config). This plan document provides valuable historical context while delegating current tracking to the live implementation file.

@Judahmeek
Copy link
Contributor

@CodeRabbit resolve

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Oct 28, 2025

✅ Actions performed

Comments resolved and changes approved.

@Judahmeek Judahmeek merged commit 5e02c7a into master Oct 28, 2025
31 of 33 checks passed
@Judahmeek Judahmeek deleted the feature/docs-ia-redesign-1845-continue branch October 28, 2025 23:38
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants