v0.1 - release (#51)

* init strapi

* implemented initial content types

* Organizing readme (#1)

* updated readme

* added git flow chart

* fixed spelling err

* Updated README and added yarn workspaces

* Created React App and added lib functions

* WIP: Ardulib not loading object from DOM

* Fixed Blockly.Inject being called before component renders

* Hotfix: Fixes getJS button crashing app

* removed old topic and types

* added complexity type, reassigned relationships, and edited field settings

* init server readme

* update er digram link

* migrated from sqlite3 to mysql running in docker

* init Dockerfile for production api image

* wrapped project in docker compose, defined container for api, db, and compile

* mv .dockerignore to server folder

* scaffolding: server -> cms

* updated main readme scaffolding and development sections

* rm <br/>

* update cms package

* init compile

* cleanup

* un-md Dockerfile

* Removed yarn workspace functionality and documentation

* gitignore packages

* run the compile service on port 8080

* build compile image in compose

* set dev db host via env

* updated project readme

* added scripts for running compile and cms independently

* fixed development link in cms and compile readmes

* actually fixed the links

* testing heroku deploy

* yml vs yaml

* service type for heroku is web

* must be a string too!

* WIP: Client not yet accessible from localhost

* added entrypoint to client dockerfile and remapped volume/ports

* added client development config for cms and compile host names

* added client to main readme development section

* Update README.md

* Setup basic page routing

* Passing activities to workspaces based on selection

* WIP: Weird css bug

* remove react from docker-compose

* fixed react import issue

* renamed containers created with compose

* updated to latest beta of strapi and removed sqlite3 dependency

* use mysql for all database environments

* host helper for getting cms and compile hosts

* add client homepage for build

* root docker file builds client and cms and packages them together

* host helper just saves consts

* use postgres for production

* Basic dynamic block rendering

* database connection settings

* don't use localhost

* Added example model

* Final cleanup

* renmae host hellper

* fix hosts import

* dep update cms

* Rename Hosts.js to hosts.js

* use postgres

* updated documentation

* + documentation improvements

* init app.json

* added postgresql addon

* as and options for app.json

* use relative path for cms api calls

* use localhost for development

* Cleaned up warning messages, renamed app in manifest

* Solves issue #18 - React builds but is not usable

#18

* Updated client README

* Cleaning up documentation

* Changed client to use hosts.js in place of deployment config files

* Updated git flow documentation

* dakota made me do this :(

* Setting correct paths for blockly libs

* Added button hover information

* created a middleware to serve the frontend w/ react router

* updated documentation

* public/frontend

* fixed json parsing err on cms readme

* update read me

* dep

* added public url to build process for cleaner client dev

* fixed host resolution for cms @home view

* git ignore public/frontend

* include frontend folder

* fix prod app bundling

* Changed root routing from /Home to /

* topics now has activities

* Changed dependency use to imported script

* Fixed CORS issue with strapi query during development

* Cleaning up console.log statements for dev merge


Fixing Merge conflict

* Changed path to "/workspace" and fixed warnings

* fixed build-frontend script err

* added the .env file to the client setup documentation

* updated root documentation to follow client setup

* add localhost:1337 to development cors

* removed client .env and added cross-env for build-frontend script

* block category belongs to many blocks

* updated admin build

* activities are only related to their blocks now and return a custom toolbox

* remove block category definition

* blocks now have descriptions not definitions

* enable dev db to build from an sql file

* remove .cache

* cross-env is not good

* display nested activity details

* Refactored activities to pull from updated API

* Moved some js functionality to helper file

* added type to topic find

* restored activities find controller and created seperate route/hander for activities toolbox

* created dataaccess layer to simplify api calls

* implemented new api in client and added dataaccess calls

* condensed dataaccess files

* moved hosts to dataaccess

* fix compile preflight err

* bump

* fixed missing toolbox on re-render

* Update README.md

* Update README.md

* Formatting dump

* clean up, clean up

* update workspace useEffect for render err and sensitivety

* added alert for arduino code

* Abstraction is trash and so are you

* wrote an init script that uses pg_restore rather than importing a .sql

* updated documentation for adding the dump to scripts

* script formating

* All .sh files now keep LF line endings when pulled to windows

* Updated documentation for /admin not beuilding

* fixed comment in .gitattributes

Co-authored-by: nionata <[email protected]>
Co-authored-by: Nicholas Ionata <[email protected]>
Co-authored-by: nionata <[email protected]>

.dockerignore

@@ -0,0 +1,7 @@
+# Directories
+*/node_modules
+cms/.tmp
+
+# Data
+cms/er_diagram.png
+cms/strapi.sql

.gitattributes

@@ -0,0 +1,2 @@
+# set all bash files to keep lf endings
+*.sh text eol=lf

.gitignore

@@ -0,0 +1,31 @@
+#configuration ignores
+.idea/
+.vscode/
+
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Environment
+.env
+*.sql
+.cache/
+*.dump
+
+# Packages
+*.zip
+*.tar
+*.gz
+
+# OS
+.DS_Store
+.tmp
+
+# node
+node_modules/
+build/
+cms/public/frontend/*
+!cms/public/frontend/.gitkeep

Dockerfile

@@ -0,0 +1,35 @@
+FROM strapi/base
+
+WORKDIR /usr/src/app/client
+
+# Install client dependencies
+COPY ./client/package.json .
+COPY ./client/yarn.lock .
+RUN yarn install
+
+# Build client
+COPY ./client .
+RUN PUBLIC_URL=/frontend yarn build
+
+WORKDIR /usr/src/app
+
+# Install app dependencies
+COPY ./cms/package.json .
+COPY ./cms/yarn.lock .
+RUN yarn install
+
+# Bundle app source
+COPY ./cms .
+RUN mv ./client/build/* ./public/frontend && rm -r ./client
+
+# Set the env to prod for build
+ENV NODE_ENV production
+
+# Build admin
+RUN yarn build
+
+# Port mapping
+EXPOSE 1337
+
+# Run when the container is started
+CMD yarn start

README.md

@@ -1,7 +1,140 @@
 # STEM+C
 
-## server
-The backend is built ontop of [Strapi](https://strapi.io/), a headless CMS. It will probably connect to MySQL and a number of other AWS services for prprocessing and logging
+> Cloud-based programming interface
+
+<br/>
+
+## Scaffolds
+
+### `/`  
+
+#### `client/` 
+[Client](/client#client) is the frontend of the application. It is powered by [React](https://reactjs.org/) and [Blockly](https://developers.google.com/blockly).
+
+#### `cms/`
+
+[Cms](/cms#cms) is the REST API and admin portal that powers the backend. It is powered by [Node](https://nodejs.org/en/) and [Strapi]().
+
+#### `compile/`
+
+  [Compile](/compile#compile) is an arduino compiler service. It is an unofficial fork of [Chromeduino](https://github.com/spaceneedle/Chromeduino).
+
+<br/>
+
+## Environments
+
+> The project is divided into three conceptual environments.
+
+### Development
+This project's dependencies are managed through [yarn](https://classic.yarnpkg.com/en/docs/install/#mac-stable). This effectively replaces npm and should be used in place of npm everywhere except sc-compile-dev.
+The following are the available scripts we can use with the client and server: 
+
+#### Structure
+
+The development environment is composed of four servers. The first one is run with the [Create React App](https://create-react-app.dev/docs/getting-started/) dev server. The later three are containerized with docker and run with [docker compose](https://docs.docker.com/compose/).
+
+* `stem-c-client-dev` - localhost:3000
+* `stem-c-cms-dev` - localhost:1337
+* `stem-c-compile-dev` - localhost:8080
+* `stem-c-db-dev` - localhost:5432
+
+#### Running
+
+`stem-c-client-dev`
+
+1. Follow the [client](/client#setup) setup
+2. Run `yarn start` from `/client`
+
+`stem-c-cms-dev`, `stem-c-compile-dev`, and `stem-c-db-dev`
+
+1. Install [docker](https://docs.docker.com/get-docker/)
+
+   > If you do not meet these [requirements](https://docs.docker.com/toolbox/toolbox_install_windows/) docker desktop will not initialize properly. There are some unofficial modifications, however, we recommend installing the docker [toolbox](https://docs.docker.com/toolbox/toolbox_install_windows/) 
+
+2. Add **dev_db.dump** to `scripts/`
+
+   > Pinned in the #dev channel
+
+3. Run `docker-compose up` from `/`
+
+   > Grant permission to the **scripts** and **cms** directories if you are prompted
+
+### Staging
+
+#### Structure
+
+The staging environment is deployed on Heroku. It is composed of one app running a Heroku Postgres instance and a web container.
+
+* `stem-c-staging` - [stem-c-staging.herokuapp.com](https://stem-c-staging.herokuapp.com/)
+  * The web container attached to this Heroku app runs `cms` and serves static `client` build files
+  * The Heroku Postgres instance is attached as an add-on
+
+#### Running
+
+`stem-c-staging` is automatically built from the latest commits to `release`. Heroku runs the container orchestration from there.
+
+### Production
+
+#### Structure
+
+The production environment is deployed on Heroku. It is composed of two apps. One is running a Heroku Postgres instance and a web container and the other is running just a web container.
+
+* `stem-c` - [stem-c.herokuapp.com](https://stem-c.herokuapp.com/)
+  * The web container attached to this Heroku app runs `cms` and serves static `client` build files
+  * The Heroku Postgres instance is attached as an add-on
+* `stem-c-compile` - [stem-c-compile.herokuapp.com](https://stem-c-compile.herokuapp.com/)
+  * The web container attached to this Heroku app runs `compile`
+
+#### Running
+
+`stem-c` is automatically built from the latest commits to `master`. Heroku runs the container orchestration from there.
+
+`stem-c-compile` is manually deployed through the [Container Registry](https://devcenter.heroku.com/articles/container-registry-and-runtime) and [Heroku CLI](https://devcenter.heroku.com/articles/heroku-cli).
+
+1. Install [Heroku CLI](https://devcenter.heroku.com/articles/heroku-cli)
+2. Run the following commands sequentially
+
+```powershell
+heroku login
+heroku git:remote -a stem-c-compile
+heroku container:login
+heroku container:push web
+heroku container:release web
+```
+
+<br/>
+
+## Contributing
+
+### Git Flow 
+
+> We will follow this git flow for the most part — instead of individual release branches, we will have one to streamline staging deployment 
+
+![Git Flow](https://nvie.com/img/[email protected])
+
+### Branches
+
+#### Protected
+
+> Locked for direct commits — all commits must be made from a non-protected branch and submitted via a pull request with one approving review
+
+- **master** - Production application
+
+#### Non-protected
+
+> Commits can be made directly to the branch
+
+- **release** - Staging application
+- **develop** - Working version of the application
+- **feature/<`scaffold`>-<`feature-name`>** - Based off of develop
+  - ex. **feature/cms-strapi**
+- **hotfix/<`scaffold`>-<`fix-name`>** - Based off of master
+  - ex. **hotfix/client-cors**
+
+### Pull Requests
+
+Before submitting a pull request, merge the target branch into the working branch to resolve any merge conflicts. Include a description of the changes made.
+
+- PRs to **master** should squash and merge
+- PRs to all other branches should create a merge commit
 
-## client
-The frontend is power by the blockly framework and probably react

app.json

@@ -0,0 +1,11 @@
+{
+    "name": "STEM-C",
+    "description": "Web Blockly IDE for Arduino",
+    "repository": "https://github.com/STEM-C/STEM-C",
+    "addons": [
+        {
+          "plan": "heroku-postgresql",
+          "as": "DATABASE"
+        }
+    ]
+  }

client/README.md

@@ -1,2 +1,44 @@
-## Client
-[Blockly](https://developers.google.com/blockly)
+# Client
+
+> [React.js](https://reactjs.org/) application which represents the entire browser-side client. File structure is standard for a [create-react-app](https://github.com/facebook/create-react-app) application with some minor changes. Any component which represents an entire page is categorized under the [views](/client/src/views) folder.
+
+<br />
+
+## Setup
+
+1. Install [Node](https://nodejs.org/en/) and [Yarn](https://classic.yarnpkg.com/en/docs/install#windows-stable)
+2. Run `yarn` to install project dependencies
+
+<br />
+
+## Routing
+
+All client routes must be registered in the cms frontend middleware to ensure they are handled by react. Additional information and implementation instructions are in the [cms](/cms#static-assets) documentation.
+
+<br/>
+
+## Available Scripts
+
+In the project directory, you can run:
+
+### `yarn start`
+
+Runs the app in the development mode.
+Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
+
+### `yarn start-build`
+
+Stars a basic http server (using [http-server](https://www.npmjs.com/package/http-server)) which serves the build folder on [http://localhost:3000](http://localhost:3000) .
+
+### `yarn build`
+
+Builds the app for production to the `build` folder.
+It correctly bundles React in production mode and optimizes the build for the best performance.
+
+<br />
+
+### Relevant notes
+
+Section on fixing issue where yarn build does not minify: https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify
+
+Section on code splitting, worth considering at some point: https://facebook.github.io/create-react-app/docs/code-splitting

client/package.json

@@ -0,0 +1,38 @@
+{
+  "name": "client",
+  "version": "0.1.0",
+  "private": true,
+  "dependencies": {
+    "@testing-library/jest-dom": "^4.2.4",
+    "@testing-library/react": "^9.3.2",
+    "@testing-library/user-event": "^7.1.2",
+    "axios": "^0.19.2",
+    "cross-env": "^7.0.2",
+    "http-server": "^0.12.3",
+    "react": "^16.13.1",
+    "react-dom": "^16.13.1",
+    "react-router-dom": "^5.1.2",
+    "react-scripts": "3.4.1"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "start-build": "http-server build -p 3000",
+    "build": "react-scripts build",
+    "eject": "react-scripts eject"
+  },
+  "eslintConfig": {
+    "extends": "react-app"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}

client/public/index.html

@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8"/>
+    <link rel="icon" href="./favicon.ico"/>
+    <meta name="viewport" content="width=device-width, initial-scale=1"/>
+    <meta name="theme-color" content="#000000"/>
+    <meta
+            name="description"
+            content="Web site created using create-react-app"
+    />
+    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png"/>
+    <!--
+      manifest.json provides metadata used when your web app is installed on a
+      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
+    -->
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json"/>
+    <!--
+      Notice the use of %PUBLIC_URL% in the tags above.
+      It will be replaced with the URL of the `public` folder during the build.
+      Only files inside the `public` folder can be referenced from the HTML.
+
+      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
+      work correctly both with client-side routing and a non-root public URL.
+      Learn how to configure a non-root public URL by running `npm run build`.
+    -->
+    <title>STEM+C</title>
+
+    <!--libraries for style-->
+    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.9.0/css/all.css">
+
+    <!-- libraries for blockly -->
+    <script src="%PUBLIC_URL%/lib/blockly_compressed.js"></script>
+    <script src="%PUBLIC_URL%/lib/blocks_compressed.js"></script>
+    <script src="%PUBLIC_URL%/lib/en.js"></script>
+
+    <!-- here are the libraries to get code from the blocks -->
+    <script src="%PUBLIC_URL%/lib/arduino_compressed.js"></script>
+    <script src="%PUBLIC_URL%/lib/javascript_compressed.js"></script>
+
+    <script src="%PUBLIC_URL%/lib/avrgirl-arduino.global.js"></script>
+
+</head>
+<body>
+<noscript>You need to enable JavaScript to run this app.</noscript>
+<div id="root"></div>
+<!--
+  This HTML file is a template.
+  If you open it directly in the browser, you will see an empty page.
+
+  You can add webfonts, meta tags, or analytics to this file.
+  The build step will place the bundled scripts into the <body> tag.
+
+  To begin the development, run `npm start` or `yarn start`.
+  To create a production bundle, use `npm run build` or `yarn build`.
+-->
+</body>
+</html>