RecipeRadar Frontend

The RecipeRadar Frontend is a recipe search and meal planning application.

It's distributed as a Progressive Web Application built using webpack.

The application is intended to follow local-first principles, but we have some work to do before we fully achieve that.

Source code for the application is divided into four JavaScript components:

• src/app - RecipeRadar application functionality
• src/diagnostics - service status and data investigation tools
• src/feedback - in-application feedback form based on feedback.js
• src/sw - application service worker

The following resources are useful guides for designing ingredient and recipe rendering:

• The Metric Kitchen - Style Guide
• Wikipedia - Cooking weights and measures

Install dependencies

Make sure to follow the RecipeRadar infrastructure setup to ensure all cluster dependencies are available in your environment.

Development

To install development tools and run linting and tests locally, execute the following commands:

$ yarn install
$ make lint tests

Local Deployment

To deploy the service to the local infrastructure environment, execute the following commands:

$ make
$ make deploy

If you have configured and run haproxy per the infrastructure setup instructions, you should be able to run the application by navigating to http://localhost in a web browser.

Internationalization

To gather the latest internationalization (i18n) resource strings from the application, execute the following commands:

$ npx i18next-scanner

Integrity

To calculate a base64-encoded SHA512 digest of the index.html file for integrity-check purposes, build the application (by running make), and then run the following command:

$ cat public/index.html | openssl dgst -sha512 -binary | base64 --wrap 0

This should produce a single line of output containing eighty-eight ASCII characters, and this should match the DNS B text record found for the application's deployment domain.