Detect HTML color group using K Nearest Neighbours as displayed in HTML Color Groups

Tensorflow function

Algorithm tensor can be found in backend/prediction.ipynb.

Installation

Follow guide Install TensorFlow with pip

Web app

Web app for above algorithm is developed with gRPC backend and svelte frontend and is driven via envoy proxy.

Software requirements

• python
• docker
• pip
• protoc
• node.js

Setup generation

Install backend dependancies

pip install grpcio-tools
pip install tensorflow

Generate python proto code

python -m grpc_tools.protoc -I./protos --python_out=./backend --grpc_python_out=./backend ./protos/colors.proto

Generate javascript proto code

protoc -I=protos colors.proto --js_out=import_style=commonjs:frontend/lib

protoc -I=protos colors.proto --grpc-web_out=import_style=commonjs,mode=grpcwebtext:frontend/lib

Build frontend

cd frontend
yarn install
yarn build

# For building client code, not using any frameworks
# Frameworks like react, svelte can use proto buffer javascript files directly
# yarn webpack ./client.js --output-path ./public/ --mode development

Check if tcp connection is open

nc -vz 0.0.0.0 50051

Start server

docker-compose up --build --detach

This will start python gRPC server and envoy proxy.

cd frontend
yarn dev

For starting frontend development server.