push

Author: NoahMaizels

docs/develop/dynamic-content.md

@@ -4,6 +4,11 @@ id: dynamic-content
 sidebar_label: Dynamic Content
 ---
 
+:::warning
+Under construction, set for major revisions to incorporate content from manifests, rout, and host your website pages
+:::
+
+
 ## Feeds for Dynamic Content
 
 :::info
@@ -144,3 +149,5 @@ This gives you a fully working dynamic SPA with lightweight incremental updates.
 - This keeps deployments fast while ensuring long‑lived URLs remain valid.
 
 The next section (not included here) expands this into a registry‑based system for large dynamic sites.
+
+

docs/develop/host-your-website.md

@@ -480,288 +480,3 @@ This works across:
 
 You do not need to encode the hash or use any additional tools. `bzz://<hash>` is sufficient.
 
-## Client-Side Routing 
-
-This section explains how to add hash based client side routing to your Swarm hosted site so that you can have clean URLs for each page of your website. See the [routing project in the examples repo](https://github.com/ethersphere/examples/tree/main/routing) for a full working example implementation.
-
-### Why Hash Based Client Side Routing?
-
-Swarm does not behave like a traditional web server — there is **no server-side routing**, and every route must correspond to a real file inside the site manifest.
-If you try to use typical "clean URLs" like:
-
-```
-/about
-/contact
-/dashboard/settings
-```
-
-Swarm will look for literal files such as:
-
-```
-about
-contact
-dashboard/settings
-```
-
-...which obviously don’t exist unless you manually manipulate the manifest.
-This is theoretically possible, but is tricky and complex to do manually, and there is currently not (yet) any tooling to make it easier.
-
-### How to Add Routing
-
-If you want multiple pages on a Swarm-hosted website, you should use a client-side router. Swarm has no server backend running code and so can’t rewrite paths, so we use **React Router’s `HashRouter`**, which keeps all routing inside the browser.
-
-Below is the simplest way to set this up using **create-swarm-app** and then adding your own pages.
-
-
-#### 1. Create a New Vite + React Project (with `create-swarm-app`)
-
-Run:
-
-```bash
-npm init swarm-app@latest my-dapp-new vite-tsx
-```
-
-This generates a clean project containing:
-
-```
-src/
-  App.tsx
-  index.tsx
-  config.ts
-public/
-index.html
-package.json
-```
-
-You now have a fully working Vite/React app ready for Swarm uploads.
-
-
-#### 2. Install React Router
-
-Inside the project:
-
-```bash
-npm install react-router-dom
-```
-
-This gives you client-side navigation capability.
-
-
-
-#### 3. Switch the App to Use Hash-Based Routing
-
-Swarm only serves literal files, so `/#/about` is the only reliable way to have “pages.”
-
-Replace your `App.tsx` with:
-
-```tsx
-import { HashRouter, Routes, Route, Link } from 'react-router-dom'
-import { Home } from './Home'
-import { About } from './About'
-import { NotFound } from './NotFound'
-
-export function App() {
-    return (
-        <HashRouter>
-            <nav style={{ display: 'flex', gap: '12px', padding: '12px' }}>
-                <Link to="/">Home</Link>
-                <Link to="/about">About</Link>
-            </nav>
-
-            <Routes>
-                <Route path="/" element={<Home />} />
-                <Route path="/about" element={<About />} />
-                <Route path="*" element={<NotFound />} />
-            </Routes>
-        </HashRouter>
-    )
-}
-```
-
-This gives you usable routes:
-
-```
-/#/         → Home
-/#/about    → About
-/#/anything → React 404 page
-```
-
-#### 4. Add Your Page Components
-
-Example `Home.tsx`:
-
-```tsx
-export function Home() {
-  return (
-    <div style={{ padding: '20px' }}>
-      <h1>Home</h1>
-      <p>Welcome to your Swarm-powered app.</p>
-    </div>
-  )
-}
-```
-
-Example `About.tsx`:
-
-```tsx
-export function About() {
-  return (
-    <div style={{ padding: '20px' }}>
-      <h1>About</h1>
-      <p>This demo shows how to upload files or directories to Swarm using Bee-JS.</p>
-    </div>
-  )
-}
-```
-
-Example `NotFound.tsx`:
-
-```tsx
-export function NotFound() {
-  return (
-    <div style={{ padding: '20px' }}>
-      <h1>Page Not Found</h1>
-      <a href="./#/">Return to Home</a>
-    </div>
-  )
-}
-```
-
-#### 5. Add a Static `404.html` for Non-Hash URLs
-
-Swarm still needs a fallback for URLs like:
-
-```
-/non-existent-file
-```
-
-Create `public/404.html`:
-
-```html
-<!DOCTYPE html>
-<html>
-<head>
-  <meta charset="UTF-8" />
-  <title>404 – Not Found</title>
-  <style>
-    body { font-family: sans-serif; padding: 40px; }
-    a { color: #007bff; }
-  </style>
-</head>
-
-<nav style="display: flex; gap: 12px; padding: 12px">
-  <a href="./#/">Home</a>
-  <a href="./#/about">About</a>
-</nav>
-
-<body>
-  <h1>404</h1>
-  <p>This page doesn't exist.</p>
-  <p><a href="./#/">Return to Home</a></p>
-</body>
-</html>
-```
-
-Vite will automatically include this in `dist/`.
-
-This file handles **non-hash** missing paths.
-React handles **hash** missing paths.
-
-
-#### 6. Build the Project
-
-Before uploading, compile the Vite app into a static bundle:
-
-```bash
-npm run build
-```
-
-This produces a `dist/` folder containing:
-
-```
-dist/
-  index.html
-  404.html
-  assets/
-```
-
-Everything inside `dist/` will be uploaded to your Swarm feed.
-
-#### 7. Create a Publisher Identity and Deploy Using a Feed Manifest 
-
-For stable URLs, use a **feed manifest** reference. This gives you a permanent Swarm URL that always resolves to the latest version of your content.
-
-Create an identity (if you don’t have one yet):
-
-```bash
-swarm-cli identity create web-publisher
-```
-
-Upload your built site to the feed:
-
-
-<Tabs>
-<TabItem value="linux" label="Linux / macOS">
-
-```bash
-swarm-cli feed upload ./dist \
-  --identity web-publisher \
-  --topic-string website \
-  --stamp <BATCH_ID> \
-  --index-document index.html \
-  --error-document 404.html
-```
-
-</TabItem>
-<TabItem value="powershell" label="Windows PowerShell">
-
-```powershell
-swarm-cli feed upload .\dist `
-  --identity web-publisher `
-  --topic-string website `
-  --stamp 3d98a22f522377ae9cc2aa3bca7f352fb0ed6b16bad73f0246b0a5c155f367bc `
-  --index-document index.html `
-  --error-document 404.html
-```
-</TabItem>
-</Tabs>
-
-
-The output includes:
-
-* the **content hash**
-* the **feed manifest URL** → this is your **permanent website URL**
-* stamp usage details
-
-Example:
-
-```
-Feed Manifest URL:
-http://localhost:1633/bzz/<feed-manifest-hash>/
-```
-
-This URL never changes, even when you update your site.
-
-
-#### 8. Visit Your Site
-
-* Home:
-  `/#/`
-
-* About:
-  `/#/about`
-
-* Invalid hash route: handled by `NotFound.tsx`
-
-* Invalid non-hash route: handled by `404.html`
-
-
-#### Summary
-
-You now have:
-
-* A Vite + React app
-* Hash-based routing fully compatible with Swarm
-* A static 404 for non-hash paths
-* A React 404 for invalid hash paths
-* Stable, versioned deployments using feed manifests

docs/develop/directories-routing.md docs/develop/manifests.mddocs/develop/directories-routing.md renamed to docs/develop/manifests.md

@@ -1,15 +1,15 @@
 ---
-title: Directories & Routing (Manifests)
-id: directories-routing
-sidebar_label: Directories & Routing
+title: Manifests ("Virtual Filesystem")
+id: manifests
+sidebar_label: Manifests ("Virtual Filesystem")
 ---
 
 import Tabs from '@theme/Tabs';
 import TabItem from '@theme/TabItem';
 
 Bee nodes — along with tools used for working with them like `bee-js` and `swarm-cli` — let you upload whole folders of files to Swarm.
 
-Swarm doesn’t have a traditional filesystem, but can _act like one_ using **manifests**, which map readable paths (like `/images/cat.jpg`) to immutable Swarm references.
+Swarm doesn’t technically have a filesystem, but can *act like one* using **manifests**, which map readable paths (like `/images/cat.jpg`) to immutable Swarm references.
 
 :::info
 The `bee-js` [`MantarayNode` class](https://github.com/ethersphere/bee-js?tab=readme-ov-file#swarm-primitives) is the main way to work with manifests in NodeJS.
@@ -213,13 +213,16 @@ Instead, download files by using the top-level directory manifest and the file
 
 Example:
 
-````bash
+```bash
 curl http://127.0.0.1:1633/bzz/4d5e6e3eb532131e128b1cd0400ca249f1a6ce5d4005c0b57bf848131300df9d/folder/subfolder/deep.txt
-:::
+```
+
+Terminal output:
 
 ```bash
 DEEP
-````
+```
+:::
 
 **Metadata:**
 
@@ -266,7 +269,7 @@ This means:
 
 Meanwhile, `"folder/"` has **no file itself**, so its target is zero.
 
-## Directories (bee-js)
+## Manipulating Directories 
 
 In this section we explain how to inspect and modify manifests for non-website directories. You can find the completed [example scripts on GitHub](https://github.com/ethersphere/examples/tree/main/manifests).
 
@@ -739,9 +742,4 @@ Now the file appears under:
 
 Note that the only new method we used was `node.removeFork()` to remove the entry from the manifest.
 
-```js
-// STEP 1 — Remove /new.txt
-        node.removeFork("new.txt")
-        console.log("Removed /new.txt from manifest.")
-```