problems.txt

1) Client and server communication: 
 - Happens when client and server are running on different ports (probably during development)
 - If using create-react-app , in package.json set "proxy" : server url(ex : "http://localhost:5000) (server is running on port 5000)
 - If using vite , add the snippet below in vite.config.js file
    server: {
        proxy: {
        '/api' : 'http://localhost:3000' (since vite uses port 5173, I set my server to use port 3000)
        }
    },
 
 2) Arrow functions not working in mongoose schema methods
 - If using mongoose, arrow functions won't work correctly on schema methods because this(keyword) in "arrow function" reference is not same as this(keyword) in "function()"
 - so it's prefferable not to use arrow functions with mongoose
 - reference "https://forum.freecodecamp.org/t/why-i-couldnt-user-arrow-function/360754"

 3) Error : form submission canceled because the form is not connected
 - This happens when you give submitHandler function to Button onClick listener
 - Instead give submitHandler function to "onSubmit" listener of form tag 

4) page reload
    -in submitHandler use e.preventDefault() whose absence is causing page reload after form submission

5) Uploading images in mongodb
    - used the method to convert image into base64 format(an image string) but the resultant string length is too large that the form cannot submit it to the backend
    - Decided to with cloud service (AWS)
    - Created a S3 free tire bucket and an IAM user who have all S3 permission
    - used aws-sdk, mutler and mutler-s3 modules to upload images in aws bucket using IAM user creds
    - used the image url and stored in mongodb

    -use latest @aws-sdk and mutler because there is a compatibility issue

    - remove all block permission to bucket and use a policy so anyone with link can access the images
    - remove "acl : public-read" from mutler-s3 boiler plate

6) Always import middlewares and  functions in routehandler with curly braces around "Ex: const { routehandler1} = require("path")"
 - see all require statements in routes Folder files