Setup

Setup Frontend only appplications

Please change current folder:cd frontend

Create React App:

  1. Run yarn install

This will install both run-time project dependencies and developer tools listed in package.json file.

  1. Run yarn start

Runs the app in the development mode. Open http://localhost:3000 to view it in the browser. Whenever you modify any of the source files inside the /src folder, the module bundler (Webpack) will recompile the app on the fly and refresh all the connected browsers.

  1. Run 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. The build is minified and the filenames include the hashes. Your app is ready to be deployed!

NextJS:

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

npm run dev

or

yarn dev

Open http://localhost:3000 with your browser to see the result. You can start editing the page by modifying pages/index.js. The page auto-updates as you edit the file. API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.js.

The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.

Learn More

To learn more about Next.js, take a look at the following resources:

You can check out the Next.js GitHub repository - your feedback and contributions are welcome! Check out our Next.js deployment documentation for more details.

Standard Vue App:

To start the project:

Install dependencies via yarn

yarn install

Run development server

yarn run serve

NuxtJS:

To start the project:

Install dependencies

yarn install

Serve with hot reload at localhost:3000

yarn dev

Build for production and launch server:

yarn build

yarn start

Generate static project:

yarn generate

For detailed explanation on how things work, check out the documentation.

Standard Angular App:

To start the project:

Install dependencies via yarn:

yarn install

Run development server:

yarn start

Setup CRUD Applications

Frontend for CRUD:

Please change current folder:cd frontend

React:

  1. Run yarn install

This will install both run-time project dependencies and developer tools listed in package.json file.

  1. Run yarn start

Runs the app in the development mode.

Open http://localhost:3000 to view it in the browser. Whenever you modify any of the source files inside the /src folder, the module bundler (Webpack) will recompile the app on the fly and refresh all the connected browsers.

  1. Run 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. The build is minified and the filenames include the hashes. Your app is ready to be deployed!

Vue:

Install dependencies via yarn:

yarn install

Run development server:

yarn start

Angular:

Install dependencies via yarn:

yarn install

Run development server:

yarn start

Backend for CRUD:

Please change current folder: cd backend

Adjust local db MySQL:

MacOS:

  1. Download MySQL database server: (https://dev.mysql.com/downloads/mysql/)

  2. Install the package.

  3. Afterwards, in the terminal move to the next directory:

cd backend/src/db/db.config.js

  1. Change development.password to that you set for the root on MySQL installation process.

Windows:

  1. Download MySQL database server from the following link: (http://dev.mysql.com/downloads/installer/).

  2. Install the package and select Server Machine as the configuration type.

Ubuntu:

  1. sudo apt update

  2. sudo apt install mysql-server

Additional commands:

Command Description
yarn build Compile typescript files into dist folder
yarn start Run compiled code from dist folder
yarn db:create Create database
yarn db:drop Drop database schema

Adjust local db Postgres:

  1. Install postgres:

macOS:

brew install postgres

if you don’t have ‘brew‘ please install it (https://brew.sh) and repeat step brew install postgres.

Ubuntu:

sudo apt update

sudo apt install postgresql postgresql-contrib

  1. Create db and admin user:

Before run and test connection, make sure you have created a database as described in the above configuration. You can use the psql command to create a user and database.

psql postgres --u postgres

Next, type this command for creating a new user with password then give access for creating the database.

postgres-# CREATE ROLE admin WITH LOGIN PASSWORD 'admin_pass';

postgres-# ALTER ROLE admin CREATEDB;

Quit psql then log in again using the new user that previously created.

postgres-# \q

psql postgres -U admin

Type this command to creating a new database.

postgres=> CREATE DATABASE db_{your_project_name};

Then give that new user privileges to the new database then quit the psql.

postgres=> GRANT ALL PRIVILEGES ON DATABASE db_{your_project_name} TO admin;

postgres=> \q

NodeJS(TypeORM)

Usage

Start local development with command below:

yarn dev

To run your code on production server, run several commands:

  • Compile TS code

yarn build

  • Run compiled code in production mode

NODE_ENV=production yarn start

NodeJS

Create database:

yarn db:create

Start production build:

yarn start

Laravel:

First, run the development server:

MacOS:

brew install composer

if you don’t have ‘brew‘ please install it (https://brew.sh) and repeat step brew install composer.

composer install

Ubuntu:

composer install

Input database|mail config to ".env"

php artisan key:generate

php artisan jwt:secret

php artisan migrate

php artisan db:seed

php artisan serve --host=localhost --port=8080

To start the project with Docker:

Description:

The project contains the docker folder and the Dockerfile. The Dockerfile is used to Deploy the project to Google Cloud.

The docker folder contains a couple of helper scripts:

  • docker-compose.yml (all our services: web, backend, db are described here)

  • start-backend.sh (starts backend, but only after the database)

  • wait-for-it.sh (imported from https://github.com/vishnubob/wait-for-it)

To avoid breaking the application, we recommend you don't edit the following files: everything that includes the docker folder and the Dockerfile.

Run services:

  1. Install docker compose (https://docs.docker.com/compose/install/)

  2. Move to docker folder. All next steps should be done from this folder.
    cd docker

  3. Make executables from wait-for-it.sh and start-backend.sh:
    chmod +x start-backend.sh && chmod +x wait-for-it.sh

  4. Download dependend projects for services.

  5. Review the docker-compose.yml file. Make sure that all services have Dockerfiles. Only db service doesn't require a Dockerfile.

  6. Make sure you have needed ports (see them in ports) available on your local machine.

  7. Start services:
    7.1. With an empty database rm -rf data && docker-compose up
    7.2. With a stored (from previus runs) database data docker-compose up

  8. Check http://localhost:3000

  9. Stop services:
    9.1. Just press Ctr+C


← Working with platform                                                   Debugging →