Hi geeks, I would like to share in this post with you my example of creating a simple app that will show how I authenticate React.js frontend with Python Flask backend, and ofc I will share the link to the repo.

In our example, the app is going to do the following

  • Add a feature where the user can create a project (Creates a directory using user input)
  • upload 10 images related to traffic (Automobiles)
  • Annotate 10 images
  • On-screen a dropdown menu should be displayed with options car, bus, autorickshaw, bike
  • Users should be able to annotate multiple objects in an image.
  • Save xy,xy,xy,xy coordinates of the individual image to a .csv file
  • The format should image name and coordinates 
  • The manager should be able to view the annotated images with the bounding boxes
  •  Page write-up on how to start the application.

First, let’s start setting up the frontend with its structure and then move to the backend, for this tutorial I’m hoping that you have the basic knowledge of React.js. I will share below the link of the repo for the frontend where I will publish my code with its commits and all

https://github.com/mariatomeyan/frontend_react_annotation_app