Explorar o código

build: replace Leiningen with shadow-cljs standalone

Remove project.clj and the :lein true flag; move Clojure deps and
source paths directly into shadow-cljs.edn. Add npm scripts (dev, prod,
build-report) and bump shadow-cljs from 2.8.83 to 3.4.11. Update
README, frontend/README, and CLAUDE.md to reflect the new workflow.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Brandon Wong hai 3 semanas
pai
achega
1d63b2f925
Modificáronse 7 ficheiros con 148 adicións e 1046 borrados
  1. 5 5
      CLAUDE.md
  2. 1 1
      README.md
  3. 32 156
      frontend/README.md
  4. 98 837
      frontend/package-lock.json
  5. 6 1
      frontend/package.json
  6. 0 43
      frontend/project.clj
  7. 6 3
      frontend/shadow-cljs.edn

+ 5 - 5
CLAUDE.md

@@ -8,8 +8,8 @@ A lightweight spreadsheet application designed for quick calculations — positi
 **Frontend** (`/frontend/`)
 - **Language**: ClojureScript (compiled via shadow-cljs)
 - **Framework**: Reagent + re-frame (React wrapper)
-- **Build**: Leiningen + shadow-cljs
-- **Dev server**: `lein dev` → localhost:8280
+- **Build**: shadow-cljs (via npm scripts)
+- **Dev server**: `npm run dev` → localhost:8280
 
 **Server** (`/server/`)
 - **Language**: JavaScript (ES6+ with Babel)
@@ -57,8 +57,8 @@ Example:
 - `frontend/src/cljs/microtables_frontend/views/sheet.cljs` - Grid rendering
 
 **Project Configuration**
-- `frontend/project.clj` - Leiningen config
-- `frontend/shadow-cljs.edn` - ClojureScript build config
+- `frontend/shadow-cljs.edn` - ClojureScript build config (source paths, deps, build targets)
+- `frontend/package.json` - npm scripts and JS dependencies
 
 ## Development Notes
 
@@ -69,7 +69,7 @@ Example:
 
 ## Common Tasks
 
-**Run frontend**: `cd frontend && lein dev`
+**Run frontend**: `cd frontend && npm run dev`
 **Install npm dependency**: Add to `shadow-cljs.edn`, then restart
 **Understand formula eval**: Start in `evaluation.cljs`, trace through `evaluate-from-cell`
 **Modify grid UI**: Look in `views/sheet.cljs`

+ 1 - 1
README.md

@@ -7,7 +7,7 @@ A spreadsheet software with limited functionality, designed for quick calculatio
 
 ## Installation
 
-Clone the repo, go into `frontend`, and run `lein dev`. Then navigate to `localhost:8280` in a browser.
+Clone the repo, go into `frontend`, run `npm install`, then `npm run dev`. Navigate to `localhost:8280` in a browser.
 
 Currently, only the frontend works - but all the spreadsheet functionality works on the frontend side. The server will provide saving and collaboration features.
 

+ 32 - 156
frontend/README.md

@@ -1,24 +1,14 @@
 # microtables-frontend
 
-A [re-frame](https://github.com/day8/re-frame) application designed to ... well, that part is up to
-you.
+A [re-frame](https://github.com/day8/re-frame) ClojureScript single-page application.
 
-## Getting Started
+## Project Overview
 
-### Project Overview
-
-* Architecture:
-[Single Page Application (SPA)](https://en.wikipedia.org/wiki/Single-page_application)
-* Languages
-  - Front end ([re-frame](https://github.com/day8/re-frame)): [ClojureScript](https://clojurescript.org/) (CLJS)
+* Architecture: [Single Page Application (SPA)](https://en.wikipedia.org/wiki/Single-page_application)
+* Language: [ClojureScript](https://clojurescript.org/) with [re-frame](https://github.com/day8/re-frame)
 * Dependencies
-  - UI framework: [re-frame](https://github.com/day8/re-frame)
-  ([docs](https://github.com/day8/re-frame/blob/master/docs/README.md),
-  [FAQs](https://github.com/day8/re-frame/blob/master/docs/FAQs/README.md)) ->
-  [Reagent](https://github.com/reagent-project/reagent) ->
-  [React](https://github.com/facebook/react)
+  - UI framework: [re-frame](https://github.com/day8/re-frame) → [Reagent](https://github.com/reagent-project/reagent) → [React](https://github.com/facebook/react)
 * Build tools
-  - Project task & dependency management: [Leiningen](https://github.com/technomancy/leiningen)
   - CLJS compilation, REPL, & hot reload: [`shadow-cljs`](https://github.com/thheller/shadow-cljs)
 * Development tools
   - Debugging: [CLJS DevTools](https://github.com/binaryage/cljs-devtools)
@@ -26,178 +16,64 @@ you.
 #### Directory structure
 
 * [`/`](/../../): project config files
-* [`dev/`](dev/): source files compiled only with the [dev](#running-the-app) profile
-  - [`cljs/user.cljs`](dev/cljs/user.cljs): symbols for use during development in the
-[ClojureScript REPL](#connecting-to-the-browser-repl-from-a-terminal)
-* [`resources/public/`](resources/public/): SPA root directory;
-[dev](#running-the-app) / [prod](#production) profile depends on the most recent build
+* [`dev/`](dev/): source files available only during development
+  - [`cljs/user.cljs`](dev/cljs/user.cljs): symbols for use during development in the ClojureScript REPL
+* [`resources/public/`](resources/public/): SPA root directory
   - [`index.html`](resources/public/index.html): SPA home page
-    - Dynamic SPA content rendered in the following `div`:
-        ```html
-        <div id="app"></div>
-        ```
-    - Customizable; add headers, footers, links to other scripts and styles, etc.
-  - Generated directories and files
-    - Created on build with either the [dev](#running-the-app) or [prod](#production) profile
-    - Deleted on `lein clean` (run by all `lein` aliases before building)
-    - `js/compiled/`: compiled CLJS (`shadow-cljs`)
-      - Not tracked in source control; see [`.gitignore`](.gitignore)
-* [`src/cljs/microtables_frontend/`](src/cljs/microtables_frontend/): SPA source files (ClojureScript,
-[re-frame](https://github.com/Day8/re-frame))
-  - [`core.cljs`](src/cljs/microtables_frontend/core.cljs): contains the SPA entry point, `init`
-
-### Editor/IDE
-
-Use your preferred editor or IDE that supports Clojure/ClojureScript development. See
-[Clojure tools](https://clojure.org/community/resources#_clojure_tools) for some popular options.
-
-### Environment Setup
-
-1. Install [JDK 8 or later](https://openjdk.java.net/install/) (Java Development Kit)
-2. Install [Leiningen](https://leiningen.org/#install) (Clojure/ClojureScript project task &
-dependency management)
-3. Install [Node.js](https://nodejs.org/) (JavaScript runtime environment)
-7. Clone this repo and open a terminal in the `microtables-frontend` project root directory
-8. Download project dependencies:
+  - `js/compiled/`: compiled CLJS output (not tracked in source control)
+* [`src/cljs/microtables_frontend/`](src/cljs/microtables_frontend/): SPA source files
+
+## Environment Setup
+
+1. Install [JDK 11 or later](https://openjdk.java.net/install/)
+2. Install [Node.js](https://nodejs.org/)
+3. Clone this repo and open a terminal in the `frontend` directory
+4. Install dependencies:
     ```sh
-    lein deps && npm install
+    npm install
     ```
 
 ### Browser Setup
 
-Browser caching should be disabled when developer tools are open to prevent interference with
-[`shadow-cljs`](https://github.com/thheller/shadow-cljs) hot reloading.
-
-Custom formatters must be enabled in the browser before
-[CLJS DevTools](https://github.com/binaryage/cljs-devtools) can display ClojureScript data in the
-console in a more readable way.
-
-#### Chrome/Chromium
-
-1. Open [DevTools](https://developers.google.com/web/tools/chrome-devtools/) (Linux/Windows: `F12`
-or `Ctrl-Shift-I`; macOS: `⌘-Option-I`)
-2. Open DevTools Settings (Linux/Windows: `?` or `F1`; macOS: `?` or `Fn+F1`)
-3. Select `Preferences` in the navigation menu on the left, if it is not already selected
-4. Under the `Network` heading, enable the `Disable cache (while DevTools is open)` option
-5. Under the `Console` heading, enable the `Enable custom formatters` option
-
-#### Firefox
-
-1. Open [Developer Tools](https://developer.mozilla.org/en-US/docs/Tools) (Linux/Windows: `F12` or
-`Ctrl-Shift-I`; macOS: `⌘-Option-I`)
-2. Open [Developer Tools Settings](https://developer.mozilla.org/en-US/docs/Tools/Settings)
-(Linux/macOS/Windows: `F1`)
-3. Under the `Advanced settings` heading, enable the `Disable HTTP Cache (when toolbox is open)`
-option
+Disable browser caching when developer tools are open to prevent interference with hot reloading.
 
-Unfortunately, Firefox does not yet support custom formatters in their devtools. For updates, follow
-the enhancement request in their bug tracker:
-[1262914 - Add support for Custom Formatters in devtools](https://bugzilla.mozilla.org/show_bug.cgi?id=1262914).
+Enable custom formatters in Chrome/Chromium DevTools (`Settings → Preferences → Console → Enable custom formatters`) so that [CLJS DevTools](https://github.com/binaryage/cljs-devtools) can display ClojureScript data readably in the console.
 
 ## Development
 
 ### Running the App
 
-Start a temporary local web server, build the app with the `dev` profile, and serve the app with
-hot reload:
-
 ```sh
-lein dev
+npm run dev
 ```
 
-Please be patient; it may take over 20 seconds to see any output, and over 40 seconds to complete.
-
-When `[:app] Build completed` appears in the output, browse to
-[http://localhost:8280/](http://localhost:8280/).
+When `[:app] Build completed` appears in the output, browse to [http://localhost:8280/](http://localhost:8280/).
 
-[`shadow-cljs`](https://github.com/thheller/shadow-cljs) will automatically push ClojureScript code
-changes to your browser on save. To prevent a few common issues, see
-[Hot Reload in ClojureScript: Things to avoid](https://code.thheller.com/blog/shadow-cljs/2019/08/25/hot-reload-in-clojurescript.html#things-to-avoid).
+`shadow-cljs` will automatically push ClojureScript code changes to your browser on save. See [Hot Reload in ClojureScript: Things to avoid](https://code.thheller.com/blog/shadow-cljs/2019/08/25/hot-reload-in-clojurescript.html#things-to-avoid) for common pitfalls.
 
-Opening the app in your browser starts a
-[ClojureScript browser REPL](https://clojurescript.org/reference/repl#using-the-browser-as-an-evaluation-environment),
-to which you may now connect.
+### Connecting to the browser REPL from your editor
 
-#### Connecting to the browser REPL from your editor
+See [Shadow CLJS User's Guide: Editor Integration](https://shadow-cljs.github.io/docs/UsersGuide.html#_editor_integration). The running build id is `app` (`:app` in a Clojure context).
 
-See
-[Shadow CLJS User's Guide: Editor Integration](https://shadow-cljs.github.io/docs/UsersGuide.html#_editor_integration).
-Note that `lein dev` runs `shadow-cljs watch` for you, and that this project's running build id is
-`app`, or the keyword `:app` in a Clojure context.
+### Connecting to the browser REPL from a terminal
 
-Alternatively, search the web for info on connecting to a `shadow-cljs` ClojureScript browser REPL
-from your editor and configuration.
-
-For example, in Vim / Neovim with `fireplace.vim`
-1. Open a `.cljs` file in the project to activate `fireplace.vim`
-2. In normal mode, execute the `Piggieback` command with this project's running build id, `:app`:
-    ```vim
-    :Piggieback :app
-    ```
-
-#### Connecting to the browser REPL from a terminal
-
-1. Connect to the `shadow-cljs` nREPL:
+1. Connect to the nREPL (port 8777, configured in `shadow-cljs.edn`):
     ```sh
-    lein repl :connect localhost:8777
+    npx shadow-cljs cljs-repl app
     ```
-    The REPL prompt, `shadow.user=>`, indicates that is a Clojure REPL, not ClojureScript.
-
-2. In the REPL, switch the session to this project's running build id, `:app`:
+    Or connect with your editor's nREPL client to `localhost:8777`, then:
     ```clj
     (shadow.cljs.devtools.api/nrepl-select :app)
     ```
-    The REPL prompt changes to `cljs.user=>`, indicating that this is now a ClojureScript REPL.
-3. See [`user.cljs`](dev/cljs/user.cljs) for symbols that are immediately accessible in the REPL
-without needing to `require`.
 
-### Running `shadow-cljs` Actions
-
-See a list of [`shadow-cljs CLI`](https://shadow-cljs.github.io/docs/UsersGuide.html#_command_line)
-actions:
-```sh
-lein run -m shadow.cljs.devtools.cli --help
-```
-
-Please be patient; it may take over 10 seconds to see any output. Also note that some actions shown
-may not actually be supported, outputting "Unknown action." when run.
-
-Run a shadow-cljs action on this project's build id (without the colon, just `app`):
-```sh
-lein run -m shadow.cljs.devtools.cli <action> app
-```
 ### Debug Logging
 
-The `debug?` variable in [`config.cljs`](src/cljs/microtables_frontend/config.cljs) defaults to `true` in
-[`dev`](#running-the-app) builds, and `false` in [`prod`](#production) builds.
-
-Use `debug?` for logging or other tasks that should run only on `dev` builds:
-
-```clj
-(ns microtables-frontend.example
-  (:require [microtables-frontend.config :as config])
-
-(when config/debug?
-  (println "This message will appear in the browser console only on dev builds."))
-```
+The `debug?` variable in [`config.cljs`](src/cljs/microtables_frontend/config.cljs) defaults to `true` in dev builds and `false` in prod builds.
 
 ## Production
 
-Build the app with the `prod` profile:
-
 ```sh
-lein prod
+npm run prod
 ```
 
-Please be patient; it may take over 15 seconds to see any output, and over 30 seconds to complete.
-
-The `resources/public/js/compiled` directory is created, containing the compiled `app.js` and
-`manifest.edn` files.
-
-The [`resources/public`](resources/public/) directory contains the complete, production web front
-end of your app.
-
-Always inspect the `resources/public/js/compiled` directory prior to deploying the app. Running any
-`lein` alias in this project after `lein dev` will, at the very least, run `lein clean`, which
-deletes this generated directory. Further, running `lein dev` will generate many, much larger
-development versions of the files in this directory.
+The `resources/public/js/compiled` directory will contain the compiled `app.js` and `manifest.edn` files. The `resources/public/` directory is the complete production web front end.

A diferenza do arquivo foi suprimida porque é demasiado grande
+ 98 - 837
frontend/package-lock.json


+ 6 - 1
frontend/package.json

@@ -1,6 +1,11 @@
 {
+  "scripts": {
+    "dev": "shadow-cljs watch app",
+    "prod": "shadow-cljs release app",
+    "build-report": "shadow-cljs run shadow.cljs.build-report app target/build-report.html"
+  },
   "devDependencies": {
-    "shadow-cljs": "2.8.83"
+    "shadow-cljs": "3.4.11"
   },
   "dependencies": {
     "mathjs": "7.0.1",

+ 0 - 43
frontend/project.clj

@@ -1,43 +0,0 @@
-(defproject microtables-frontend "0.1.0-SNAPSHOT"
-  :dependencies [[org.clojure/clojure "1.10.1"]
-                 [org.clojure/clojurescript "1.10.597"
-                  :exclusions [com.google.javascript/closure-compiler-unshaded
-                               org.clojure/google-closure-library
-                               org.clojure/google-closure-library-third-party]]
-                 [thheller/shadow-cljs "2.8.83"]
-                 [reagent "0.9.1"]
-                 [re-frame "0.11.0"]]
-
-  :plugins [
-            [lein-shell "0.5.0"]]
-
-  :min-lein-version "2.5.3"
-
-  :source-paths ["src/clj" "src/cljs"]
-
-  :clean-targets ^{:protect false} ["resources/public/js/compiled" "target"]
-
-
-  :shell {:commands {"open" {:windows ["cmd" "/c" "start"]
-                             :macosx  "open"
-                             :linux   "xdg-open"}}}
-
-  :aliases {"dev"          ["with-profile" "dev" "do"
-                            ["run" "-m" "shadow.cljs.devtools.cli" "watch" "app"]]
-            "prod"         ["with-profile" "prod" "do"
-                            ["run" "-m" "shadow.cljs.devtools.cli" "release" "app"]]
-            "build-report" ["with-profile" "prod" "do"
-                            ["run" "-m" "shadow.cljs.devtools.cli" "run" "shadow.cljs.build-report" "app" "target/build-report.html"]
-                            ["shell" "open" "target/build-report.html"]]
-            "karma"        ["with-profile" "prod" "do"
-                            ["run" "-m" "shadow.cljs.devtools.cli" "compile" "karma-test"]
-                            ["shell" "karma" "start" "--single-run" "--reporters" "junit,dots"]]}
-
-  :profiles
-  {:dev
-   {:dependencies [[binaryage/devtools "1.0.0"]]
-    :source-paths ["dev"]}
-
-   :prod { }}
-
-  :prep-tasks [])

+ 6 - 3
frontend/shadow-cljs.edn

@@ -1,4 +1,8 @@
-{:lein   true
+{:source-paths ["src/cljs" "dev"]
+
+ :dependencies [[reagent "0.9.1"]
+                [re-frame "0.11.0"]
+                [binaryage/devtools "1.0.0"]]
 
  :nrepl {:port 8777}
 
@@ -8,5 +12,4 @@
                 :modules         {:app {:init-fn microtables-frontend.core/init
                                         :preloads [devtools.preload]}}
                 :devtools        {:http-root    "resources/public"
-                                  :http-port    8280
-                                  }}}}
+                                  :http-port    8280}}}}