0.8.0

.npmignore

@@ -21,6 +21,7 @@ docs
 mocha-reporter.ts
 
 tests/e2e/*/*
+tests/e2e/Dockerfile
 tests/e2e/Helper.js
 tests/e2e/SSH.ts
 tests/e2e/SSH.js
@@ -49,7 +50,6 @@ scripts/watch.ts
 
 cli.ts
 
-webapp/GlobalReact.d.ts
 webapp/fetch.js
 
 server/index.js

README.md

@@ -1,38 +1,54 @@
+<p align="center">
+<a href="https://fullstacked.org/">
+<img src="https://fullstacked.org/favicon.png" alt="FullStacked Logo" width="50px" />
+</a>
+</p>
+<h1 align="center">FullStacked</h1>
+<h3 align="center">A TypeScript Web Apps Tool</h3>
+<p align="center" ><small>The only tool you need from creation to deployment</small></p>
+<p align="center">
+<a href="https://www.npmjs.com/package/fullstacked"><img src="https://img.shields.io/badge/version-0.8.0-01b0de" alt="version"/>
+<a href="https://www.npmjs.com/package/fullstacked?activeTab=dependencies"><img src="https://img.shields.io/badge/dependencies-13-yellowgreen" alt="dependencies"/></a>
+<a href="https://npmgraph.js.org/?q=fullstacked"><img src="https://img.shields.io/badge/module%20deps-302-yellow" alt="module dependencies"/></a>
+<a href="https://cplepage.github.io/fullstacked-code-coverage/"><img src="https://img.shields.io/badge/coverage-80.94%25-yellowgreen" alt="code coverage"/></a>
+</p>
+
 > **Warning** <br />
 > FullStacked is still in early development. Commands and syntax are likely to change.
 
-# FullStacked
-A full stack web app build tool and development kit.
-
-[<img src="https://fullstacked.org/favicon.png" alt="FullStacked Logo" width="75px" />](https://fullstacked.org/)
-
-
-[![version](https://img.shields.io/badge/version-0.7.8-01b0de)](https://www.npmjs.com/package/fullstacked)
-[![dependencies](https://img.shields.io/badge/dependencies-17-yellowgreen)](https://www.npmjs.com/package/fullstacked?activeTab=dependencies)
-[![module dependencies](https://img.shields.io/badge/module%20deps-365-yellow)](https://npmgraph.js.org/?q=fullstacked)
-[![code coverage](https://img.shields.io/badge/coverage-82.00%25-yellowgreen)](https://cplepage.github.io/fullstacked-code-coverage/)
-
-
-A complete setup for a Typescript full stack application.
-It has all the Server(Backend) setup and the WebApp(Frontend) setup including features like :
-* Create
+FullStacked provides a complete setup for a TypeScript full stack web application.
+It has all the Server(Backend) setup and the WebApp(Frontend) setup with features like :
+* ~~Create~~ Now in [`create-fullstacked`](https://github.com/cplepage/create-fullstacked) project
 * Run
 * Build
   * w/ Code Splitting
 * Watch
-  * w/ WebApp auto reload & Server auto restart
+  * w/ WebApp hot reload & Server auto restart
 * Test
   * w/ Code Coverage
 * Deploy
+* Backup/Restore
+
+## Usage
+### Remotely
+
+If you are looking to simply and quickly develop a web app, I strongly suggest to try [FullStacked IDE](https://ide.fullstacked.org).
+It is a web based IDE that wraps FullStacked usage with clean and efficient interfaces.
+
+### Locally (on your machine)
 
-## Getting Started
+#### Requirements
+* NodeJS `>= 16.x` [https://nodejs.org/](https://nodejs.org/)
+* Docker and Docker-Compose [https://www.docker.com/products/docker-desktop/](https://www.docker.com/products/docker-desktop/)
+
+#### Getting Started
 
 1. Create a folder where you will develop your awesome web app
 ```shell
 mkdir my-awesome-project
 cd my-awesome-project
 ```
-2. Init npm
+2. Init fullstacked with npm
 ```shell
 npm init fullstacked
 ```
@@ -42,34 +58,41 @@ npm start
 ```
 Open [http://localhost:8000](http://localhost:8000/) and start developing!
 
-## Commands
+#### Commands
 
-| command | uses |
-| --- | --- |
-| npm init fullstacked | Generate the default files `webapp.tsx` and `server.ts` files. |
-| npx fullstacked run | Run your web app. |
-| npx fullstacked build | Build your app in production mode to your `dist` folder. |
-| npx fullstacked watch | Rebuilds your app and hot reloads on changes. |
-| npx fullstacked test | Run tests throughout your app. |
-| npx fullstacked deploy | Ship a production build to a remote host to deploy your web app to the internet.|
+| command                 | uses                                                                             |
+|-------------------------|----------------------------------------------------------------------------------|
+| npm init fullstacked    | Generate the default starter files                                         |
+| npx fullstacked run     | Run your web app.                                                                |
+| npx fullstacked build   | Build your app.                                                                  |
+| npx fullstacked watch   | Rebuilds your app and hot reloads on changes.                                    |
+| npx fullstacked test    | Run tests throughout your app.                                                   |
+| npx fullstacked deploy  | Ship a production build to a remote host to deploy your web app to the internet. |
+| npx fullstacked backup  | Backup your data volumes from your app.                                          |
+| npx fullstacked restore | Restore your data volumes from your app.                                         |
 
-see flags and requirements in the [docs](https://fullstacked.org/docs/commands)
+see flags in the [docs](https://fullstacked.org/docs/commands)
 
 ## Motivation
-As many web developer, I have changed my toolset way too often. We wasted
-so much time on configs and figuring out how to deploy web apps. FullStacked aims to skip
-all the configuration phases to instead, start developing as quickly as possible!
+As many web developer, I have changed my toolset very often. We waste
+so much time on configs and figuring out how to build and deploy web apps. FullStacked aims to skip
+all the configuration phases to instead allow you to start developing as quickly as possible!
 
 I also really like the iterative approach, so I look forward to implementing ways to help with 
 sharing development environments for the purpose of testing and reviewing.
 
 ## Roadmap & Thoughts
 
 * Manage to create a simple and efficient way to test frontend component/class individually
+* ~~Switch to~~ Support [Deno](https://github.com/denoland/deno) and/or [bun](https://github.com/Jarred-Sumner/bun)  
+<br /> 
+
+> These are being implemented in [FullStacked IDE](https://ide.fullstacked.org)
+
+
 * Add integration with [PWABuilder](https://github.com/pwa-builder/PWABuilder) to generate iOS and Android App
 * <s>Switch nginx image for [nginx proxy manager](https://github.com/NginxProxyManager/nginx-proxy-manager) </s> 
 Will create our own interface with [Tabler](https://github.com/tabler/tabler)
-* Switch to [Deno](https://github.com/denoland/deno) or [bun](https://github.com/Jarred-Sumner/bun)
 * TypeScript Web Based IDE using [monaco editor](https://github.com/microsoft/monaco-editor)
   * Designed only for TypeScript projects, so it helps with all the main features
     * Typing

build.ts

@@ -15,8 +15,8 @@ import {getPackageJSON} from "./scripts/utils";
     const otherScripts = [
         path.resolve(__dirname, "./cli.ts"),
         path.resolve(__dirname, "./.mocharc.ts"),
-        path.resolve(__dirname, "./mocha-reporter.ts")
-    ]
+        path.resolve(__dirname, "./mocha-reporter.ts"),
+    ];
 
     const buildPromises: Promise<any>[] = scripts.concat(otherScripts).map(file => {
         return esbuild.build({

cli.ts

@@ -5,11 +5,10 @@ const scripts = {
     "build"     : "./scripts/build",
     "run"       : "./scripts/run",
     "watch"     : "./scripts/watch",
-    "deploy"    : "./scripts/deploy",
     "test"      : "./scripts/test",
+    "deploy"    : "./scripts/deploy",
     "backup"    : "./scripts/backup",
-    "restore"   : "./scripts/restore",
-    "certs"     : "./scripts/certs"
+    "restore"   : "./scripts/restore"
 };
 let script = "run"
 
@@ -44,8 +43,6 @@ const args = {
     "--watch-file=": value => config.watchFile = upgradeToArray(value),
     "--watch-dir=": value => config.watchDir = upgradeToArray(value),
     "--restored": () => config.restored = true,
-    "--domain=": value => config.domain = upgradeToArray(value),
-    "--email=": value => config.email = value,
     "--production": () => config.production = true
 };
 

d.ts

@@ -1,4 +1,6 @@
-declare type ENDPOINTS_GET = {}
-declare type ENDPOINTS_POST = {}
-declare type ENDPOINTS_PUT = {}
-declare type ENDPOINTS_DELETE = {}
+// to remove when @types/node gets updated
+declare module 'node:test'{
+    function before(fn: Function, options?: Object): void;
+    function after(fn: Function, options?: Object): void;
+    function afterEach(fs: Function, options?: Object): void;
+}

docker-compose.yml

@@ -2,7 +2,7 @@ version: '3.7'
 
 services:
   node:
-    image: node:16-alpine
+    image: node:18-alpine
     working_dir: /app
     command: node index
     restart: unless-stopped

docs/Backup.md

@@ -7,12 +7,12 @@ npx fullstacked backup
 Backup your docker compose defined volumes. You can do it locally or remotely.
 
 ### Flags
-| Flag                | Description                                                                                                                                |
-|---------------------|--------------------------------------------------------------------------------------------------------------------------------------------|
-| *--volume=*    | Define the volumes you want to backup. If voided, all volumes will be backed up.                                                           |
-| ---------------     | **For remote backing up, add your ssh credentials**                                                                                        |
-| --host=             | Your remote host instance address.<br />e.g., `--host=55.30.44.223` or `--host=example.com`                                                |
-| --user=             | Your ssh user name. e.g., `--user=ec2-user`                                                                                                |
-| --pass=             | Your ssh password. e.g., `--pass=foobar`<br />Use this or a private key file to authenticate on your remote host.                          |
-| --private-key=      | Your ssh private key. e.g., `--private-key=/Users/me/SSHPrivateKey.pem` <br /> Use this or a password to authenticate on your remote host. |
-| --app-dir=          | Where you want to put your app inside your remote host.<br />e.g.,`--app-dir=/home/ec2-user`                                               |
+| Flag                                            | Description                                                                                                                                           |
+|-------------------------------------------------|-------------------------------------------------------------------------------------------------------------------------------------------------------|
+| *--volume=*  &nbsp;                             | Define the volumes you want to backup. If voided, all volumes will be backed up.                                                                      |
+| ---------------                                 | **For remote backing up, add your ssh credentials**                                                                                                   |
+| --host=                                         | Your remote host instance address.<br />e.g., `--host=55.30.44.223` or `--host=example.com`                                                           |
+| --user=                                         | Your ssh user name. e.g., `--user=ec2-user`                                                                                                           |
+| --pass=                                         | Your ssh password. e.g., `--pass=foobar`<br />Use this or a private key file to authenticate on your remote host.                                     |
+| --private-key=  &nbsp;<br />--private-key-file= | Your ssh private key. e.g., <br />`--private-key-file=/Users/me/SSHPrivateKey.pem` <br /> Use this or a password to authenticate on your remote host. |
+| --app-dir=                                      | Where you want to put your app inside your remote host.<br />e.g.,`--app-dir=/home/ec2-user`                                                          |

docs/Building.md

@@ -4,10 +4,11 @@
 ```shell
 npx fullstacked build
 ```
-This produce a production build in a dist directory at your project's root.
+This produce a build in a `dist` directory at your project's root.
 
 ### Flags
-| Flag | Description |
-| --- | --- |
-| *--src=*   | Change the entry directory of your app. In other words, where both your `webapp.tsx` and `server.ts` are. Default is `process.cwd()`. |
-| *--out=*  | Change the location of the output dist directory. Default is `process.cwd()`. |
+| Flag                   | Description                                                                                                                           |
+|------------------------|---------------------------------------------------------------------------------------------------------------------------------------|
+| *--src=*          | Change the entry directory of your app. In other words, where both your `webapp.tsx` and `server.ts` are. Default is `process.cwd()`. |
+| *--out=*          | Change the location of the output dist directory. Default is `process.cwd()`.                                                         |
+| *--production*    | Build your app `production` mode.                                                                                                     |

docs/Commands.md

@@ -1,10 +1,12 @@
 # Commands
 
-| Command | Description |
-| --- | --- |
-| [npm init fullstacked](https://fullstacked.org/docs/creating) | Generate the default starter files. |
-| [npx fullstacked build](https://fullstacked.org/docs/building) | Build your app in production mode to your dist folder. |
-| [npx fullstacked run](https://fullstacked.org/docs/running) | Run your app. |
-| [npx fullstacked watch](https://fullstacked.org/docs/watching) | Rebuilds your app and hot reloads on changes. |
-| [npx fullstacked test](https://fullstacked.org/docs/testing) | Run tests throughout your app. |
+| Command                                                                  | Description                                                                      |
+|--------------------------------------------------------------------------|----------------------------------------------------------------------------------|
+| [npm init fullstacked](https://fullstacked.org/docs/creating)            | Generate the default starter files.                                              |
+| [npx fullstacked build](https://fullstacked.org/docs/building)           | Build your app.                                                                  |
+| [npx fullstacked run](https://fullstacked.org/docs/running)              | Run your app.                                                                    |
+| [npx fullstacked watch](https://fullstacked.org/docs/watching)           | Rebuilds your app and hot reloads on changes.                                    |
+| [npx fullstacked test](https://fullstacked.org/docs/testing)             | Run tests throughout your app.                                                   |
 | [npx fullstacked deploy](https://fullstacked.org/docs/deploying)    | Send a production build to a remote host to deploy your web app to the internet. |
+| [npx fullstacked backup](https://fullstacked.org/docs/backup)            | Backup your data volumes from your app.                                          |
+| [npx fullstacked restore](https://fullstacked.org/docs/restore)          | Restore your data volumes from your app.                                         |

docs/Deploying.md

@@ -16,10 +16,11 @@ npx fullstacked deploy
 ```
 
 ### Flags
-| Flag | Description |
-| --- | --- |
-| --host= | Your remote host instance address.<br />e.g., `--host=55.30.44.223` or `--host=example.com` |
-| --user= | Your ssh user name. e.g., `--user=ec2-user` |
-| --pass= | Your ssh password. e.g., `--pass=foobar`<br />Use this or a private key file to authenticate on your remote host. |
-| --private-key= | Your ssh private key. e.g., `--private-key=/Users/me/SSHPrivateKey.pem` <br /> Use this or a password to authenticate on your remote host. |
-| --app-dir= | Where you want to put your app inside your remote host.<br />e.g.,`--app-dir=/home/ec2-user` |
+| Flag                                           | Description                                                                                                                                     |
+|------------------------------------------------|-------------------------------------------------------------------------------------------------------------------------------------------------|
+| --host=                                        | Your remote host instance address.<br />e.g., `--host=55.30.44.223` or `--host=example.com`                                                     |
+| --user=                                        | Your ssh user name. e.g., `--user=ec2-user`                                                                                                     |
+| --pass=                                        | Your ssh password. e.g., `--pass=foobar`<br />Use this or a private key file to authenticate on your remote host.                               |
+| --private-key=  &nbsp;<br />--private-key-file= | Your ssh private key. e.g., `--private-key-file=/Users/me/SSHPrivateKey.pem` <br /> Use this or a password to authenticate on your remote host. |
+| --app-dir=                                     | Where you want to put your app inside your remote host.<br />e.g.,`--app-dir=/home/ec2-user`                                                    |
+| --no-https                                     | Skip certificate setup and listen only to port `:80` on remote server                                                                             |

docs/Requirements.md

@@ -1,6 +1,13 @@
 # Requirements
 
-* NodeJS `>= 14.14`
+## Remote Development
+
+If you are looking to simply develop a web app, I strongly suggest you tu try [FullStacked IDE](https://ide.fullstacked.org).
+It is a web based IDE that wraps FullStacked usage with clean and efficient interfaces!
+
+## Local Development
+
+* NodeJS `>= 16.x`
 * Docker and Docker-Compose
 
 ### Install Guide