taitounited / full-stack-template Goto Github PK

TODO:

• Update react-admin library to >= 2.9.0 (see #78).
• Working blog posts example

• If COMMON_LOG_FORMAT is 'text', still use the StackdriverStream, but print in human readable format (e.g. with this https://github.com/benbria/bunyan-debug-stream). On local development the human readable format is currently achieved with | bunyan -l debug on server/package.json.
• Prune useless logging (already done?)
• All API validation errors should leave an informative message to log (see issue #7) (already done?)
• Show db connection pool status on log in addition to request latency

Implement some python backend(s) in alternatives/:

• Flask with uWSGI: alternatives/server-flask
• Bottle with uWSGI: alternatives/server-bottle (use the existing server-flask as an example).
• FastAPI (or plain starlette): alternatives/server-fastapi
• (optional: Django with uWSGI: alternatives/server-django )
• (optional: Tornado: alternatives/server-tornado )

Each stack component must provide at least the following. Copy these from server/ and modify.

• Dockerfile: Dockerfile for local development
• Dockerfile.build: Dockerfile for building docker images for server environments. It should contain a build stage that is named builder.
• test-suites: List of api/e2e test suites.
• test.sh: Shell script that runs a test suite or a single test based on given parameters.
• Good conventions (folder structure, file naming, etc)
• Working blog example as implemented in full-stack-template.
• README.md: Instructions for configuring the stack component for a project (if instructions are required).

Additional server requirements - Mandatory:

• Health check: Public endpoint /healthz should check that the server container is running ok. Return HTTP 200 response if everything is ok.
• Uptime check: Public endpoint /uptimez should check that the server container is running ok, and all external systems (e.g. database) are also reachable. Return HTTP 200 response if everything is ok.
• Logging formats: text logging format for local development and stackdriver logging format (json) for server environments. See log.util.js as an example. NOTE: Do not log all request headers, as they might contain secrets.

Additional server requirements - Optional:

• Config values for clients: Public endpoint /config should return such config values that are required by clients (e.g. web UI). NOTE: Do not return any secrets or confidential configs!
• Latency logging: Log latency of each response. See log.util.js as an example.
• DB pool status logging: pool size, number of reserved connections.
• Error ids: For each system error, return a generated error id in the response that can be used to find the error details from log.
• Sentry integration: See sentry.setup.js as an example.

There are some breaking changes, I think. Upgrade semantic-release of all these projects:

• server-template
• wordpress-template
• taito-cli

Current implementation is described below:

Once changes are merged to master, taito-cli semantic plugin sets the GH_TOKEN environment variable and runs:

• npm run release-pre:prod before build to determine new version number from commit messages.
• npm run release-post:prod after build to tag git repository and publish release notes.

NOTE: merge must include at least one feat or fix commit or otherwise npm run release-pre:prod will fail.

• Replace Mocha with Jest on server?
• Unit tests (formatters.unit.ts suffices for server, add also one unit test example for client)
• API tests (dummy posts test already exists -> improve it)
• Snapshot API tests with Jest
• e2e tests (cypress)

See stack configuration.

Should be implemented the same way as flow support:

• Provide example tsconfigs and other ts settings that are marked with NOTE: for typescript.
• Provide a script that renames all js files to ts. At the beginning tslint settings should allow omitting any so that this is possible. The settings can be changed later.
• Provide some of the example implementations in ts format with typings. For example, one service implementation and one page with react components.

Related issues: #19 #20

The "/DIR/node_modules" volumes of docker-compose.yaml do not work on Linux correctly if the node_modules directory does not exist on host when starting up docker-compose.

Somehow make sure that ./DIR/node_modules exists on host when starting a container. Perhaps check if node_modules is empty or does not exist on start (CMD command of Dockerfile), and print some error message.

values.yaml:

client:
  enabled: false
  name: client

helm.yaml:

client:
  enabled: true # client

Modify taito template create script.

TaitoUnited/taito-cli#50

Optimize webpack development compile time, if there is something to optimize. Related to issue #60.

• Code splitting and hot realoading in issue #34.
• Check this (some old link, not relevant?): webpack/webpack-dev-server#1503

• Container names according to helm convention. Related to TaitoUnited/taito-cli#42
• {{ }} formatting

Related to #6

https://reactjs.org/blog/2018/03/29/react-v-16-3.html

Related to issue #22 (commit message validation).

For example, replace ##17 with TaitoUnited/myproject-kanban#17 by defining commit message replace rules in package.json.
This way we can easily reference issues that exist in another git repository.

Add implementation to all these projects:

• full-stack-template
• website-template
• wordpress-template

Swagger + swagger documentation tools might be a bit overkill for small projects. It also brings about some constraints and therefore might not work very well with HTTP/2 push and hypermedia (links), and does not support GraphQL.

A more lightweight approach would be:

• joi or json schema for REST API validation + some tool that generates markdown from schemas? (Popular koa plugins exists for these? Or should be review the new fastify framework that provides these out-of-the-box?)
• GraphQL schemas for GraphQL validation + some tool that generates markdown from schemas?
• Markdown files + static site generator for documentation: gatsby or slate. Slate seems nice but people seem to be moving from slate to more multi-purpose static-site-generators like gatsby.

Markdown files should be placed at docs/ and static site generator implementation is already at www/.

asciidoc might be a better format for technical documentation than markdown. However, markdown is more familiar for people and probably good enough for most cases. Perhaps we can support both.

Or just use automatic vertical pod autoscaling?
https://cloud.google.com/kubernetes-engine/docs/how-to/vertical-pod-autoscaling

https://kubernetes.github.io/ingress-nginx/user-guide/nginx-configuration/annotations/

Also make it possible to add additional annotations in helm.yaml file.

UPDATE: the full-stack helm template is located at taito-charts.

In addition, for projects that use basic auth in production, change the password and move it to 1password.

Implement a proper blog example that demonstates different technologies.

Media:

• Add/remove media files (demonstrates file upload/download and storage buckets)
• Generate thumbnails and previews for media files (demonstrates background jobs implemented as Kubernetes jobs)
• Select a media file for blog post

Posts:

• Show new blog posts automatically in real-time (demonstrates websockets and postgresql notifications)
• Generate blog post PDF using a server-side pdf template (demonstrates POD)
• Generate blog post PDF using react web ui as a template (e.g. headless chrome or some other mechanism)
• Alternative GraphQL example (demonstrates GraphQL)
• Also some cron job example? (demonstrates cron jobs)

From browser console: Warning: Material-UI: you are using the deprecated typography variants that will be removed in the next major release. Please read the migration guide under https://material-ui.com/style/typography#migration-to-typography-v2

Support for building and releasing microservices separately within the same git repository.

https://github.com/Updater/semantic-release-monorepo

Perhaps we can use events for this: http://vitaly-t.github.io/pg-promise/global.html#event:receive

Or perhaps it is better not to use automatic conversion?

Related to TaitoUnited/taito-cli#62

Also support multiple values for one kube secret (e.g. key, secret)

Also rename db build secret to mgr.

PROJECT-(ENV)-TYPE-PURPOSE:
- server-template-db-app
- server-template-db-build
- server-template-storage-gateway
- server-template-gcloud-account
- server-template-jwt-secret
- server-template-admin-password
- server-template-user-password

Implement vue client in alternatives/client-vue.

Requirements:

Copy these from server-template/client and modify if required:

• Dockerfile: Dockerfile for local development
• Dockerfile.build: Dockerfile for building docker images for server environments. It should contain a build stage that is named builder.
• test-suites: List of api/e2e test suites.
• test.sh: Shell script that runs a test suite or a single test based on given parameters.
• cypress.json and test/: working cypress test example.
• README.md: Instructions on how to initialize new vue project with vue-cli.

Optional example implementation:

• Working blog example as implemented in server-template/client.
• Sentry integration: See logger.utils.js as an example.

Currently yarn does not provide anything extra that we would need, but this might change with issue #18.

Move this issue to npm-template?

Stackdriver logs: taito open logs:dev

Command that runs minio: https://github.com/TaitoUnited/server-template/blob/dev/scripts/helm.yaml#L119

NOTE: These examples are meant to be reusable, and thus must be of good quality (requires senior developer supervision).

Including validation, error handling, logging and API document generation. And preliminary authentication for development purposes.

Related to #7 and #13.

Once React with hooks support is out, we should the following:

• Convert React components to functions and use hooks
• Replace redux with hooks?
• Should we use create-react-app or not? Good for quick start but not that versatile as it hides webpack?
• Use service worker
• Make hot module replacement work again
• Code splitting (nowadays React API provides support for code splitting?)
• Use fetch instead of axios?
• Reduce bundle size by removing unnecessary libs like lodash. (Redux uses lodash also? Does removing lodash really help?)
• Sanitize eslint rules (use plugin recommendation settings instead of custom rules)

In the current version it takes about 15s to load defaults.css and image.jpg to browser. This problem does not exists on a project that was created based on the template 5th of November 2018.

I already tried upgrading some libs, and also downgrading node.js and all libs but it didn't seem to resolve the issue.

Currently validate-commit-msg library is being used for validating all commit messages. It is deprecated and therefore should be replaced with CommitLint.

Do the same for all of these:

• server-template
• wordpress-template
• taito-cli

NOTE: You might need to remove old git hooks set by validate-commit-msg. Or just take a fresh clone of the git repository and do not run taito install until you have removed validate-commit-msg and husky

Also use 'unless-stopped' restart policy to prevent starting on docker boot?

For creating storage buckets, etc.

Implement vue admin in alternatives/admin-vue. See also #27.

Implement more stack components in server-template-alt if you have nothing else to do. Priority order:

• client-gatsby
• worker-go
• worker-python
• client-angular
• server-laravel
• other

Related to issues #26, #27 and #42.