JOSIAH RACHMAT

Abstract

The completion of this project (IHPC001) aims to aid the Institute of High Performance Computing (IHPC) by providing it with a more accurate database of actions for future deep learning models to pick up and use to evaluate physical human actions. It also aims to compile multiple file type uploads into one webpage, such as files of the .babylon format, WebGL build files, etc. to show how one can import files from 3D Modelling softwares like Blender and Physics Simulators like Unity to a single web page.

Background Information of the Company:

IHPC stands for the Institute of High Performance Computing. It was established in August 1998, as a research institute under the Agency for Science, Technology, and Research (A*STAR). It promotes and spearheads scientific advancements, as well as technological innovations through computational modelling, simulation, and visualization methodologies and tools. The institute's vision is to provide leadership in high performance computing as a strategic resource for scientific inquiry and industrial development.

Task Description:

My Task:

Following the guide by Miguel Grinberg, The Mega Flask Tutorial

I started off my month of web development by following the online guide to using Flask, The Mega Flask Tutorial, by Miguel Grinberg. The guide was one that was well written and clear in explaining the thought process when developing a web application. The code is written well, as variables are named very concisely and precisely, making the end code readable and understandable.

Part of the reason why Rayson chose to give me this task instead of labelling was because he followed the guide too for the first day or two, and got very confused about why his code wasn't working, as well as copy pasted solutions with no understanding of what it did.

Following the guide taught me many new things that I did not learn despite my previous experience coding with Google, such as creating databases using SQLite, and committing data to the database that I could easily reference in my code, storing user data in these databases, creating complex systems using database relationships, such as follower functions and more, creating a Hidden Token that is encrypted to protect my website against CSRF attacks, how to deploy my website for free and more. It truly opened my eyes and has shown me that with website development, there is often more than one way to do things, and has sparked my passion to continue tinkering with different Python modules in my free time.

Finding resources to make my own website

I adapted the base Flask project structure to create my website, deployed on Heroku, which is a freemium deployment service. I sourced for different Application Programming Interfaces (APIs) that could help me to attain the website required for the end product: A dynamic site that could display me and my friends' progress throughout these four weeks, as well as display Aloycius and Yue Yang's Blender and Unity files in an interactive manner.

I used Vue.js, a front end development framework, to easily build one of the most complex parts of the website, a side navigation bar. Vue.js allows for one to easily do HTML conditional rendering based on whether a certain JavaScript condition was fulfilled, simply by using the "v-if" command.

My mentor, Chen Yi, recommended me to use Babylon.js to import the bulk of Aloycius and Yue Yang's Blender and Unity files. However, since I had no background in either, I struggled to grasp what the code was doing, as instead of having just a simple loader, one has to also use Babylon.js commands to create lights and cameras to change the perspective of the .babylon file. I had to consult my father frequently to comprehend what my code did, and often times it turns out that I coded the wrong thing, and as such, my code didn't work.

What made using Babylon.js even harder was the lack of resources online that matched my rather unique error statements, and it was only with the help of my father that I finally understood how to make the files display properly.

Final Product:

A site created using Flask showcasing the group's effort over the past month

https://wow-ihpc.herokuapp.com/

(The link to the website created using Flask, a Python micro-framework. Click on the sidebar icon at the top left corner to access other parts of the website.)

This site features the implementation of Blender and Unity files in it, as well as all the applicable knowledge from what I have learnt from The Mega Flask Tutorial. It also shows how much expertise our group has gotten over the past month, learning different processes from scratch.

While making the website, I ran into many errors, trying to import my friends' work and trying to deploy the website. Such errors would include the imported Blender files having no colour, as well as being unable to position the Unity Web Players lower so as to prevent it from overlapping other content above it, as well as running into errors of my application crashing in the midst of deployment.

To resolve these errors, I had to read up to gain knowledge common to both me and my friends working on Blender and Unity files. I then found out that the imported Blender scene did not provide any lights whatsoever, and hence, the scene would be dark. All I had to do to resolve the issue then was to simply add lights from the .babylon files.

I also had to think out of the box to prevent the Unity Web Loaders from overlapping other content. After trying desperately to reposition the Web Loader for half an hour, I decided that it would be better to let each Unity project have its own unique link, accessible by clicking on a hyperlink image from the '/presentables' page.

Lastly, I also had to do some close reading to figure out what exactly was the problem in deploying my website. The deployment error I received was unique to my case, and after reading closely did I find out that it was because the website had installed additional unwanted dependencies that had other dependencies that were nonexistent in my project directory. Thus, I had to go to the 'requirements.txt' file, which contains all the site dependencies, to remove these unwanted dependencies. That method worked like a charm and my deployed website started loading successfully.

All in all, this final product showcases the hard work all four of us have put in into completing our mentor-assigned tasks. We hope you enjoy!

Content Knowledge / Skills Learnt

I learnt three important pieces of knowledge / skills over the past month of being attached to A*STAR:

• How to write code in an efficient and readable manner

I learnt through following the guide that writing efficient code always benefits everyone in the long run as they understand what your code does, and how it does things, without you having to explain it to them in person. I have learnt how to do this by naming things in a logical manner, for example:

done = False

while not done:

return("project incomplete")

Naming the variable that passes through the while loop as 'done' allows others to comprehend that while the while loop is not done, it will continue to keep printing the statement "project incomplete".

• How to achieve more things using Python

Previously, I thought that one could not use Python to create a complex social media webpage like Facebook, Instagram, Twitter, etc. But my WOW! attachment has proven that assumption wrong, as the existence of the Flask package allows for one to easily create and use a SQLite database.

With this newfound understanding, I will continue going forth in my programming journey learning many other Python modules that can do many other different things.

• How the never ending cycle of research works

A senior programmer at A*STAR AI gathered us student interns to give us a talk about research. He said that research is something that keeps on growing, and it starts off as a theory, that goes unproven. Someone does an experiment to try and prove that theory, and others base the findings off this experiment to develop even more theories, and so on and so forth. We humans get inspiration from others and build upon their work to come up with even more extensive, complicated results.

With this knowledge in mind, the realm of Artificial Intelligence (AI) is still vastly unexplored, and treading further into this territory could yield impressive results for man and for society. Until then, I should continue to hone my coding skills to contribute to this field of research.

Interesting Aspects of what I have Learnt

There are many interesting aspects of what I have learnt, but of the most interesting are these two:

• You can use Flask and Python to create a follower/following function.

A user id needs to have a many to many database relationship with another user:

Whether the user id is following the other user id,

Whether the other user id is following the user id,

And the id of the user has to be linked to his user details too.

Creating that 'follower' function just calls for the relationship of how many user ids follow a certain user id; and creating the 'following' function calls the SQLite database relationship of how many user ids currently are under the status of following the user id. This information computed is then linked back to the user's profile page and displayed.

• With the use of APIs, one can import almost anyone else's framework into their projects; they just need to know how to use it.

There is a plethora of APIs online that can help one achieve many things. For instance, GIPHY API allows anyone who has an API key validated by the site to use any of its GIFs, and LTA's datamall allows those who have an API key to get access to bus and train arrival timings, which is where third party developers get their transport information from to develop their apps. However, the more unheard of an API is, the tougher it is to resolve errors and troubleshoot as there are less search results that showcase answers and one has to read through the documentation to see what they have missed.

A Major Takeaway for Life

Persevering in the face of difficulties

This month of being attached to A*STAR has really grown me as a person, as there have been many times that my code does not work and even with troubleshooting, I cannot find out why. However, in these times, I see my friends around me working hard on their own individual projects and it inspires me to keep on trying again, or to simply restart my progress and surpass my previous attempts.

Perseverance is not a skill; it is not easy to obtain; but to achieve great things in life one must have a great driving force that constantly pushes him forward, even in the face of adversary.