react js template

README.md

@@ -74,7 +74,12 @@ nix flake init -t "github:piq9117/nix-templates#ocaml"
 nix flake init -t "github:piq9117/nix-templates#react-nextjs"
 ```
 
-## React 
+## React TS
 ``` sh
-nix flake init -t "github:piq9117/nix-templates#react"
+nix flake init -t "github:piq9117/nix-templates#react-ts"
+```
+
+## React JS
+``` sh
+nix flake init -t "github:piq9117/nix-templates#react-js"
 ```

flake.nix

@@ -38,6 +38,11 @@
         path = ./react-ts-template;
         description = "React TS Template";
       };
+
+      react-js = {
+        path = ./react-js-template;
+        description = "React JS Template";
+      };
     };
   };
 }

react-js-template/flake.nix

@@ -0,0 +1,44 @@
+{
+  description = "React JS Template";
+
+  inputs = {
+    nixpkgs.url = "nixpkgs";
+  };
+
+  outputs = {self, nixpkgs}:
+    let
+      supportedSystems = [ "x86_64-linux" "x86_64-darwin" "aarch64-linux" "aarch64-darwin" ];
+      forAllSystems = f: nixpkgs.lib.genAttrs supportedSystems (system: f system);
+
+      nixpkgsFor = forAllSystems(system: import nixpkgs {
+        inherit system;
+        overlays = [self.overlay];
+      });
+
+    in {
+      overlay = final: prev: {
+        generate-vite-app = final.writeScriptBin "generate-vite-app" ''
+          ${final.nodePackages_latest.pnpm}/bin/pnpm create vite . --template vanilla
+        '';
+      };
+      devShells = forAllSystems(system:
+        let pkgs = nixpkgsFor.${system};
+        in {
+          default = pkgs.mkShell {
+            buildInputs = with pkgs; [
+              nodejs_20
+              nodePackages_latest.npm
+              nodePackages_latest.pnpm
+              nodePackages.prettier
+              treefmt
+              generate-vite-app
+            ];
+
+            shellHook = ''
+              export PS1='[$PWD]\n❄ '
+              #!/usr/bin/env bash
+            '';
+          };
+        });
+    };
+}

react-js-template/treefmt.toml

@@ -0,0 +1,4 @@
+[formatter.typescript]
+command = "prettier"
+options = ["--write"]
+includes = ["*.js", "*.ts", "*.tsx"]