So, for ui we planned to use express.js but it was taking a lot of time than required so we took help of the native HTML to speed up the process. First, we were trying to send the whole file to node.js which we are using as our backend after receiving it from the user on front end but the file was getting distorted and node.js was not very efficient in dealing with file and therefore we used the JavaScript’s in built file reader function to convert the file into string and send it to the backend. We are also using JQuery and AJAX to send request to the server in order to do so. Therfore we are reducing the time for the input file to reach backend to provide a smooth and fast user experience. Another problem raised in outputting the compressed file as node.js could only work on bytes at minimum level so we could not output in bits which is more efficient and necessary.
So there are two buttons for uploading one for uploading in the main interface an uncompressed file (a regular file that is yet to be compressed) and one for compressed file. So in both cases we do not send the whole file to backend server instead we convert the file into string on the front end using the JS's in built file reader function and send it to the backend by making requestes to server using JQuery and AJAX. After that backend handles the rest.
Similar to the upload buttons there are two download buttons in which one of them is used to output the compressed file based on the original file the user provided while the other button is used to provide the user with the decompressed file when it is provided with a compressed file.
So to make all of the interfaces work we are using the express routing methods. So for each button we have defined some route which it follows from the user end to the server end to get the job done. For example we want to decode a file and for that purpose user will provide a file and then will use decode button after that it will follow the path defined for it. In that path after the file's data has been converted into string and decoded by backend function res.send method returns the decoded string from which it is converted into a file and then made ready for the users and similar goes for the encoding of some file but in that case routes will be different so that the file is compressed and made available at the user end for the user.