anatoly-scherbakov / geopatterns-demo Goto Github PK

Based on issue #3, we now need to actually save the PNG file onto S3 bucket and ensure the file indeed exists there. The boto3 library will be necessary for that.

    from mypy_boto3_s3 import ServiceResource as S3

    s3: S3 = boto3.Resource('s3')
    bucket = s3.Bucket(settings.S3_BUCKET_NAME)
    bucket.Object('...').upload_file(...)

Right now, there is a little discrepancy in the functioning of the app.

1. The app has a https://dqrura49d0.execute-api.us-east-1.amazonaws.com/random-phrase endpoint, which retruns a random phrase in Latin,
2. but the front end is not using that endpoint — instead it calls https://fish-text.ru

That

• We have built a piece of functionality with loremipsum that we're not using;
• fish-text.ru provides texts in Russian. That's ok but a project like this — an educational project for beginners in Python & cloud computing — is international. That's why we're writing all our comments, pull requests, and issues in English: thus, whoever wants from any part of the world — be it Russia, Europe, China, India, Brazil or Iceland — may come and join us in writing code.

That being said, please switch the front end to use our own random-phrase API endpoint instead of fish-text.ru.

Configure an S3 Lifecycle Rule for the S3 bucket using Terraform in order to delete objects on the bucket if they were not accessed for 7 days.

That will keep the bucket clean and help us avoid unnecessary costs.

https://dqrura49d0.execute-api.us-east-1.amazonaws.com/docs auto-docs does not describe the format of /methods API endpoint.

To remedy that, create a MethodDescription Pydantic model with two fields: name: str and label: Method.

Use List[MethodDescription] as response_model argument for @app.get() and return list of MethodDescription instances instead of list of dicts.

Relevant docs: https://fastapi.tiangolo.com/tutorial/response-model/

Since there is a response_model defined, it is easier to just return an instance of this model, no need to return a raw dict. Try this:

    return models.PhraseDescription(text=random_phrase.make_random_text())

Originally posted by @anatoly-scherbakov in #17 (comment)

Configure the website section at the S3 bucket configuration so that the files on the bucket are publicly available.

Terraform docs for this: https://registry.terraform.io/providers/hashicorp/aws/latest/docs/resources/s3_bucket

Terraform resource apigatewayv2_api does not provide built-in request cache, but API Gateway v1 certainly does have that feature.

• Does API Gateway v2 support caching?
• Can we use it to reduce the number of requests to Lambda?

The exception failing in tests: https://github.com/anatoly-scherbakov/geopatterns-demo/pull/10/checks?check_run_id=3226338491

On app load, fetch the methods list and use it to render the list of cards in the UI.

At the moment of this writing, the list of available generation methods (like hexagons) is hard-coded in client-side JavaScript code. That is all right but means code duplication between backend and frontend, which should ideally be reduced.

One of the ways to do that is to call a /methods/ API endpoint from front end and thus retrieve the list of the available methods. That's what is expected to be done in this task.

Via FastAPI and loremipsum library (determined at #1), create a /random-phrase endpoint using FastAPI. This endpoint will return a response like this:

{
    "text": "Lorem ipsum dolor"
}

Later, we will integrate this API into the UI as per #2.

Implement a new FastAPI endpoint named /share that has the same input parameters as /generate/ but will, instead of just returning the image, save the image in PNG format onto S3.

However, for now, for this particular task, we only need to do the following:

• generate the image;
• calculate MD5 hash of f'{phrase}|{method} string as a separate function;
• write a unit test for this function;
• return a JSON response with a URL that contains that filename, for example: https://geopatterns-demo-images.s3.amazonaws.com/{hash}.png

Use Packer to create the image, and thus avoid ad-hoc code in Makefile to build it.

As per previous issues, the /share API endpoint was implemented which is capable of saving PNG files onto S3 bucket. Also, that bucket was made publicly available. Now, we can create a "Share" button on the front end which will present the HTTPS URL of the saved file so that the user can copy it and use it elsewhere (social networks, design software, Google Docs, ...).

Right now, the list of the methods geopatterns supports is hardcoded on the front end.

Create the API endpoint and return the list of those methods in the following format:

[{
  "name": "hexagons",
  "label": "Hexagons"
}, ...]

Create a Python package named tests. In there, write a simple test function that will be executed by running pytest tests. For that, it will be necessary to poetry add --dev pytest.

In the test, it is necessary to use boto3 to access the S3 bucket and to use requests to call the API endpoint.

• call the /share endpoint with requests to save a file for a random phrase in PNG format onto S3 bucket,
• access the file location on S3 via boto3,
• and verify that the file exists.

Call the REST API determined as per #1 and display the phrase (or word, or several words) in a tag-like form beneath the phrase input field, using the means of Vue.js.

Every tag should be clickable. When clicked, the content of the tag is written into the input field and the cards are refreshed to display the ornament generated from the phrase.

The list of phrases is refreshed from the remote API.

Depends on: #1

The REST API should accept GET requests with no authorization, and return one or a few random words per request.

This API will be triggered by the front end, the user will be able to click the phrase to input it into the search field.

List the APIs found in comments to this issue.

Depends on #22.

The /random-phrase endpoint currently generates a random phrase in Latin. Like this:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quamquam te quidem video minime esse deterritum. Hic nihil fuit, quod quaereremus. Facile est hoc cernere in primis puerorum aetatulis. Quo modo autem philosophus loquitur? Id enim natura desiderat. Duo Reges: constructio interrete.

This is too long for our screen. I think that on the screen of the demo app perhaps max 3 words can fit — more will go over the screen size. And it is also not funny — a dull Lorem Ipsum text everyone has seen hundreds of times.

Can we generate something ourselves?

For example, we could have a list of adjectives:

• funny
• green
• hard
• nerdy
• wild
• …

and a list of nouns:

• programming
• Python
• clouds
• code
• …

and then create phrases from these like:

• green clouds
• nerdy kangaroo
• furry Python

whatever. Any other ideas are welcome.

When done, I also suggest to write a unit test to cover this function. This unit test might check that the output string contains two words separated by a space, for example.

https://anatoly-scherbakov.github.io/geopatterns-demo/site/ shows an error 500 for me.

[ERROR] Runtime.ImportModuleError: Unable to import module 'geopatterns_demo.api': No module named 'loremipsum'Traceback (most recent call last): | [ERROR] Runtime.ImportModuleError: Unable to import module 'geopatterns_demo.api': No module named 'loremipsum' Traceback (most recent call last):

The loremipsum module is not included into the installation package. Please include it into pyproject.toml by issuing:

poetry add loremipsum